Integrations - Fairing

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>Integrations - Fairing</title> <meta name="description" content="Fairing is a question insights and analytics platform created for Shopify merchants. Start building your Question Stream today."> <meta name="robots" content="index,follow"> <meta name="author" content="undefined"> <link rel="canonical" href="https://fairing.co/integrations/"> <meta property="og:title" content="Integrations - Fairing"> <meta property="og:type" content="article"> <meta property="og:url" content="https://fairing.co/integrations/"> <meta property="og:description" content="Fairing is a question insights and analytics platform created for Shopify merchants. Start building your Question Stream today."> <meta property="og:image" content="https://fairing.co/assets/images/fairing-featured.webp"> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@Fairing"> <meta name="twitter:url" content="https://fairing.co/integrations/"> <meta name="twitter:title" content="Integrations - Fairing"> <meta name="twitter:description" content="Fairing is a question insights and analytics platform created for Shopify merchants. Start building your Question Stream today."> <meta name="twitter:image" content="https://fairing.co/assets/images/fairing-featured.webp"> <meta http-equiv="x-ua-compatible" content="ie=edge"/> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, viewport-fit=cover"/> <link rel="stylesheet" href="/css/site.css?v=65f33526a2a0f4b019ccf1105bef0bf2"/> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet"> <link href="https://assets.calendly.com/assets/external/widget.css" rel="stylesheet">  <link rel="preload" href="https://fonts.gstatic.com/s/kumbhsans/v22/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNBVo0iPw.woff2" as="font" type="font/woff2" crossorigin="anonymous"> <link rel="preload" href="https://fonts.gstatic.com/s/kumbhsans/v22/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNPVo0.woff2" as="font" type="font/woff2" crossorigin="anonymous"> <link rel="apple-touch-icon" sizes="180x180" href="/assets/images/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="/assets/images/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/assets/images/favicon-16x16.png"> <link rel="manifest" href="/assets/images/site.webmanifest"> <link rel="mask-icon" href="/assets/images/safari-pinned-tab.svg" color="#5bbad5"> <meta name="msapplication-TileColor" content="#f5f5f5"> <meta name="theme-color" content="#f5f5f5"> <script src="/assets/js/partner-stack.js" type="text/javascript" async></script> <script src="https://cdn.jsdelivr.net/npm/alpinejs@3.12.3/dist/cdn.min.js" defer></script> <script src="https://assets.calendly.com/assets/external/widget.js" type="text/javascript" async></script>  <script async src="https://www.googletagmanager.com/gtag/js?id=G-SYSFZEGJBV"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-SYSFZEGJBV'); (() => { window.addEventListener("DOMContentLoaded", () => { // Select all links that lead to the “Get Started” page let getStartedLinks = document.querySelectorAll('a[href="https://app.fairing.co"]'); // Add a click event listener to each "Get Started" link getStartedLinks.forEach(link => { link.addEventListener("click", () => { // Send event to GA4 gtag('event', 'cta_interaction', { 'event_category': 'Engagement', 'event_label': 'Clicked Get Started' }); }); }); }) })(); </script>   <script type="text/javascript" id="hs-script-loader" async defer src="//js.hs-scripts.com/6526608.js" > </script>   <script> !function(t){if(window.ko)return;window.ko=[],["identify","track","removeListeners","open","on","off","qualify","ready"].forEach(function(t){ko[t]=function(){var n=[].slice.call(arguments);return n.unshift(t),ko.push(n),ko}});var n=document.createElement("script");n.async=!0,n.setAttribute("src","https://cdn.getkoala.com/v1/pk_741b7c53479f5b226a1ab43eeebbbd1df161/sdk.js"),(document.body || document.head).appendChild(n)}(); </script>   <script> window.__positional_config = { customerId: "910fbc42-f1dd-4dca-8ca1-724ae78fd3c1", }; </script> <script defer src="https://assets.positional-bucket.com/positional.min.js"></script>   <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-K5KQRZQZ');</script>   <script>!(function(){var n=document.createElement('script'); (n.async=!0),n.setAttribute('src', 'https://tag.unifyintent.com/v1/U4fgMWHTKFo9ZpYW3pFMio/script.js'), n.setAttribute('data-api-key', 'wk_Br7hyhRq_3iqFzMrDemBjb9f95ukKosukBLwrAkNr'), n.setAttribute('id', 'unifytag'), (document.body||document.head).appendChild(n)})()</script>   <script id="vtag-ai-js" async src="https://r2.leadsy.ai/tag.js" data-pid="fRiqCPmXK8Yi7aFs" data-version="062024"></script>   <script>var SUPERFLOW_TOOLBAR_API_KEY="9dCySm401CmosfUFIiAL"; </script> <script async src="https://cdn.jsdelivr.net/npm/@usesuperflow/toolbar/superflow.min.js"></script>   <meta name="facebook-domain-verification" content="i7mzvs8x9eshma18xw3e89al01691v" />  <script type="text/javascript"> (function(c,l,a,r,i,t,y){ c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)}; t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i; y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y); })(window, document, "clarity", "script", "knd6dcgfye"); </script> </head> <body class="relative bg-white">  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-K5KQRZQZ" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>  <header class="relative isolate z-[50] bg-[#fbfcf3] sticky top-0" x-data="{ visibleMenu: null, mobileOpen: false }" x-on:click.outside="visibleMenu = null; mobileOpen = false" > <nav class="mx-auto flex max-w-7xl items-center justify-between p-6 lg:px-8" aria-label="Global" > <div class="flex lg:flex-1"> <a href="/" class="-m-1.5 p-1.5 w-[110px] lg:w-[124px]"> <span class="sr-only">Fairing</span> <img class="h-6 w-auto xl:h-8" src="/assets/images/fairing-logo.svg" alt="Fairing"> </a> </div> <div class="flex lg:hidden"> <button type="button" class="-m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700" x-on:click="mobileOpen = !mobileOpen"> <span class="sr-only">Open main menu</span> <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" /> </svg> </button> </div> <div class="hidden lg:flex lg:gap-x-8 items-center" > <div class="hidden lg:flex lg:gap-x-4 xl:gap-x-8"> <div> <button type="button" class="flex items-center gap-x-1 text-sm font-semibold leading-6 text-gray-900" aria-expanded="false" x-on:click="visibleMenu == null ? visibleMenu = 'product' : visibleMenu = null" > Product <svg class="h-5 w-5 flex-none text-gray-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" /> </svg> </button>   <div x-show="visibleMenu == 'product'" x-transition:enter="transition ease-out duration-100 transform" x-transition:enter-start="opacity-0 scale-95" x-transition:enter-end="opacity-100 scale-100" x-transition:leave="transition ease-in duration-75 transform" x-transition:leave-start="opacity-100 scale-100" x-transition:leave-end="opacity-0 scale-95" class="absolute inset-x-0 top-0 -z-10 bg-white pt-16 shadow-lg ring-1 ring-gray-900/5 submenu-option hidden" > <div class="mx-auto grid max-w-7xl grid-cols-[350px_1fr_1fr_1fr] xl:grid-cols-[450px_1fr_1fr_1fr] items-start gap-x-4 px-6 py-10 xl:gap-x-8"> <div class="flex flex-col align-end relative text-sm"> <div class="mb-3 px-2 font-medium text-sm text-[#6B7280] leading-6 uppercase"> Product </div> <a class="grid grid-cols-[2fr_3fr] grid-rows-[auto_1fr] gap-x-8 mb-8 rounded-sm px-2 hover:ring-2 hover:ring-offset-[12px] hover:ring-gray-100 transition-all" href="/product"> <img class="w-full rounded-md shadow-sm" src="/assets/images/nav/question-stream.svg"> <div class="row-span-2 flex flex-col gap-2"> <h3 class="text-base font-medium text-[#111827] leading-normal"> Question Stream™ </h3> <p class="text-sm text-[#6B7280] leading-normal"> Survey your customers and understand where they’re coming from. </p> </div> </a> <a class="grid grid-cols-[2fr_3fr] grid-rows-[auto_1fr] gap-x-8 rounded-sm px-2 hover:ring-2 hover:ring-offset-[12px] hover:ring-gray-100 transition-all" href="/product/ltv-analytics/"> <img class="w-full rounded-md shadow-sm" src="/assets/images/nav/ltv-analytics.svg"> <div class="row-span-2 flex flex-col gap-2"> <h3 class="text-base font-medium text-[#111827] leading-normal"> LTV Analytics <span class="text-sm font-medium nav-new-tag inline px-2 py-1"> New </span> </h3> <p class="text-sm text-[#6B7280] leading-normal"> Compare historical order data with HDYHAU responses to optimize marketing spend. </p> </div> </a> </div>  <div class="flex flex-col align-end relative text-sm leading-6 gap-2"> <p class="mb-3 px-2 font-medium text-sm text-[#6B7280] uppercase"> Platforms </p> <a href="/platforms/shopify-plus" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path d="m12.764 3.278-.523.164c-.055-.18-.136-.4-.25-.622-.371-.713-.915-1.092-1.57-1.093h-.003c-.045 0-.09.004-.136.009A1.37 1.37 0 0 0 9.13 1.22c-.848.024-1.692.642-2.376 1.74-.482.771-.848 1.742-.952 2.492l-1.668.522c-.491.155-.507.171-.571.638-.049.354-1.334 10.385-1.334 10.385l10.663 1.862V3.256a.642.642 0 0 0-.129.022Zm-2.462.77-1.799.562c.174-.672.504-1.34.909-1.779.15-.163.36-.345.61-.449.235.493.285 1.193.28 1.666ZM9.147 1.79a.861.861 0 0 1 .51.135c-.23.12-.45.293-.658.517-.539.583-.951 1.488-1.116 2.361l-1.476.462c.29-1.374 1.432-3.437 2.74-3.475ZM7.498 9.62c.057.915 2.444 1.115 2.578 3.26.105 1.688-.887 2.842-2.316 2.933-1.716.109-2.66-.913-2.66-.913l.363-1.56s.95.723 1.712.675c.497-.032.674-.44.657-.729-.075-1.194-2.018-1.124-2.141-3.087-.103-1.651.97-3.325 3.342-3.476.914-.058 1.382.177 1.382.177l-.543 2.047s-.604-.278-1.322-.232c-1.051.068-1.063.737-1.052.905Zm3.367-5.748c-.006-.433-.058-1.035-.257-1.556.643.123.96.857 1.093 1.295l-.836.261ZM13.246 18.817l4.424-1.11S15.765 4.71 15.753 4.62a.17.17 0 0 0-.153-.144c-.063-.005-1.31-.024-1.31-.024s-.759-.744-1.044-1.026v15.391Z" fill="#000"/> </svg> <span class="font-medium"> Shopify Plus </span> </a> <a href="/platforms/shopify" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#95BF46" d="M15.813 4.6528c-.0122-.0886-.0898-.1376-.154-.143-.064-.0054-1.4193-.1059-1.4193-.1059s-.9412-.9344-1.0445-1.0378c-.1034-.1034-.3052-.072-.3836-.0489-.0115.0034-.2056.0633-.5267.1627-.3144-.9048-.8693-1.7362-1.8455-1.7362-.027 0-.0547.0011-.0824.0027-.2777-.3672-.6216-.5267-.9186-.5267-2.274 0-3.3605 2.8428-3.701 4.2874-.8837.2738-1.5114.4684-1.5916.4936-.4933.1547-.5089.1703-.5736.635-.0488.3519-1.3393 10.3322-1.3393 10.3322l10.0562 1.8842 5.4487-1.1788S15.825 4.7414 15.813 4.6528Zm-4.0839-1.001-.8509.2634c.0003-.06.0006-.119.0006-.1835 0-.5623-.0781-1.015-.2033-1.374.503.0632.838.6355 1.0536 1.294Zm-1.6776-1.1826c.1399.3504.2308.8533.2308 1.5319 0 .0347-.0003.0665-.0006.0986l-1.7574.5442c.3384-1.306.9727-1.9367 1.5272-2.1747Zm-.6756-.6395c.0982 0 .197.0333.2917.0984-.7288.343-1.51 1.2067-1.8399 2.9315l-1.3891.4302c.3864-1.3156 1.304-3.4601 2.9373-3.4601Z"/> <path fill="#5E8E3E" d="M15.6571 4.513c-.0641-.0053-1.4193-.1057-1.4193-.1057s-.9412-.9344-1.0445-1.0379c-.0387-.0384-.0908-.0582-.1454-.0667l-.7603 15.5526 5.4483-1.1786s-1.9128-12.932-1.9248-13.0205c-.0122-.0887-.0899-.1377-.154-.1431Z"/> <path fill="#fff" d="m10.4358 7.5199-.6719 1.9985s-.5886-.3142-1.3102-.3142c-1.0578 0-1.111.6639-1.111.8312 0 .9127 2.3793 1.2625 2.3793 3.4004 0 1.6821-1.0669 2.7653-2.5054 2.7653-1.7262 0-2.609-1.0744-2.609-1.0744l.4622-1.5271s.9074.7791 1.6731.7791c.5004 0 .7039-.394.7039-.6818 0-1.1906-1.952-1.2437-1.952-3.2002 0-1.6466 1.1818-3.2401 3.5676-3.2401.9193 0 1.3734.2633 1.3734.2633Z"/> </svg> <span class="font-medium"> Shopify </span> </a> <a href="/platforms/commerce-cloud" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#00A1E0" d="M8.6582 5.641c.516-.5353 1.2345-.8673 2.029-.8673 1.0562 0 1.9776.5864 2.4684 1.457a3.4234 3.4234 0 0 1 1.3951-.2953C16.4556 5.9354 18 7.4864 18 9.3997c0 1.9135-1.5444 3.4646-3.4493 3.4646a3.4301 3.4301 0 0 1-.6795-.0674c-.4321.7675-1.2556 1.2861-2.2008 1.2861-.3956 0-.7699-.091-1.1031-.2528-.4381 1.0259-1.4587 1.7453-2.6482 1.7453-1.2388 0-2.2945-.7804-2.6997-1.8749a2.653 2.653 0 0 1-.5489.0569C3.1957 13.7576 2 12.5548 2 11.0709c0-.9944.5372-1.8627 1.3354-2.3272a3.0642 3.0642 0 0 1-.2557-1.2289c0-1.7065 1.3914-3.0899 3.1077-3.0899 1.0076 0 1.903.477 2.4708 1.2162Z"/> <path fill="#fff" d="M4.3173 10.2072c-.01.0261.0037.0316.0069.0361.03.0218.0606.0374.0914.0549.1632.0862.3172.1114.4784.1114.3282 0 .532-.1738.532-.4536v-.0055c0-.2587-.23-.3526-.4459-.4205l-.028-.009c-.1627-.0527-.3031-.098-.3031-.2047v-.0057c0-.0912.082-.1584.2092-.1584.1413 0 .309.0467.4171.1062 0 0 .0317.0204.0433-.0102.0064-.0164.061-.163.0668-.1788.0061-.0173-.0048-.03-.016-.0368-.1233-.0747-.2937-.1257-.4702-.1257l-.0328.0002c-.3004 0-.51.1806-.51.4396v.0054c0 .273.2313.3615.448.4232l.035.0107c.1579.0483.294.0899.294.2006v.0055c0 .1012-.0885.1765-.2312.1765a.7783.7783 0 0 1-.4228-.1212c-.023-.0134-.0364-.0231-.0542-.0338-.0094-.0059-.0328-.0161-.043.0148l-.0649.1788Zm4.8048 0c-.01.0261.0037.0316.0069.0361.03.0218.0606.0374.0913.0549.1632.0862.3173.1114.4785.1114.3281 0 .5319-.1738.5319-.4536v-.0055c0-.2587-.23-.3526-.4458-.4205l-.028-.009c-.1628-.0527-.3032-.098-.3032-.2047v-.0057c0-.0912.082-.1584.2093-.1584.1413 0 .309.0467.4171.1062 0 0 .0316.0204.0432-.0102.0064-.0164.0611-.163.0668-.1788.0062-.0173-.0048-.03-.0159-.0368-.1233-.0747-.2938-.1257-.4702-.1257l-.0328.0002c-.3004 0-.5101.1806-.5101.4396v.0054c0 .273.2313.3615.448.4232l.035.0107c.1579.0483.2942.0899.2942.2006v.0055c0 .1012-.0887.1765-.2313.1765a.7783.7783 0 0 1-.4228-.1212c-.023-.0134-.0367-.0227-.054-.0338-.006-.0039-.0338-.0145-.0434.0148l-.0647.1788Zm3.2801-.548c0 .158-.0296.2827-.088.3707-.0576.0872-.1449.1296-.2666.1296-.122 0-.2088-.0422-.2656-.1296-.0574-.0878-.0866-.2126-.0866-.3708 0-.158.0292-.2823.0866-.3694.0568-.0863.1436-.1282.2656-.1282.1217 0 .209.042.2669.1282.0581.087.0877.2115.0877.3694Zm.274-.2933a.656.656 0 0 0-.1247-.2369.602.602 0 0 0-.2104-.1593c-.0836-.0388-.1825-.0586-.2935-.0586-.1113 0-.2102.0198-.2938.0586a.6056.6056 0 0 0-.2106.1593.6663.6663 0 0 0-.1247.237 1.0315 1.0315 0 0 0-.0401.2931c0 .1046.0134.2034.0401.2932.0271.0903.0689.1702.1249.2369a.5883.5883 0 0 0 .2104.158c.0839.0379.1825.0571.2938.0571.111 0 .2097-.0192.2935-.0571a.5874.5874 0 0 0 .2104-.158c.0559-.0665.0978-.1463.1247-.2369.0269-.09.0403-.1888.0403-.2932 0-.1044-.0134-.2031-.0403-.2932Zm2.2497.7514c-.0091-.0266-.0349-.0166-.0349-.0166a.6298.6298 0 0 1-.1274.0363.999.999 0 0 1-.1502.0107c-.1326 0-.2379-.0393-.3134-.1169-.0756-.0776-.118-.2031-.1176-.3728.0005-.1546.0378-.2708.1051-.3593.0668-.088.1684-.1332.304-.1332.1131 0 .1993.013.2895.0413 0 0 .0216.0093.0319-.0188.0239-.0663.0417-.1137.0672-.1866.0073-.0206-.0104-.0295-.0168-.032-.0356-.0138-.1195-.0363-.1828-.0458a1.379 1.379 0 0 0-.2056-.0138c-.1151 0-.2177.0195-.3054.0585a.6322.6322 0 0 0-.2206.159.6754.6754 0 0 0-.1334.237.9404.9404 0 0 0-.0446.2936c0 .2263.0613.4092.1823.5431.1212.1343.3034.2026.5409.2026.1404 0 .2844-.0283.3879-.0689 0 0 .0198-.0096.0111-.0325l-.0672-.1849Zm.4793-.6097c.013-.0878.0374-.161.075-.2179.0568-.0864.1434-.1339.2651-.1339s.2022.0477.2598.134c.0383.0569.055.1332.0616.2178h-.6615Zm.9224-.1931c-.0232-.0874-.0809-.1757-.1187-.216-.0597-.064-.1181-.1088-.176-.1337a.6804.6804 0 0 0-.2657-.0536c-.1158 0-.2209.0193-.3061.0592a.6086.6086 0 0 0-.2136.1623.6641.6641 0 0 0-.1256.2396 1.033 1.033 0 0 0-.0408.2948c0 .1065.0142.2056.0422.2948a.608.608 0 0 0 .1345.2346c.0608.0661.1392.1178.2331.1539.0933.0359.2066.0545.3367.0542.2678-.0009.4089-.0603.467-.0923.0103-.0057.0201-.0157.0077-.0443l-.0606-.1691c-.0091-.0251-.0349-.0158-.0349-.0158-.0663.0245-.1606.0685-.3806.068-.1438-.0002-.2505-.0424-.3173-.1084-.0686-.0677-.1021-.167-.108-.3073l.9274.001s.0244-.0005.0269-.0242c.0009-.0099.0319-.1896-.0276-.3977Zm-8.3496.193c.0133-.0877.0374-.1608.075-.2178.0568-.0864.1434-.1339.2651-.1339s.2022.0477.26.134c.0381.0569.0548.1332.0614.2178H7.978Zm.9222-.193c-.0232-.0874-.0807-.1757-.1185-.216-.0597-.064-.118-.1088-.176-.1337a.6806.6806 0 0 0-.2657-.0536c-.1156 0-.2209.0193-.3061.0592a.6088.6088 0 0 0-.2136.1623.6641.6641 0 0 0-.1255.2396 1.0405 1.0405 0 0 0-.0408.2948c0 .1065.014.2056.0421.2948a.608.608 0 0 0 .1345.2346c.0609.0661.1393.1178.2332.1539.0932.0359.2065.0545.3366.0542.2678-.0009.4089-.0603.467-.0923.0103-.0057.02-.0157.0078-.0443l-.0604-.1691c-.0094-.0251-.0351-.0158-.0351-.0158-.0663.0245-.1605.0685-.3809.068-.1436-.0002-.2502-.0424-.317-.1084-.0686-.0677-.1021-.167-.108-.3073l.9273.001s.0244-.0005.027-.0242c.0008-.0099.0318-.1896-.0279-.3977Zm-2.9267.7977c-.0363-.0288-.0413-.0361-.0536-.0547-.0182-.0284-.0276-.0687-.0276-.12 0-.0813.027-.1396.0828-.1789-.0007.0003.0797-.0692.269-.0667.1328.0018.2515.0213.2515.0213v.4199s-.1176.0252-.2502.0331c-.1887.0114-.2726-.0542-.272-.054Zm.369-.6488a2.0644 2.0644 0 0 0-.1448-.0043.8828.8828 0 0 0-.2283.0293.5971.5971 0 0 0-.1938.0893.446.446 0 0 0-.1345.1523c-.0328.0609-.0494.1326-.0494.2129 0 .0817.0141.1527.0424.2108a.3813.3813 0 0 0 .121.1444c.0515.0374.1151.0649.189.0814.0727.0166.1552.025.2454.025.095 0 .1899-.0077.2817-.0234a5.9289 5.9289 0 0 0 .2336-.0449 2.4133 2.4133 0 0 0 .065-.0166c.023-.0057.0212-.0302.0212-.0302l-.0005-.8444c0-.1852-.0496-.3225-.1474-.4076-.0973-.0848-.2407-.1278-.426-.1278-.0695 0-.1814.0096-.2484.023 0 0-.2027.039-.286.104 0 0-.0183.0113-.0083.0367l.0657.1757c.0082.0226.0303.015.0303.015s.007-.0028.0153-.0076c.1784-.0966.404-.0937.404-.0937.1004 0 .1774.02.2294.0597.0505.0386.0763.0969.0763.2199v.039c-.0798-.0113-.153-.0179-.153-.0179Zm7.4799-.4758a.0248.0248 0 0 0-.0139-.0331c-.0157-.0061-.0946-.0227-.1554-.0266-.1165-.007-.1812.0125-.2391.0384-.0575.0258-.1213.0676-.1568.115V8.969c0-.0157-.0112-.0281-.0267-.0281h-.2377c-.0155 0-.0267.0124-.0267.0281v1.3773c0 .0154.0128.0281.0283.0281h.2436a.028.028 0 0 0 .028-.0281v-.688c0-.0925.0103-.1846.0308-.2424.0201-.0572.0474-.103.0812-.136a.2842.2842 0 0 1 .1146-.0685.4487.4487 0 0 1 .1245-.0175.5223.5223 0 0 1 .1018.0125c.0178.002.0278-.0089.0337-.025.016-.0422.0611-.1686.0698-.1938Z"/> <path fill="#fff" d="M11.5356 8.3493a.8042.8042 0 0 0-.0917-.0218.7284.7284 0 0 0-.126-.0095c-.1678 0-.3.0472-.3927.1402-.0923.0926-.155.2336-.1865.419l-.0114.0624h-.2105s-.0256-.001-.0311.0267l-.0344.1923c-.0025.0181.0055.0297.0301.0297h.2049l-.2078 1.1555c-.0162.0931-.0349.1696-.0557.2276-.0203.0572-.0401.1001-.0647.1314-.0237.03-.046.0522-.0848.0652a.3482.3482 0 0 1-.1092.0156.4072.4072 0 0 1-.0743-.0082.217.217 0 0 1-.0501-.0161s-.0239-.009-.0335.0148a32.0176 32.0176 0 0 0-.0688.1877c-.0064.0183.0027.0326.0143.0369a.7554.7554 0 0 0 .0848.0248c.0515.012.095.0127.1358.0127.0853 0 .1632-.012.2277-.0352.0648-.0234.1213-.064.1714-.1189.054-.0595.088-.1216.1204-.2067.0321-.084.0597-.1884.0816-.31l.209-1.1771h.3054s.0257.0009.031-.027l.0346-.192c.0023-.0184-.0054-.0297-.0303-.0297h-.2965c.0016-.0066.015-.1105.049-.2083.0146-.0416.0419-.0754.0649-.0985a.196.196 0 0 1 .0778-.0481.3239.3239 0 0 1 .0996-.0141.3904.3904 0 0 1 .0761.0075.55.55 0 0 1 .0474.0116c.0303.009.0344.0002.0404-.0143l.0709-.1938c.0072-.021-.0108-.0298-.0171-.0323Zm-4.143 1.997c0 .0155-.0112.028-.0267.028h-.246c-.0155 0-.0264-.0125-.0264-.028V8.3756c0-.0154.011-.0279.0265-.0279h.2459c.0155 0 .0266.0125.0266.028v1.9706Z"/> </svg>  <span class="font-medium"> Commerce Cloud </span> </a> <a href="/platforms/woocommerce" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1 text-gray-200" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <g clip-path="url(#a)"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#9B5C8F" d="M2.9152 4.8262H17.076c.8962 0 1.6217.7254 1.6217 1.6216v5.4053c0 .8962-.7255 1.6217-1.6217 1.6217h-5.0781l.697 1.7069-3.0655-1.7069H2.9224c-.896 0-1.6216-.7255-1.6216-1.6217V6.4478c-.007-.889.7182-1.6216 1.6144-1.6216Z"/> <path fill="#fff" d="M2.2924 6.3048c.099-.1344.2475-.205.4455-.2192.3608-.0284.5659.1413.6153.509.2192 1.478.4597 2.7299.7142 3.7553l1.5488-2.949c.1414-.2687.3183-.4101.5304-.4243.3112-.0212.502.1768.58.594.1767.9406.403 1.7397.6717 2.4186.184-1.7962.495-3.0904.9335-3.8895.106-.198.2617-.297.4668-.3112.1626-.014.311.0354.4455.1415.1343.106.205.2404.2192.403.007.1274-.0141.2334-.0707.3395-.2758.5092-.5022 1.365-.686 2.553-.1767 1.1527-.2404 2.0509-.198 2.6944.0142.1767-.0141.3323-.0848.4667-.085.1556-.2122.2405-.375.2546-.1838.0141-.3746-.0707-.5585-.2616-.6577-.6719-1.181-1.6761-1.563-3.0127-.4596.9052-.7991 1.5841-1.0183 2.0367-.4172.7991-.7708 1.2093-1.0678 1.2305-.191.0142-.3536-.1485-.495-.4879-.3607-.9265-.7497-2.7157-1.167-5.3676-.0282-.184.0142-.3466.1132-.4738ZM17.49 7.415c-.2546-.4455-.6294-.7142-1.1315-.8204-.1344-.0283-.2616-.0424-.3819-.0424-.6789 0-1.2305.3536-1.6619 1.0608-.3677.601-.5516 1.2658-.5516 1.9943 0 .5445.1132 1.0112.3395 1.4002.2545.4455.6294.7142 1.1315.8203.1343.0283.2616.0425.3819.0425.6859 0 1.2375-.3536 1.6618-1.0608.3677-.6082.5516-1.273.5516-2.0014.0071-.5515-.1131-1.0113-.3394-1.3931Zm-.891 1.9589c-.0991.4667-.2759.8132-.5376 1.0466-.205.1839-.396.2616-.5727.2263-.1698-.0354-.3113-.1838-.4173-.4597-.0849-.2192-.1272-.4384-.1272-.6435 0-.1768.0141-.3536.0494-.5162.0637-.29.1839-.573.3748-.8416.2334-.3466.4809-.488.7355-.4385.1697.0354.3112.184.4172.4597.0849.2192.1273.4385.1273.6436 0 .1838-.0141.3607-.0494.5233Zm-3.536-1.959c-.2546-.4454-.6365-.7141-1.1315-.8203-.1343-.0283-.2616-.0424-.3819-.0424-.6789 0-1.2305.3536-1.662 1.0608-.3676.601-.5515 1.2658-.5515 1.9943 0 .5445.1132 1.0112.3395 1.4002.2545.4455.6294.7142 1.1314.8203.1345.0283.2617.0425.382.0425.6859 0 1.2375-.3536 1.6618-1.0608.3678-.6082.5516-1.273.5516-2.0014 0-.5515-.1131-1.0114-.3394-1.3932Zm-.8981 1.959c-.099.4667-.2759.8132-.5375 1.0466-.2051.1839-.396.2616-.5729.2263-.1696-.0354-.3111-.1838-.4172-.4597-.0848-.2192-.1272-.4384-.1272-.6435 0-.1768.0141-.3536.0494-.5162.0637-.29.1839-.573.3749-.8416.2334-.3466.4808-.488.7354-.4385.1698.0354.3113.184.4173.4597.0849.2192.1272.4385.1272.6436.0072.1838-.0141.3607-.0494.5233Z"/> </g> <defs> <clipPath id="a"> <path fill="#fff" d="M0 0h20v20H0z"/> </clipPath> </defs> </svg>  <span class="font-medium"> WooCommerce </span> </a>  <a href="/platforms/custom" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#1E233C" d="M17.5 10 14 13.5l-.705-.705L16.085 10l-2.79-2.795L14 6.5l3.5 3.5ZM2.5 10 6 6.5l.705.705L3.915 10l2.79 2.795L6 13.5 2.5 10ZM10.8194 5.0005 8.2093 14.742l.9659.2588 2.6102-9.7413-.966-.2589Z"/> </svg>  <span class="font-medium"> Custom </span> </a>  <a href="/mobile-sdk" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.302 20H5.698a1.398 1.398 0 0 1-1.396-1.398V1.398A1.398 1.398 0 0 1 5.698 0h8.604a1.399 1.399 0 0 1 1.396 1.398v17.204A1.398 1.398 0 0 1 14.302 20ZM5.698.645a.753.753 0 0 0-.751.753v17.204a.753.753 0 0 0 .751.753h8.604a.753.753 0 0 0 .751-.753V1.398a.753.753 0 0 0-.751-.753H5.698Z" fill="#000"/><path d="M12.283 1.72H7.717L6.547.55l.455-.455.981.98h4.034l.981-.98.455.455-1.17 1.17ZM12.152 17.205H7.85v.645h4.302v-.645Z" fill="#000"/></svg>  <span class="font-medium"> Mobile SDK </span> </a> </div>  <div class="flex flex-col align-end relative text-sm leading-6 gap-2"> <div class="mb-3 px-2 font-medium text-sm text-[#6B7280] uppercase"> Integrations </div> <a href="/integrations/google-analytics-4" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#F9AB00" d="M17.0457 15.8436c.0058 1.0704-.8574 1.9419-1.9271 1.9477a1.8471 1.8471 0 0 1-.2386-.0135c-.9927-.1468-1.72-1.0107-1.6956-2.0137V4.2321c-.0237-1.0043.7054-1.8681 1.6988-2.0137 1.0627-.1244 2.0253.6362 2.1497 1.6988a1.907 1.907 0 0 1 .0128.2354v11.691Z"/> <path fill="#E37400" d="M4.8929 13.9319c1.0665 0 1.931.8645 1.931 1.931 0 1.0664-.8645 1.9309-1.931 1.9309s-1.931-.8645-1.931-1.9309c0-1.0665.8645-1.931 1.931-1.931Zm5.0804-5.852c-1.0716.059-1.9027.9575-1.8777 2.0304v5.1863c0 1.4076.6195 2.2619 1.527 2.444 1.0472.2123 2.0675-.4643 2.2798-1.5116a1.8917 1.8917 0 0 0 .0385-.3892v-5.8193c.0019-1.0703-.8639-1.9393-1.9342-1.9412-.011 0-.0225 0-.0334.0006Z"/> </svg>  <span class="font-medium"> GA4 </span> </a> <a href="/integrations/klaviyo" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#000" d="M18 15.3574H2V4.6435h16l-3.351 5.357L18 15.3574Z"/> </svg>  <span class="font-medium"> Klaviyo </span> </a> <a href="/integrations/segment" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_4847_508)"> <g clip-path="url(#clip1_4847_508)"> <path d="M17.0002 0H3.66683C1.82588 0 0.333496 1.49238 0.333496 3.33333V16.6667C0.333496 18.5076 1.82588 20 3.66683 20H17.0002C18.8411 20 20.3335 18.5076 20.3335 16.6667V3.33333C20.3335 1.49238 18.8411 0 17.0002 0Z" fill="#FCFEF5"/> <g clip-path="url(#clip2_4847_508)"> <path d="M12.3023 12.7183H3.1018C2.67923 12.7183 2.3335 12.3725 2.3335 11.9499C2.3335 11.5274 2.67923 11.1816 3.1018 11.1816H12.3023C12.7248 11.1816 13.0706 11.5274 13.0706 11.9499C13.0706 12.3725 12.7248 12.7183 12.3023 12.7183Z" fill="#99CFAC"/> <path d="M10.3429 17.4252C9.59382 17.4252 8.84472 17.3099 8.13404 17.0986C7.73068 16.9642 7.50019 16.5416 7.63464 16.1382C7.76909 15.7349 8.19166 15.5044 8.59502 15.6388C9.15205 15.8117 9.74748 15.9077 10.3429 15.9077C12.9552 15.9077 15.2217 14.2367 15.9708 11.7397C16.086 11.3363 16.5278 11.1058 16.9312 11.2211C17.3345 11.3363 17.565 11.7781 17.4498 12.1815C16.4702 15.3123 13.6274 17.4252 10.3429 17.4252Z" fill="#49B881"/> <path d="M17.565 8.81982H8.3645C7.94193 8.81982 7.59619 8.47408 7.59619 8.05151C7.59619 7.62894 7.94193 7.2832 8.3645 7.2832H17.565C17.9875 7.2832 18.3333 7.62894 18.3333 8.05151C18.3333 8.47408 17.9875 8.81982 17.565 8.81982Z" fill="#99CFAC"/> <path d="M3.96529 8.81964C3.88846 8.81964 3.81163 8.80044 3.7348 8.78123C3.33144 8.66598 3.10094 8.22421 3.21619 7.82084C4.19578 4.68999 7.03852 2.57715 10.3422 2.57715C11.0913 2.57715 11.8404 2.69239 12.5511 2.90368C12.9545 3.03813 13.185 3.4607 13.0505 3.86406C12.9161 4.26742 12.4935 4.49792 12.0901 4.36346C11.5331 4.19059 10.9377 4.09455 10.3422 4.09455C7.72999 4.09455 5.46349 5.76562 4.71439 8.26262C4.59914 8.60836 4.29182 8.81964 3.96529 8.81964Z" fill="#49B881"/> <path d="M14.8962 5.89892C15.3206 5.89892 15.6645 5.55494 15.6645 5.13061C15.6645 4.70629 15.3206 4.3623 14.8962 4.3623C14.4719 4.3623 14.1279 4.70629 14.1279 5.13061C14.1279 5.55494 14.4719 5.89892 14.8962 5.89892Z" fill="#99CFAC"/> <path d="M5.77124 15.6567C6.19556 15.6567 6.53954 15.3127 6.53954 14.8884C6.53954 14.4641 6.19556 14.1201 5.77124 14.1201C5.34691 14.1201 5.00293 14.4641 5.00293 14.8884C5.00293 15.3127 5.34691 15.6567 5.77124 15.6567Z" fill="#99CFAC"/> </g> </g> </g> <defs> <clipPath id="clip0_4847_508"> <rect width="20" height="20" fill="white" transform="translate(0.333496)"/> </clipPath> <clipPath id="clip1_4847_508"> <rect width="20" height="20" fill="white" transform="translate(0.333496)"/> </clipPath> <clipPath id="clip2_4847_508"> <rect width="16" height="16" fill="white" transform="translate(2.3335 2)"/> </clipPath> </defs> </svg>  <span class="font-medium"> Segment </span> </a> <a href="/integrations/rockerbox" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#7B5DF4" d="M10.2168 6.113H5.9993v4.1231h4.2175V6.1129Z"/> <path fill="#7B5DF4" d="M2 10.0025v7.7729h4.1574v-7.7729H2ZM17.9971 2.2265h-3.9993v4.031h3.9993v-4.031Z"/> <path fill="#A793F7" d="M5.9993 10.0025v7.7729h4.1479v-7.7729h-4.148Z"/> <path fill="#A793F7" d="M9.998 6.116v4.0524h7.9985V6.1159H9.998Z"/> <path fill="#D3C9FB" d="M9.998 10.0025v7.7729h3.9993v-3.8896h3.9992v-3.8833H9.998Z"/> <path fill="#fff" d="M18.0001 13.7751h-4.1163v3.9971h4.1163v-3.9971Z"/> </svg>  <span class="font-medium"> Rockerbox </span> </a> <a href="/integrations/shopify-flow" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="url(#flow_gradient)" d="M16 2H4c-1.1046 0-2 .8954-2 2v12c0 1.1046.8954 2 2 2h12c1.1046 0 2-.8954 2-2V4c0-1.1046-.8954-2-2-2Z"/> <path fill="#fff" stroke="#000" stroke-width="0.638889" d="M8.5703 12.4434c0 .9282-.7524 1.6806-1.6805 1.6806-.9282 0-1.6806-.7524-1.6806-1.6806 0-.9282.7524-1.6806 1.6806-1.6806.9281 0 1.6805.7524 1.6805 1.6806Z"/> <path fill="#A1A1AA" stroke="#000" stroke-width="0.638889" d="M14.792 12.4434c0 .9282-.7524 1.6806-1.6806 1.6806-.9281 0-1.6805-.7524-1.6805-1.6806 0-.9282.7524-1.6806 1.6805-1.6806.9282 0 1.6806.7524 1.6806 1.6806Z"/> <path fill="#fff" stroke="#000" stroke-width="0.638889" d="M11.6812 7.556c0 .9282-.7524 1.6806-1.6806 1.6806-.9281 0-1.6805-.7524-1.6805-1.6806 0-.9281.7524-1.6805 1.6805-1.6805.9282 0 1.6806.7524 1.6806 1.6805Z"/> <path fill="#000" d="M12.0643 9.8287a.3333.3333 0 0 0-.5717.3429l.5717-.3429Zm-.5717.3429.686 1.1434.5717-.343-.686-1.1433-.5717.3429Z"/> <defs> <linearGradient id="flow_gradient" x1="4.5498" x2="21.4591" y1="2" y2="12.3473" gradientUnits="userSpaceOnUse"> <stop stop-color="#D0F224"/> <stop offset="1" stop-color="#79DFFF"/> </linearGradient> </defs> </svg>  <span class="font-medium"> Shopify Flow </span> </a> <a href="/integrations" class="block px-2 py-1 mt-2 underline underline-offset-2 hover:tex-gray-100"> See All Integrations → </a> </div>  <div class="flex flex-col align-end relative text-sm leading-6 gap-2"> <div class="mb-3 px-2 font-medium text-sm text-[#6B7280] uppercase"> Use case </div> <a href="/use-cases/attribution" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <img src="/assets/images/nav/attribution.svg">  <span class="font-medium"> Attribution </span> </a> <a href="/use-cases/personalization" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <img src="/assets/images/nav/personalization.svg">  <span class="font-medium"> Personalization </span> </a> <a href="/use-cases/customer-research/" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <img src="/assets/images/nav/research.svg">  <span class="font-medium"> Research </span> </a> <a href="/use-cases/conversion-rate-optimization" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <img src="/assets/images/nav/cro.svg">  <span class="font-medium"> CRO </span> </a> </div>  </div> </div>  </div> <a href="/pricing" class="text-sm font-semibold leading-6 text-gray-900"> Pricing </a> <a href="/case-studies" class="text-sm font-semibold leading-6 text-gray-900"> Case Studies </a>  <div> <button type="button" class="flex items-center gap-x-1 text-sm font-semibold leading-6 text-gray-900" aria-expanded="false" x-on:click="visibleMenu == null ? visibleMenu = 'resources' : visibleMenu = null" > Resources <svg class="h-5 w-5 flex-none text-gray-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd" /> </svg> </button>   <div x-show="visibleMenu == 'resources'" x-transition:enter="transition ease-out duration-100 transform" x-transition:enter-start="opacity-0 scale-95" x-transition:enter-end="opacity-100 scale-100" x-transition:leave="transition ease-in duration-75 transform" x-transition:leave-start="opacity-100 scale-100" x-transition:leave-end="opacity-0 scale-95" class="absolute inset-x-0 top-0 -z-10 bg-white pt-16 shadow-lg ring-1 ring-gray-900/5 submenu-option hidden" > <div class="mx-auto grid max-w-7xl grid-cols-[350px_1fr_1fr_1fr] xl:grid-cols-[450px_1fr_1fr_1fr] items-start gap-x-4 px-6 py-10 xl:gap-x-8"> <div class="flex flex-col align-end relative text-sm"> <div class="mb-3 px-2 font-medium text-sm text-[#6B7280] leading-6 uppercase"> Learn </div> <a class="grid grid-cols-[2fr_3fr] grid-rows-[auto_1fr] gap-x-8 mb-8 rounded-sm px-2 hover:ring-2 hover:ring-offset-[12px] hover:ring-gray-100 transition-all" href="/learn/attribution-academy/"> <img class="w-full rounded-md shadow-sm" src="/assets/images/nav/attribution-academy.svg"> <div class="row-span-2 flex flex-col gap-2"> <h3 class="text-base font-medium text-[#111827] leading-normal"> Attribution Academy <span class="text-sm font-medium nav-new-tag inline px-2 py-1"> New </span> </h3> <p class="text-sm text-[#6B7280] leading-normal"> 12 lessons on attribution from industry-leading experts. </p> </div> </a> </div> <div class="flex flex-col align-end relative p-6 pt-0 text-sm leading-6 gap-2"> <div class="flex items-center gap-2 mb-3 px-2"> <span class="block font-medium text-sm text-[#6B7280] uppercase"> Support </span> </div> <a href="https://docs.fairing.co" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/docs-icon.svg" aria-hidden="true"> <span class="font-medium"> Docs </span> </a> <div onclick="Intercom('showNewMessage')" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/contact-us-icon.svg" aria-hidden="true"> <span class="font-medium"> Contact Us </span> </div> <a href="https://docs.fairing.co/docs/faqs" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/faqs-icon.svg" aria-hidden="true"> <span class="font-medium"> FAQ </span> </a> </div> <div class="flex flex-col align-end relative p-6 pt-0 text-sm leading-6 gap-2"> <div class="flex items-center gap-2 mb-3 px-2"> <span class="block font-medium text-sm text-[#6B7280] uppercase"> Partner </span> </div> <a href="/partners" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/company-icon.svg" aria-hidden="true"> <span class="font-medium"> Our Partners </span> </a> <a href="/partner-program" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/partner-program-icon.svg" aria-hidden="true"> <span class="font-medium"> Partner Program </span> </a> </div> <div class="flex flex-col align-end relative p-6 pt-0 text-sm leading-6 gap-2"> <div class="flex items-center gap-2 mb-3 px-2"> <span class="block font-medium text-sm text-[#6B7280] uppercase"> About </span> </div> <a href="/blog" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/blog-icon.svg" aria-hidden="true"> <span class="font-medium"> Blog </span> </a> <a href="/about" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/company-icon.svg" aria-hidden="true"> <span class="font-medium"> Company </span> </a> <a href="https://jobs.ashbyhq.com/Fairing/" target="_blank" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/work-with-us-icon.svg" aria-hidden="true"> <span class="font-medium"> Work with Us </span> </a> <a href="/blog/company/what-is-a-fairing" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/what-is-icon.svg" aria-hidden="true"> <span class="font-medium"> What is a Fairing? </span> </a> <a href="/resource-center/" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/docs-icon.svg" aria-hidden="true"> <span class="font-medium"> Resource Center </span> </a> </div> </div> </div>  </div>  </div> </div> <div class="hidden lg:flex lg:flex-1 lg:justify-end items-center gap-4"> <a href="https://meetings.fairing.co/meetings/fairing/product-demo-round-robin" target="_blank" class="text-sm leading-6 text-gray-900 font-medium"> Book a Demo </a> <a href="https://app.fairing.co" class="px-4 py-3 rounded-md bg-gray-900 hover:bg-gray-700 text-sm font-semibold leading-none text-white transition-all"> Get Started </a> </div> </nav>  <div class="lg:hidden" role="dialog" aria-modal="true" x-bind:class="!mobileOpen && 'hidden'" >  <div class="fixed inset-0 z-10"></div> <div class="fixed inset-y-0 right-0 z-10 w-full overflow-y-auto bg-white px-6 py-6 sm:max-w-sm sm:ring-1 sm:ring-gray-900/10 submenu-option hidden"> <div class="flex items-center justify-between"> <a href="/" class="-m-1.5 p-1.5"> <span class="sr-only">Fairing</span> <img class="h-8 w-auto" src="/assets/images/fairing-logo.svg" alt=""> </a> <button type="button" class="-m-2.5 rounded-md p-2.5 text-gray-700" x-on:click="mobileOpen = !mobileOpen"> <span class="sr-only">Close menu</span> <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" /> </svg> </button> </div> <div class="flex flex-col gap-6 mt-8">  <div x-data="{ openProduct: false }"> <button @click="openProduct = !openProduct" class="flex justify-between items-center w-full text-[#3F3F4C] font-bold text-lg text-left"> Product <svg :class="openProduct ? 'rotate-180' : ''" class="w-5 h-5 transform transition-transform" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" /> </svg> </button> <div x-show="openProduct" class="mt-8 space-y-2"> <a class="grid grid-cols-[130px_auto] gap-4 px-2 items-center" href="/product"> <img class="w-full rounded-md shadow-sm" src="/assets/images/nav/question-stream.svg" /> <h3 class="text-base font-medium text-[#111827] leading-normal"> Question Stream™ </h3> </a> <a class="grid grid-cols-[130px_auto] gap-4 px-2 items-center !mt-5" href="/product/ltv-analytics/"> <img class="w-full rounded-md shadow-sm" src="/assets/images/nav/ltv-analytics.svg" /> <h3 class="text-base font-medium text-[#111827] leading-normal"> LTV Analytics <span class="text-sm font-medium nav-new-tag inline px-2 py-1"> New </span> </h3> </a> <div class="pt-8"> <p class="mb-3 px-2 font-medium uppercase text-[#6B7280] text-sm"> Platforms </p> <div class="px-2"> <a href="/platforms/shopify-plus" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path d="m12.764 3.278-.523.164c-.055-.18-.136-.4-.25-.622-.371-.713-.915-1.092-1.57-1.093h-.003c-.045 0-.09.004-.136.009A1.37 1.37 0 0 0 9.13 1.22c-.848.024-1.692.642-2.376 1.74-.482.771-.848 1.742-.952 2.492l-1.668.522c-.491.155-.507.171-.571.638-.049.354-1.334 10.385-1.334 10.385l10.663 1.862V3.256a.642.642 0 0 0-.129.022Zm-2.462.77-1.799.562c.174-.672.504-1.34.909-1.779.15-.163.36-.345.61-.449.235.493.285 1.193.28 1.666ZM9.147 1.79a.861.861 0 0 1 .51.135c-.23.12-.45.293-.658.517-.539.583-.951 1.488-1.116 2.361l-1.476.462c.29-1.374 1.432-3.437 2.74-3.475ZM7.498 9.62c.057.915 2.444 1.115 2.578 3.26.105 1.688-.887 2.842-2.316 2.933-1.716.109-2.66-.913-2.66-.913l.363-1.56s.95.723 1.712.675c.497-.032.674-.44.657-.729-.075-1.194-2.018-1.124-2.141-3.087-.103-1.651.97-3.325 3.342-3.476.914-.058 1.382.177 1.382.177l-.543 2.047s-.604-.278-1.322-.232c-1.051.068-1.063.737-1.052.905Zm3.367-5.748c-.006-.433-.058-1.035-.257-1.556.643.123.96.857 1.093 1.295l-.836.261ZM13.246 18.817l4.424-1.11S15.765 4.71 15.753 4.62a.17.17 0 0 0-.153-.144c-.063-.005-1.31-.024-1.31-.024s-.759-.744-1.044-1.026v15.391Z" fill="#000"/> </svg> <span> Shopify Plus </span> </a> <a href="/platforms/shopify" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#95BF46" d="M15.813 4.6528c-.0122-.0886-.0898-.1376-.154-.143-.064-.0054-1.4193-.1059-1.4193-.1059s-.9412-.9344-1.0445-1.0378c-.1034-.1034-.3052-.072-.3836-.0489-.0115.0034-.2056.0633-.5267.1627-.3144-.9048-.8693-1.7362-1.8455-1.7362-.027 0-.0547.0011-.0824.0027-.2777-.3672-.6216-.5267-.9186-.5267-2.274 0-3.3605 2.8428-3.701 4.2874-.8837.2738-1.5114.4684-1.5916.4936-.4933.1547-.5089.1703-.5736.635-.0488.3519-1.3393 10.3322-1.3393 10.3322l10.0562 1.8842 5.4487-1.1788S15.825 4.7414 15.813 4.6528Zm-4.0839-1.001-.8509.2634c.0003-.06.0006-.119.0006-.1835 0-.5623-.0781-1.015-.2033-1.374.503.0632.838.6355 1.0536 1.294Zm-1.6776-1.1826c.1399.3504.2308.8533.2308 1.5319 0 .0347-.0003.0665-.0006.0986l-1.7574.5442c.3384-1.306.9727-1.9367 1.5272-2.1747Zm-.6756-.6395c.0982 0 .197.0333.2917.0984-.7288.343-1.51 1.2067-1.8399 2.9315l-1.3891.4302c.3864-1.3156 1.304-3.4601 2.9373-3.4601Z"/> <path fill="#5E8E3E" d="M15.6571 4.513c-.0641-.0053-1.4193-.1057-1.4193-.1057s-.9412-.9344-1.0445-1.0379c-.0387-.0384-.0908-.0582-.1454-.0667l-.7603 15.5526 5.4483-1.1786s-1.9128-12.932-1.9248-13.0205c-.0122-.0887-.0899-.1377-.154-.1431Z"/> <path fill="#fff" d="m10.4358 7.5199-.6719 1.9985s-.5886-.3142-1.3102-.3142c-1.0578 0-1.111.6639-1.111.8312 0 .9127 2.3793 1.2625 2.3793 3.4004 0 1.6821-1.0669 2.7653-2.5054 2.7653-1.7262 0-2.609-1.0744-2.609-1.0744l.4622-1.5271s.9074.7791 1.6731.7791c.5004 0 .7039-.394.7039-.6818 0-1.1906-1.952-1.2437-1.952-3.2002 0-1.6466 1.1818-3.2401 3.5676-3.2401.9193 0 1.3734.2633 1.3734.2633Z"/> </svg> <span> Shopify </span> </a> <a href="/platforms/commerce-cloud" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#00A1E0" d="M8.6582 5.641c.516-.5353 1.2345-.8673 2.029-.8673 1.0562 0 1.9776.5864 2.4684 1.457a3.4234 3.4234 0 0 1 1.3951-.2953C16.4556 5.9354 18 7.4864 18 9.3997c0 1.9135-1.5444 3.4646-3.4493 3.4646a3.4301 3.4301 0 0 1-.6795-.0674c-.4321.7675-1.2556 1.2861-2.2008 1.2861-.3956 0-.7699-.091-1.1031-.2528-.4381 1.0259-1.4587 1.7453-2.6482 1.7453-1.2388 0-2.2945-.7804-2.6997-1.8749a2.653 2.653 0 0 1-.5489.0569C3.1957 13.7576 2 12.5548 2 11.0709c0-.9944.5372-1.8627 1.3354-2.3272a3.0642 3.0642 0 0 1-.2557-1.2289c0-1.7065 1.3914-3.0899 3.1077-3.0899 1.0076 0 1.903.477 2.4708 1.2162Z"/> <path fill="#fff" d="M4.3173 10.2072c-.01.0261.0037.0316.0069.0361.03.0218.0606.0374.0914.0549.1632.0862.3172.1114.4784.1114.3282 0 .532-.1738.532-.4536v-.0055c0-.2587-.23-.3526-.4459-.4205l-.028-.009c-.1627-.0527-.3031-.098-.3031-.2047v-.0057c0-.0912.082-.1584.2092-.1584.1413 0 .309.0467.4171.1062 0 0 .0317.0204.0433-.0102.0064-.0164.061-.163.0668-.1788.0061-.0173-.0048-.03-.016-.0368-.1233-.0747-.2937-.1257-.4702-.1257l-.0328.0002c-.3004 0-.51.1806-.51.4396v.0054c0 .273.2313.3615.448.4232l.035.0107c.1579.0483.294.0899.294.2006v.0055c0 .1012-.0885.1765-.2312.1765a.7783.7783 0 0 1-.4228-.1212c-.023-.0134-.0364-.0231-.0542-.0338-.0094-.0059-.0328-.0161-.043.0148l-.0649.1788Zm4.8048 0c-.01.0261.0037.0316.0069.0361.03.0218.0606.0374.0913.0549.1632.0862.3173.1114.4785.1114.3281 0 .5319-.1738.5319-.4536v-.0055c0-.2587-.23-.3526-.4458-.4205l-.028-.009c-.1628-.0527-.3032-.098-.3032-.2047v-.0057c0-.0912.082-.1584.2093-.1584.1413 0 .309.0467.4171.1062 0 0 .0316.0204.0432-.0102.0064-.0164.0611-.163.0668-.1788.0062-.0173-.0048-.03-.0159-.0368-.1233-.0747-.2938-.1257-.4702-.1257l-.0328.0002c-.3004 0-.5101.1806-.5101.4396v.0054c0 .273.2313.3615.448.4232l.035.0107c.1579.0483.2942.0899.2942.2006v.0055c0 .1012-.0887.1765-.2313.1765a.7783.7783 0 0 1-.4228-.1212c-.023-.0134-.0367-.0227-.054-.0338-.006-.0039-.0338-.0145-.0434.0148l-.0647.1788Zm3.2801-.548c0 .158-.0296.2827-.088.3707-.0576.0872-.1449.1296-.2666.1296-.122 0-.2088-.0422-.2656-.1296-.0574-.0878-.0866-.2126-.0866-.3708 0-.158.0292-.2823.0866-.3694.0568-.0863.1436-.1282.2656-.1282.1217 0 .209.042.2669.1282.0581.087.0877.2115.0877.3694Zm.274-.2933a.656.656 0 0 0-.1247-.2369.602.602 0 0 0-.2104-.1593c-.0836-.0388-.1825-.0586-.2935-.0586-.1113 0-.2102.0198-.2938.0586a.6056.6056 0 0 0-.2106.1593.6663.6663 0 0 0-.1247.237 1.0315 1.0315 0 0 0-.0401.2931c0 .1046.0134.2034.0401.2932.0271.0903.0689.1702.1249.2369a.5883.5883 0 0 0 .2104.158c.0839.0379.1825.0571.2938.0571.111 0 .2097-.0192.2935-.0571a.5874.5874 0 0 0 .2104-.158c.0559-.0665.0978-.1463.1247-.2369.0269-.09.0403-.1888.0403-.2932 0-.1044-.0134-.2031-.0403-.2932Zm2.2497.7514c-.0091-.0266-.0349-.0166-.0349-.0166a.6298.6298 0 0 1-.1274.0363.999.999 0 0 1-.1502.0107c-.1326 0-.2379-.0393-.3134-.1169-.0756-.0776-.118-.2031-.1176-.3728.0005-.1546.0378-.2708.1051-.3593.0668-.088.1684-.1332.304-.1332.1131 0 .1993.013.2895.0413 0 0 .0216.0093.0319-.0188.0239-.0663.0417-.1137.0672-.1866.0073-.0206-.0104-.0295-.0168-.032-.0356-.0138-.1195-.0363-.1828-.0458a1.379 1.379 0 0 0-.2056-.0138c-.1151 0-.2177.0195-.3054.0585a.6322.6322 0 0 0-.2206.159.6754.6754 0 0 0-.1334.237.9404.9404 0 0 0-.0446.2936c0 .2263.0613.4092.1823.5431.1212.1343.3034.2026.5409.2026.1404 0 .2844-.0283.3879-.0689 0 0 .0198-.0096.0111-.0325l-.0672-.1849Zm.4793-.6097c.013-.0878.0374-.161.075-.2179.0568-.0864.1434-.1339.2651-.1339s.2022.0477.2598.134c.0383.0569.055.1332.0616.2178h-.6615Zm.9224-.1931c-.0232-.0874-.0809-.1757-.1187-.216-.0597-.064-.1181-.1088-.176-.1337a.6804.6804 0 0 0-.2657-.0536c-.1158 0-.2209.0193-.3061.0592a.6086.6086 0 0 0-.2136.1623.6641.6641 0 0 0-.1256.2396 1.033 1.033 0 0 0-.0408.2948c0 .1065.0142.2056.0422.2948a.608.608 0 0 0 .1345.2346c.0608.0661.1392.1178.2331.1539.0933.0359.2066.0545.3367.0542.2678-.0009.4089-.0603.467-.0923.0103-.0057.0201-.0157.0077-.0443l-.0606-.1691c-.0091-.0251-.0349-.0158-.0349-.0158-.0663.0245-.1606.0685-.3806.068-.1438-.0002-.2505-.0424-.3173-.1084-.0686-.0677-.1021-.167-.108-.3073l.9274.001s.0244-.0005.0269-.0242c.0009-.0099.0319-.1896-.0276-.3977Zm-8.3496.193c.0133-.0877.0374-.1608.075-.2178.0568-.0864.1434-.1339.2651-.1339s.2022.0477.26.134c.0381.0569.0548.1332.0614.2178H7.978Zm.9222-.193c-.0232-.0874-.0807-.1757-.1185-.216-.0597-.064-.118-.1088-.176-.1337a.6806.6806 0 0 0-.2657-.0536c-.1156 0-.2209.0193-.3061.0592a.6088.6088 0 0 0-.2136.1623.6641.6641 0 0 0-.1255.2396 1.0405 1.0405 0 0 0-.0408.2948c0 .1065.014.2056.0421.2948a.608.608 0 0 0 .1345.2346c.0609.0661.1393.1178.2332.1539.0932.0359.2065.0545.3366.0542.2678-.0009.4089-.0603.467-.0923.0103-.0057.02-.0157.0078-.0443l-.0604-.1691c-.0094-.0251-.0351-.0158-.0351-.0158-.0663.0245-.1605.0685-.3809.068-.1436-.0002-.2502-.0424-.317-.1084-.0686-.0677-.1021-.167-.108-.3073l.9273.001s.0244-.0005.027-.0242c.0008-.0099.0318-.1896-.0279-.3977Zm-2.9267.7977c-.0363-.0288-.0413-.0361-.0536-.0547-.0182-.0284-.0276-.0687-.0276-.12 0-.0813.027-.1396.0828-.1789-.0007.0003.0797-.0692.269-.0667.1328.0018.2515.0213.2515.0213v.4199s-.1176.0252-.2502.0331c-.1887.0114-.2726-.0542-.272-.054Zm.369-.6488a2.0644 2.0644 0 0 0-.1448-.0043.8828.8828 0 0 0-.2283.0293.5971.5971 0 0 0-.1938.0893.446.446 0 0 0-.1345.1523c-.0328.0609-.0494.1326-.0494.2129 0 .0817.0141.1527.0424.2108a.3813.3813 0 0 0 .121.1444c.0515.0374.1151.0649.189.0814.0727.0166.1552.025.2454.025.095 0 .1899-.0077.2817-.0234a5.9289 5.9289 0 0 0 .2336-.0449 2.4133 2.4133 0 0 0 .065-.0166c.023-.0057.0212-.0302.0212-.0302l-.0005-.8444c0-.1852-.0496-.3225-.1474-.4076-.0973-.0848-.2407-.1278-.426-.1278-.0695 0-.1814.0096-.2484.023 0 0-.2027.039-.286.104 0 0-.0183.0113-.0083.0367l.0657.1757c.0082.0226.0303.015.0303.015s.007-.0028.0153-.0076c.1784-.0966.404-.0937.404-.0937.1004 0 .1774.02.2294.0597.0505.0386.0763.0969.0763.2199v.039c-.0798-.0113-.153-.0179-.153-.0179Zm7.4799-.4758a.0248.0248 0 0 0-.0139-.0331c-.0157-.0061-.0946-.0227-.1554-.0266-.1165-.007-.1812.0125-.2391.0384-.0575.0258-.1213.0676-.1568.115V8.969c0-.0157-.0112-.0281-.0267-.0281h-.2377c-.0155 0-.0267.0124-.0267.0281v1.3773c0 .0154.0128.0281.0283.0281h.2436a.028.028 0 0 0 .028-.0281v-.688c0-.0925.0103-.1846.0308-.2424.0201-.0572.0474-.103.0812-.136a.2842.2842 0 0 1 .1146-.0685.4487.4487 0 0 1 .1245-.0175.5223.5223 0 0 1 .1018.0125c.0178.002.0278-.0089.0337-.025.016-.0422.0611-.1686.0698-.1938Z"/> <path fill="#fff" d="M11.5356 8.3493a.8042.8042 0 0 0-.0917-.0218.7284.7284 0 0 0-.126-.0095c-.1678 0-.3.0472-.3927.1402-.0923.0926-.155.2336-.1865.419l-.0114.0624h-.2105s-.0256-.001-.0311.0267l-.0344.1923c-.0025.0181.0055.0297.0301.0297h.2049l-.2078 1.1555c-.0162.0931-.0349.1696-.0557.2276-.0203.0572-.0401.1001-.0647.1314-.0237.03-.046.0522-.0848.0652a.3482.3482 0 0 1-.1092.0156.4072.4072 0 0 1-.0743-.0082.217.217 0 0 1-.0501-.0161s-.0239-.009-.0335.0148a32.0176 32.0176 0 0 0-.0688.1877c-.0064.0183.0027.0326.0143.0369a.7554.7554 0 0 0 .0848.0248c.0515.012.095.0127.1358.0127.0853 0 .1632-.012.2277-.0352.0648-.0234.1213-.064.1714-.1189.054-.0595.088-.1216.1204-.2067.0321-.084.0597-.1884.0816-.31l.209-1.1771h.3054s.0257.0009.031-.027l.0346-.192c.0023-.0184-.0054-.0297-.0303-.0297h-.2965c.0016-.0066.015-.1105.049-.2083.0146-.0416.0419-.0754.0649-.0985a.196.196 0 0 1 .0778-.0481.3239.3239 0 0 1 .0996-.0141.3904.3904 0 0 1 .0761.0075.55.55 0 0 1 .0474.0116c.0303.009.0344.0002.0404-.0143l.0709-.1938c.0072-.021-.0108-.0298-.0171-.0323Zm-4.143 1.997c0 .0155-.0112.028-.0267.028h-.246c-.0155 0-.0264-.0125-.0264-.028V8.3756c0-.0154.011-.0279.0265-.0279h.2459c.0155 0 .0266.0125.0266.028v1.9706Z"/> </svg>  <span> Commerce Cloud </span> </a> <a href="/platforms/woocommerce" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1 text-gray-200" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <g clip-path="url(#a)"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#9B5C8F" d="M2.9152 4.8262H17.076c.8962 0 1.6217.7254 1.6217 1.6216v5.4053c0 .8962-.7255 1.6217-1.6217 1.6217h-5.0781l.697 1.7069-3.0655-1.7069H2.9224c-.896 0-1.6216-.7255-1.6216-1.6217V6.4478c-.007-.889.7182-1.6216 1.6144-1.6216Z"/> <path fill="#fff" d="M2.2924 6.3048c.099-.1344.2475-.205.4455-.2192.3608-.0284.5659.1413.6153.509.2192 1.478.4597 2.7299.7142 3.7553l1.5488-2.949c.1414-.2687.3183-.4101.5304-.4243.3112-.0212.502.1768.58.594.1767.9406.403 1.7397.6717 2.4186.184-1.7962.495-3.0904.9335-3.8895.106-.198.2617-.297.4668-.3112.1626-.014.311.0354.4455.1415.1343.106.205.2404.2192.403.007.1274-.0141.2334-.0707.3395-.2758.5092-.5022 1.365-.686 2.553-.1767 1.1527-.2404 2.0509-.198 2.6944.0142.1767-.0141.3323-.0848.4667-.085.1556-.2122.2405-.375.2546-.1838.0141-.3746-.0707-.5585-.2616-.6577-.6719-1.181-1.6761-1.563-3.0127-.4596.9052-.7991 1.5841-1.0183 2.0367-.4172.7991-.7708 1.2093-1.0678 1.2305-.191.0142-.3536-.1485-.495-.4879-.3607-.9265-.7497-2.7157-1.167-5.3676-.0282-.184.0142-.3466.1132-.4738ZM17.49 7.415c-.2546-.4455-.6294-.7142-1.1315-.8204-.1344-.0283-.2616-.0424-.3819-.0424-.6789 0-1.2305.3536-1.6619 1.0608-.3677.601-.5516 1.2658-.5516 1.9943 0 .5445.1132 1.0112.3395 1.4002.2545.4455.6294.7142 1.1315.8203.1343.0283.2616.0425.3819.0425.6859 0 1.2375-.3536 1.6618-1.0608.3677-.6082.5516-1.273.5516-2.0014.0071-.5515-.1131-1.0113-.3394-1.3931Zm-.891 1.9589c-.0991.4667-.2759.8132-.5376 1.0466-.205.1839-.396.2616-.5727.2263-.1698-.0354-.3113-.1838-.4173-.4597-.0849-.2192-.1272-.4384-.1272-.6435 0-.1768.0141-.3536.0494-.5162.0637-.29.1839-.573.3748-.8416.2334-.3466.4809-.488.7355-.4385.1697.0354.3112.184.4172.4597.0849.2192.1273.4385.1273.6436 0 .1838-.0141.3607-.0494.5233Zm-3.536-1.959c-.2546-.4454-.6365-.7141-1.1315-.8203-.1343-.0283-.2616-.0424-.3819-.0424-.6789 0-1.2305.3536-1.662 1.0608-.3676.601-.5515 1.2658-.5515 1.9943 0 .5445.1132 1.0112.3395 1.4002.2545.4455.6294.7142 1.1314.8203.1345.0283.2617.0425.382.0425.6859 0 1.2375-.3536 1.6618-1.0608.3678-.6082.5516-1.273.5516-2.0014 0-.5515-.1131-1.0114-.3394-1.3932Zm-.8981 1.959c-.099.4667-.2759.8132-.5375 1.0466-.2051.1839-.396.2616-.5729.2263-.1696-.0354-.3111-.1838-.4172-.4597-.0848-.2192-.1272-.4384-.1272-.6435 0-.1768.0141-.3536.0494-.5162.0637-.29.1839-.573.3749-.8416.2334-.3466.4808-.488.7354-.4385.1698.0354.3113.184.4173.4597.0849.2192.1272.4385.1272.6436.0072.1838-.0141.3607-.0494.5233Z"/> </g> <defs> <clipPath id="a"> <path fill="#fff" d="M0 0h20v20H0z"/> </clipPath> </defs> </svg>  <span> WooCommerce </span> </a>  <a href="/platforms/custom" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#1E233C" d="M17.5 10 14 13.5l-.705-.705L16.085 10l-2.79-2.795L14 6.5l3.5 3.5ZM2.5 10 6 6.5l.705.705L3.915 10l2.79 2.795L6 13.5 2.5 10ZM10.8194 5.0005 8.2093 14.742l.9659.2588 2.6102-9.7413-.966-.2589Z"/> </svg>  <span> Custom </span> </a>  <a href="/mobile-sdk" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.302 20H5.698a1.398 1.398 0 0 1-1.396-1.398V1.398A1.398 1.398 0 0 1 5.698 0h8.604a1.399 1.399 0 0 1 1.396 1.398v17.204A1.398 1.398 0 0 1 14.302 20ZM5.698.645a.753.753 0 0 0-.751.753v17.204a.753.753 0 0 0 .751.753h8.604a.753.753 0 0 0 .751-.753V1.398a.753.753 0 0 0-.751-.753H5.698Z" fill="#000"/><path d="M12.283 1.72H7.717L6.547.55l.455-.455.981.98h4.034l.981-.98.455.455-1.17 1.17ZM12.152 17.205H7.85v.645h4.302v-.645Z" fill="#000"/></svg>  <span> Mobile SDK </span> </a> </div> </div> <div class="pt-2"> <p class="mb-3 px-2 font-medium uppercase text-[#6B7280] text-sm"> Integrations </p> <div class="px-2"> <a href="/integrations/google-analytics-4" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#F9AB00" d="M17.0457 15.8436c.0058 1.0704-.8574 1.9419-1.9271 1.9477a1.8471 1.8471 0 0 1-.2386-.0135c-.9927-.1468-1.72-1.0107-1.6956-2.0137V4.2321c-.0237-1.0043.7054-1.8681 1.6988-2.0137 1.0627-.1244 2.0253.6362 2.1497 1.6988a1.907 1.907 0 0 1 .0128.2354v11.691Z"/> <path fill="#E37400" d="M4.8929 13.9319c1.0665 0 1.931.8645 1.931 1.931 0 1.0664-.8645 1.9309-1.931 1.9309s-1.931-.8645-1.931-1.9309c0-1.0665.8645-1.931 1.931-1.931Zm5.0804-5.852c-1.0716.059-1.9027.9575-1.8777 2.0304v5.1863c0 1.4076.6195 2.2619 1.527 2.444 1.0472.2123 2.0675-.4643 2.2798-1.5116a1.8917 1.8917 0 0 0 .0385-.3892v-5.8193c.0019-1.0703-.8639-1.9393-1.9342-1.9412-.011 0-.0225 0-.0334.0006Z"/> </svg>  <span> GA4 </span> </a> <a href="/integrations/klaviyo" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#000" d="M18 15.3574H2V4.6435h16l-3.351 5.357L18 15.3574Z"/> </svg>  <span> Klaviyo </span> </a> <a href="/integrations/segment" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_4847_508)"> <g clip-path="url(#clip1_4847_508)"> <path d="M17.0002 0H3.66683C1.82588 0 0.333496 1.49238 0.333496 3.33333V16.6667C0.333496 18.5076 1.82588 20 3.66683 20H17.0002C18.8411 20 20.3335 18.5076 20.3335 16.6667V3.33333C20.3335 1.49238 18.8411 0 17.0002 0Z" fill="#FCFEF5"/> <g clip-path="url(#clip2_4847_508)"> <path d="M12.3023 12.7183H3.1018C2.67923 12.7183 2.3335 12.3725 2.3335 11.9499C2.3335 11.5274 2.67923 11.1816 3.1018 11.1816H12.3023C12.7248 11.1816 13.0706 11.5274 13.0706 11.9499C13.0706 12.3725 12.7248 12.7183 12.3023 12.7183Z" fill="#99CFAC"/> <path d="M10.3429 17.4252C9.59382 17.4252 8.84472 17.3099 8.13404 17.0986C7.73068 16.9642 7.50019 16.5416 7.63464 16.1382C7.76909 15.7349 8.19166 15.5044 8.59502 15.6388C9.15205 15.8117 9.74748 15.9077 10.3429 15.9077C12.9552 15.9077 15.2217 14.2367 15.9708 11.7397C16.086 11.3363 16.5278 11.1058 16.9312 11.2211C17.3345 11.3363 17.565 11.7781 17.4498 12.1815C16.4702 15.3123 13.6274 17.4252 10.3429 17.4252Z" fill="#49B881"/> <path d="M17.565 8.81982H8.3645C7.94193 8.81982 7.59619 8.47408 7.59619 8.05151C7.59619 7.62894 7.94193 7.2832 8.3645 7.2832H17.565C17.9875 7.2832 18.3333 7.62894 18.3333 8.05151C18.3333 8.47408 17.9875 8.81982 17.565 8.81982Z" fill="#99CFAC"/> <path d="M3.96529 8.81964C3.88846 8.81964 3.81163 8.80044 3.7348 8.78123C3.33144 8.66598 3.10094 8.22421 3.21619 7.82084C4.19578 4.68999 7.03852 2.57715 10.3422 2.57715C11.0913 2.57715 11.8404 2.69239 12.5511 2.90368C12.9545 3.03813 13.185 3.4607 13.0505 3.86406C12.9161 4.26742 12.4935 4.49792 12.0901 4.36346C11.5331 4.19059 10.9377 4.09455 10.3422 4.09455C7.72999 4.09455 5.46349 5.76562 4.71439 8.26262C4.59914 8.60836 4.29182 8.81964 3.96529 8.81964Z" fill="#49B881"/> <path d="M14.8962 5.89892C15.3206 5.89892 15.6645 5.55494 15.6645 5.13061C15.6645 4.70629 15.3206 4.3623 14.8962 4.3623C14.4719 4.3623 14.1279 4.70629 14.1279 5.13061C14.1279 5.55494 14.4719 5.89892 14.8962 5.89892Z" fill="#99CFAC"/> <path d="M5.77124 15.6567C6.19556 15.6567 6.53954 15.3127 6.53954 14.8884C6.53954 14.4641 6.19556 14.1201 5.77124 14.1201C5.34691 14.1201 5.00293 14.4641 5.00293 14.8884C5.00293 15.3127 5.34691 15.6567 5.77124 15.6567Z" fill="#99CFAC"/> </g> </g> </g> <defs> <clipPath id="clip0_4847_508"> <rect width="20" height="20" fill="white" transform="translate(0.333496)"/> </clipPath> <clipPath id="clip1_4847_508"> <rect width="20" height="20" fill="white" transform="translate(0.333496)"/> </clipPath> <clipPath id="clip2_4847_508"> <rect width="16" height="16" fill="white" transform="translate(2.3335 2)"/> </clipPath> </defs> </svg>  <span> Segment </span> </a> <a href="/integrations/rockerbox" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="#7B5DF4" d="M10.2168 6.113H5.9993v4.1231h4.2175V6.1129Z"/> <path fill="#7B5DF4" d="M2 10.0025v7.7729h4.1574v-7.7729H2ZM17.9971 2.2265h-3.9993v4.031h3.9993v-4.031Z"/> <path fill="#A793F7" d="M5.9993 10.0025v7.7729h4.1479v-7.7729h-4.148Z"/> <path fill="#A793F7" d="M9.998 6.116v4.0524h7.9985V6.1159H9.998Z"/> <path fill="#D3C9FB" d="M9.998 10.0025v7.7729h3.9993v-3.8896h3.9992v-3.8833H9.998Z"/> <path fill="#fff" d="M18.0001 13.7751h-4.1163v3.9971h4.1163v-3.9971Z"/> </svg>  <span> Rockerbox </span> </a> <a href="/integrations/shopify-flow" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100">  <svg class="h-5 w-5 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"> <path fill="#FCFEF5" d="M16.6667 0H3.3333C1.4923 0 0 1.4924 0 3.3333v13.3334C0 18.5076 1.4924 20 3.3333 20h13.3334C18.5076 20 20 18.5076 20 16.6667V3.3333C20 1.4923 18.5076 0 16.6667 0Z"/> <path fill="url(#flow_gradient)" d="M16 2H4c-1.1046 0-2 .8954-2 2v12c0 1.1046.8954 2 2 2h12c1.1046 0 2-.8954 2-2V4c0-1.1046-.8954-2-2-2Z"/> <path fill="#fff" stroke="#000" stroke-width="0.638889" d="M8.5703 12.4434c0 .9282-.7524 1.6806-1.6805 1.6806-.9282 0-1.6806-.7524-1.6806-1.6806 0-.9282.7524-1.6806 1.6806-1.6806.9281 0 1.6805.7524 1.6805 1.6806Z"/> <path fill="#A1A1AA" stroke="#000" stroke-width="0.638889" d="M14.792 12.4434c0 .9282-.7524 1.6806-1.6806 1.6806-.9281 0-1.6805-.7524-1.6805-1.6806 0-.9282.7524-1.6806 1.6805-1.6806.9282 0 1.6806.7524 1.6806 1.6806Z"/> <path fill="#fff" stroke="#000" stroke-width="0.638889" d="M11.6812 7.556c0 .9282-.7524 1.6806-1.6806 1.6806-.9281 0-1.6805-.7524-1.6805-1.6806 0-.9281.7524-1.6805 1.6805-1.6805.9282 0 1.6806.7524 1.6806 1.6805Z"/> <path fill="#000" d="M12.0643 9.8287a.3333.3333 0 0 0-.5717.3429l.5717-.3429Zm-.5717.3429.686 1.1434.5717-.343-.686-1.1433-.5717.3429Z"/> <defs> <linearGradient id="flow_gradient" x1="4.5498" x2="21.4591" y1="2" y2="12.3473" gradientUnits="userSpaceOnUse"> <stop stop-color="#D0F224"/> <stop offset="1" stop-color="#79DFFF"/> </linearGradient> </defs> </svg>  <span> Shopify Flow </span> </a> <a href="/integrations" class="block px-2 py-1 mt-2 text-sm underline underline-offset-2 hover:text-gray-100"> See All Integrations → </a> </div> </div> <div class="pt-2"> <p class="mb-3 px-2 font-medium uppercase text-[#6B7280] text-sm"> Use case </p> <div class="px-2"> <a href="/use-cases/attribution" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img src="/assets/images/nav/attribution.svg"> <span> Attribution </span> </a> <a href="/use-cases/personalization" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img src="/assets/images/nav/personalization.svg"> <span> Personalization </span> </a> <a href="/use-cases/customer-research/" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img src="/assets/images/nav/research.svg"> <span> Research </span> </a> <a href="/use-cases/conversion-rate-optimization" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img src="/assets/images/nav/cro.svg"> <span> CRO </span> </a> </div> </div> </div> </div>  <div class="space-y-2"> <a href="/pricing" class="block font-bold text-lg text-[#3F3F4C]"> Pricing → </a> </div>  <div class="space-y-2"> <a href="/case-studies" class="block font-bold text-lg text-[#3F3F4C]"> Our Customers → </a> </div>  <div x-data="{ openResources: false }"> <button @click="openResources = !openResources" class="flex justify-between items-center w-full text-[#3F3F4C] font-bold text-lg text-left"> Resources <svg :class="openResources ? 'rotate-180' : ''" class="w-5 h-5 transform transition-transform" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" /> </svg> </button> <div x-show="openResources" class="mt-8 space-y-2"> <a class="grid grid-cols-[130px_auto] gap-4 px-2 items-center" href="/learn/attribution-academy"> <img class="w-full rounded-md shadow-sm" src="/assets/images/nav/attribution-academy.svg"> <h3 class="text-base font-medium text-[#111827] leading-normal"> Attribution Academy <span class="text-sm font-medium nav-new-tag inline px-2 py-1"> New </span> </h3> </a> <div class="pt-8"> <p class="mb-3 px-2 font-medium uppercase text-[#6B7280] text-sm"> Support </p> <div class="px-2"> <a href="https://docs.fairing.co" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/docs-icon.svg" aria-hidden="true"> <span> Docs </span> </a> <div onclick="Intercom('showNewMessage')" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/contact-us-icon.svg" aria-hidden="true"> <span> Contact Us </span> </div> <a href="https://docs.fairing.co/docs/faqs" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/faqs-icon.svg" aria-hidden="true"> <span> FAQs </span> </a> </div> </div> <div class="pt-2"> <p class="mb-3 px-2 font-medium uppercase text-[#6B7280] text-sm"> Partner </p> <div class="px-2"> <a href="/partner-program" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/partner-program-icon.svg" aria-hidden="true"> <span> Partner Program </span> </a> <a href="/partners" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/company-icon.svg" aria-hidden="true"> <span> Partner Directory </span> </a> </div> </div> <div class="pt-2"> <p class="mb-3 px-2 font-medium uppercase text-[#6B7280] text-sm"> Company </p> <div class="px-2"> <a href="/about" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/company-icon.svg" aria-hidden="true"> <span> About </span> </a> <a href="/blog" class="cursor-pointer flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/blog-icon.svg" aria-hidden="true"> <span> <span> Blog </span> </a> <a href="https://jobs.ashbyhq.com/fairing" target="_blank" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/work-with-us-icon.svg" aria-hidden="true"> <span> Work with Us </span> </a> <a href="/blog/company/what-is-a-fairing" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/what-is-icon.svg" aria-hidden="true"> <span> What is a Fairing? </span> </a> <a href="/resource-center/" class="flex items-center gap-2 px-2 py-1 rounded-md hover:bg-gray-100"> <img width="20" height="20" class="h-5 w-5 mr-1" src="/assets/images/nav/docs-icon.svg" aria-hidden="true"> <span> Resource Center </span> </a> </div> </div> </div> </div>  <div class="flex flex-1 justify-between items-center gap-6 p-8"> <a href="https://meetings.fairing.co/meetings/fairing/product-demo-round-robin" class="py-4 text-base font-medium leading-6 text-black text-center"> Book a Demo </a> <a href="https://app.fairing.co" class="px-8 py-4 rounded-md bg-gray-900 hover:bg-gray-700 text-base font-medium leading-none text-white transition-all text-center"> Get Started </a> </div> </div> </div> </div>  </header> <div class="relative"> <main> <div class="relative p-16 bg-gradient-to-b from-[#fbfcf3] to-white overflow-hidden"> <img class="absolute block max-w-none top-24 md:top-16 -left-[50%] lg:left-0 w-[200%] lg:w-[100%] z-0" src="/assets/images/integrations/fairing-wavy-lines.svg" aria-hidden="true" > <div class="relative mx-auto max-w-6xl z-10"> <h1 class="mb-16 text-3xl md:text-6xl text-semibold text-gray-900 text-center tracking-tight leading-tight"> Integrations </h1> <section role="list" class="grid grid-cols-1 gap-10 grid-cols-1 sm:grid-columns-2 md:grid-cols-3 lg:grid-cols-4"><a href="/integrations/alloy" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/alloy.svg" alt="Alloy"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Alloy </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Trigger workflows and automations with your Fairing Question Stream responses. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/daasity" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/daasity.svg" alt="Daasity"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Daasity </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Compare Question Stream post-purchase survey responses with Daasity's channel attribution models. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/daton" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/daton.svg" alt="Daton"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Daton </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Sync your Fairing Question Stream responses to BigQuery, MySQL, Snowflake, Redshift, and more. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/elevar" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/elevar.svg" alt="Elevar"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Elevar </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Enhance your GA4 setup wtih Elevar's custom Fairing container. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/funnel" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/funnel.svg" alt="Funnel"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Funnel </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Import your Fairing response data into Funnel. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/google-analytics-4" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/google-analytics-4.svg" alt="Google Analytics 4"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Google Analytics 4 </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Analyze your Fairing response data directly in GA4. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/google-sheets-extension" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/google-sheets-extension.svg" alt="Google Sheets Extension"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Google Sheets Extension </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Sync your Fairing Question Stream responses to a Google Sheet. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/google-tag-manager" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/google-tag-manager.svg" alt="Google Tag Manager"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Google Tag Manager </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Send Question Stream responses to your Google Tag Manager Data Layer </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/klar" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/klar.svg" alt="Klar"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Klar </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Sync Fairing Question Responses with Klar for advanced attribution. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/klaviyo" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/klaviyo.svg" alt="Klaviyo"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Klaviyo </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Build segments and flows in Klaviyo with your Question Stream response data. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/measured" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/measured.svg" alt="Measured"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Measured </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Enhance your Measured incementality dashboards with your Fairing HDYHAU responses. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/peel" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/peel.svg" alt="Peel"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Peel </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Enhance your Peel dashboard with your Fairing responses. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/recharge" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/recharge.svg" alt="Recharge"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Recharge </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Display your Fairing post-purchase survey on a Recharge hosted confirmation page. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/rockerbox" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/rockerbox.svg" alt="Rockerbox"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Rockerbox </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Fill in missing dark traffic in your Rockerbox attribution models with Fairing HDYHAU response data. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/segment" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/segment.svg" alt="Segment"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Segment </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Send Segment track events in real time with your Question Stream responses. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/shopify-flow" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/shopify-flow.svg" alt="Shopify Flow"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Shopify Flow </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Create workflows in Shopify Flow with the Fairing Question Response trigger. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/source-medium-flow" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/source-medium.svg" alt="Source Medium Flow"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Source Medium Flow </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Sync Question Stream responses to your Source Medium account for further analysis. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/tiktok" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/tiktok.svg" alt="TikTok"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> TikTok </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Send your Fairing response data to TikTok to receive up to $5k in ad credit. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/triple-whale" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/triple-whale.svg" alt="Triple Whale"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Triple Whale </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Sync Question Stream attribution survey responses to your Triple Whale account. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/wonderment" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/wonderment.svg" alt="Wonderment"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Wonderment </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Display your post-purchase survey on your Wonderment order tracking page. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/workmagic" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/work-magic.svg" alt="WorkMagic"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> WorkMagic </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Measure the true impact of your marketing channels with incrementality-based attribution. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a><a href="/integrations/yotpo" class="group col-span-1 flex flex-col items-stretch rounded-lg bg-white shadow-md"> <div class="relative overflow-hidden aspect-[6/4]"> <svg class="block w-full group-hover:scale-110 transition-all ease-in" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 600 400"> <path fill="url(#6578)" d="M0 0h600v400H0z"/> <circle cx="300" cy="200.258" r="407" stroke="#CFCFD2" stroke-width="2" opacity="0.5"/> <circle cx="300.5" cy="200.758" r="310" stroke="#A5A7B1" opacity="0.5"/> <circle cx="301" cy="201.258" r="212.5" stroke="#A5A7B1" opacity="0.5"/> <g filter="url(#4294)" opacity="0.5"> <circle cx="300" cy="200.258" r="116" fill="#fff"/> <circle cx="300" cy="200.258" r="115" stroke="#CFCFD2" stroke-width="2"/> </g> <path stroke="#E9EDEB" d="M.5.5h599v399H.5z"/> <defs> <linearGradient id="6578" x1="-193.484" x2="1050.75" y1="547.896" y2="229.397" gradientUnits="userSpaceOnUse"> <stop stop-color="#EDF1EF"/> <stop offset="1" stop-color="#fff"/> </linearGradient> <filter id="4294" width="242" height="242" x="179" y="81.2578" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"> <feFlood flood-opacity="0" result="BackgroundImageFix"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect1_dropShadow_11_21"/> <feOffset dy="2"/> <feGaussianBlur stdDeviation="2"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"/> <feBlend in2="BackgroundImageFix" result="effect1_dropShadow_11_21"/> <feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/> <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="effect2_dropShadow_11_21"/> <feOffset dy="1"/> <feGaussianBlur stdDeviation="1.5"/> <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.02 0"/> <feBlend in2="effect1_dropShadow_11_21" result="effect2_dropShadow_11_21"/> <feBlend in="SourceGraphic" in2="effect2_dropShadow_11_21" result="shape"/> </filter> </defs> </defs> </svg> <img class="absolute w-[25%] top-[50%] left-[50%] -mt-[12.5%] -ml-[12.5%] group-hover:scale-150 group-hover:rotate-3 transition-all ease-in-out" src="/assets/images/integrations/yotpo.svg" alt="Yotpo"> </div> <div class="flex flex-col flex-1 items-start border-t border-t-gray-100"> <h3 class="mb-4 px-4 pt-6 text-lg font-semibold text-gray-900 leading-tight"> Yotpo </h3> <p class="mb-8 px-4 text-sm text-gray-500"> Personalize Yotpo SMS & Emails with your Fairing Question Stream responses. </p> <p class="w-full mt-auto px-4 py-2 border-t border-t-gray-100 bg-white rounded-b-lg text-sm text-gray-700 text-center font-medium tracking-loose group-hover:underline transition-all"> View Details </p> </div> </a></section>  <div class="bg-white py-28"> <div class="relative grid gap-8 overflow-clip justify-center mx-auto max-w-7xl p-20 bg-gradient-to-tr from-[#1d2644] to-[#0d4999] rounded-tl-[10px] rounded-tr-[80px] rounded-br-[10px] rounded-bl-[80px]"> <p class="text-4xl font-semibold text-white text-center"> Ready to know your customers better? </p> <a href="https://meetings.fairing.co/meetings/fairing/product-demo-round-robin" class="inline-flex items-center rounded-md border border-transparent bg-lime-200 px-5 py-2 mx-auto text-base font-medium text-gray-900 shadow hover:bg-lime-300 transition-all"> Book a demo </a> <img class="absolute left-[72%] bottom-[35%]" aria-hidden="true" width="397" height="227" src="/assets/images/home/fairing-flair-cluster.svg"> <img class="absolute right-[68%] top-[40%] rotate-180 origin-center" aria-hidden="true" width="397" height="227" src="/assets/images/home/fairing-flair-cluster.svg"> </div> </div>  </div> </div> </main> </div> <footer class="bg-gray-900" aria-labelledby="footer-heading"> <h2 id="footer-heading" class="sr-only">Footer</h2> <div class="mx-auto max-w-7xl px-6 py-16 sm:py-24 lg:px-8 lg:py-32"> <div class="grid grid-cols-1 md:grid-cols-[1fr_1.5fr] gap-y-4 md:gap-8 sm:gap-14"> <div class="col-span-3 mb-4 md:mb-0 sm:col-span-1 flex flex-col gap-8"> <svg class="w-6 " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 59 85"> <path fill="#fff" d="M52.604 21.8641 7.1491 30.3454C3.4224 31.031 0 28.187 0 24.4034v-8.2781c0-3.7073 2.6365-6.8815 6.2618-7.5417L51.717.1024c3.726-.6856 7.149 2.1584 7.149 5.9419v8.2781c0 3.682-2.637 6.8561-6.262 7.5417Zm0 32.6969-23.171 4.305V43.343c0-3.6976 2.636-6.863 6.262-7.5214l16.022-2.9882c3.726-.6837 7.149 2.1525 7.149 5.9257v8.2549c0 3.698-2.637 6.863-6.262 7.547ZM23.1711 81.907l-16.022 2.991C3.4224 85.582 0 82.743 0 78.966v-8.263c0-3.701 2.6365-6.869 6.2618-7.528l23.1712-4.309v15.538c0 3.675-2.6367 6.844-6.2619 7.503Z"/> </svg> <div class="flex-row gap-8 hidden md:flex"> <picture><source type="image/webp" srcset="/assets/images/drata-soc2-light@348w.webp 348w" sizes="(min-width: 768px) 768px,(min-width: 1200px) 1200px,380px"><img alt="SOC 2 LOGO" class="w-16 mx-auto mb-4" loading="lazy" decoding="async" src="/assets/images/drata-soc2-light@348w.png" width="348" height="356"></picture> <picture><source type="image/webp" srcset="/assets/images/platforms/shopifyplus_certified@346w.webp 346w" sizes="(min-width: 768px) 768px,(min-width: 1200px) 1200px,380px"><img alt="SHOPIFY PLUS CERTIFICATION LOGO" class="w-32 mx-auto" loading="lazy" decoding="async" src="/assets/images/platforms/shopifyplus_certified@346w.png" width="346" height="154"></picture> </div> </div> <div class="grid grid-cols-2 md:grid-cols-4 gap-y-12"> <div> <h3 class="text-sm font-semibold leading-6 text-white"> Resources </h3> <ul role="list" class="mt-2 space-y-1"> <li> <a href="/resource-center" class="text-sm leading-6 text-gray-300 hover:text-white"> Resource Center </a> </li> <li> <a href="/blog" class="text-sm leading-6 text-gray-300 hover:text-white"> Blog </a> </li> <li> <a href="/learn/attribution-academy/" class="text-sm leading-6 text-gray-300 hover:text-white"> Attribution Academy </a> </li> <li> <a href="/learn/podcast-multiplier-calculator/" class="text-sm leading-6 text-gray-300 hover:text-white"> Podcast Multiplier Calculator </a> </li> </ul> </div> <div> <h3 class="text-sm font-semibold leading-6 text-white"> Platform </h3> <ul role="list" class="mt-2 space-y-1"> <li> <a href="/product" class="text-sm leading-6 text-gray-300 hover:text-white"> Product </a> </li> <li> <a href="https://docs.fairing.co/docs/integrations-catalog" class="text-sm leading-6 text-gray-300 hover:text-white"> Integrations </a> </li> <li> <a href="https://app.fairing.co/login" class="text-sm leading-6 text-gray-300 hover:text-white"> Log in </a> </li> <li> <a href="/question-stream-vs-surveys/" class="text-sm leading-6 text-gray-300 hover:text-white"> Question Stream™ vs Surveys </a> </li> </ul> </div> <div> <h3 class="text-sm font-semibold leading-6 text-white"> Support </h3> <ul role="list" class="mt-2 space-y-1"> <li> <a href="/pricing" class="text-sm leading-6 text-gray-300 hover:text-white"> Pricing </a> </li> <li> <a href="https://docs.fairing.co" target="_blank" class="text-sm leading-6 text-gray-300 hover:text-white"> Docs </a> </li> <li> <a href="https://docs.fairing.co/reference/api" target="_blank" class="text-sm leading-6 text-gray-300 hover:text-white"> API Docs </a> </li> </ul> </div> <div> <h3 class="text-sm font-semibold leading-6 text-white"> Company </h3> <ul role="list" class="mt-2 space-y-1"> <li> <a href="/about" class="text-sm leading-6 text-gray-300 hover:text-white"> About </a> </li> <li> <a href="/blog" class="text-sm leading-6 text-gray-300 hover:text-white"> Blog </a> </li> <li> <a href="/partner-program" class="text-sm leading-6 text-gray-300 hover:text-white"> Partners </a> </li> </ul> </div> </div> <div class="col-span-3 mt-4 md:mt-0 sm:col-span-1 flex flex-col gap-8 md:hidden"> <div class="flex flex-row gap-8"> <picture><source type="image/webp" srcset="/assets/images/drata-soc2-light@348w.webp 348w" sizes="(min-width: 768px) 768px,(min-width: 1200px) 1200px,380px"><img alt="SOC 2 LOGO" class="w-16 mx-auto mb-4" loading="lazy" decoding="async" src="/assets/images/drata-soc2-light@348w.png" width="348" height="356"></picture> <picture><source type="image/webp" srcset="/assets/images/platforms/shopifyplus_certified@346w.webp 346w" sizes="(min-width: 768px) 768px,(min-width: 1200px) 1200px,380px"><img alt="SHOPIFY PLUS CERTIFICATION LOGO" class="w-32 mx-auto" loading="lazy" decoding="async" src="/assets/images/platforms/shopifyplus_certified@346w.png" width="346" height="154"></picture> </div> </div> </div> <div class="mt-16 border-t border-white/10 pt-8 sm:mt-20 md:flex md:items-center md:justify-between lg:mt-24"> <div class="flex space-x-6 md:order-2"> <a href="https://www.linkedin.com/company/fairing" class="text-white hover:text-gray-400"> <span class="sr-only">LinkedIn</span> <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="24" height="24" viewBox="0 0 24 24"> <path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/> </svg> </a> <a href="https://x.com/FairingData" class="text-white hover:text-gray-400"> <span class="sr-only">X</span> <svg class="h-6 w-6" width="220" height="204" viewBox="0 0 220 204" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M173.263 2H206.998L133.297 86.718L220 202H152.112L98.9403 132.082L38.0995 202H4.34432L83.1743 111.385L0 2H69.6111L117.674 65.9077L173.263 2ZM161.423 181.692H180.116L59.4539 21.241H39.3946L161.423 181.692Z" fill="currentColor"/> </svg> </a> </div> <div class="flex items-center mt-8 gap-6 md:order-1 text-sm "> <p class="leading-5 text-gray-400 md:mt-0"> © Fairing, Inc. All rights reserved. </p> <a href="/privacy" class="leading-6 text-gray-100 hover:text-white transition-all"> Privacy </a> <a href="/terms" class="leading-6 text-gray-100 hover:text-white transition-all"> Terms </a> <a href="https://status.fairing.co" target="_blank" class="leading-6 text-gray-100 hover:text-white transition-all"> Status </a> </div> </div> </div> </footer> <script> window.intercomSettings = { app_id: "uan21vw7" }; </script> <script> (function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.push(args)};w.Intercom=i;function l(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/uan21vw7';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);}if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})() </script> <script> if (!sessionStorage.getItem('intercomShown')) { setTimeout(function() { Intercom('show'); sessionStorage.setItem('intercomShown', 'true'); }, 3000); } </script>  <script defer src='https://app.amped.io/snippet/account_5jtmg87'></script> <script src="/assets/js/header.js" type="text/javascript"></script> </body> </html>

CINXE.COM

Integrations - Fairing