Skip to content

Instantly share code, notes, and snippets.

@opejovic

opejovic/StripeLanding.html

Last active August 11, 2021 16:27
Show Gist options
  • Save opejovic/d91fb8f3a6422b6c4679a7c7a143cf99 to your computer and use it in GitHub Desktop.
Save opejovic/d91fb8f3a6422b6c4679a7c7a143cf99 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
StripeLanding.html
<div class="min-h-screen mx-auto relative overflow-x-hidden">
<div class="container mx-auto max-w-6xl">
<header class="mt-6 px-6 xl:px-4">
<nav class="flex justify-between items-center text-white">
<div>
<svg viewBox="0 0 60 25" xmlns="http://www.w3.org/2000/svg" width="60" height="25" class="UserLogo variant--">
<title>Stripe logo</title>
<path fill="var(--userLogoColor, #FFFFFF)" d="M59.64 14.28h-8.06c.19 1.93 1.6 2.55 3.2 2.55 1.64 0 2.96-.37 4.05-.95v3.32a8.33 8.33 0 0 1-4.56 1.1c-4.01 0-6.83-2.5-6.83-7.48 0-4.19 2.39-7.52 6.3-7.52 3.92 0 5.96 3.28 5.96 7.5 0 .4-.04 1.26-.06 1.48zm-5.92-5.62c-1.03 0-2.17.73-2.17 2.58h4.25c0-1.85-1.07-2.58-2.08-2.58zM40.95 20.3c-1.44 0-2.32-.6-2.9-1.04l-.02 4.63-4.12.87V5.57h3.76l.08 1.02a4.7 4.7 0 0 1 3.23-1.29c2.9 0 5.62 2.6 5.62 7.4 0 5.23-2.7 7.6-5.65 7.6zM40 8.95c-.95 0-1.54.34-1.97.81l.02 6.12c.4.44.98.78 1.95.78 1.52 0 2.54-1.65 2.54-3.87 0-2.15-1.04-3.84-2.54-3.84zM28.24 5.57h4.13v14.44h-4.13V5.57zm0-4.7L32.37 0v3.36l-4.13.88V.88zm-4.32 9.35v9.79H19.8V5.57h3.7l.12 1.22c1-1.77 3.07-1.41 3.62-1.22v3.79c-.52-.17-2.29-.43-3.32.86zm-8.55 4.72c0 2.43 2.6 1.68 3.12 1.46v3.36c-.55.3-1.54.54-2.89.54a4.15 4.15 0 0 1-4.27-4.24l.01-13.17 4.02-.86v3.54h3.14V9.1h-3.13v5.85zm-4.91.7c0 2.97-2.31 4.66-5.73 4.66a11.2 11.2 0 0 1-4.46-.93v-3.93c1.38.75 3.1 1.31 4.46 1.31.92 0 1.53-.24 1.53-1C6.26 13.77 0 14.51 0 9.95 0 7.04 2.28 5.3 5.62 5.3c1.36 0 2.72.2 4.09.75v3.88a9.23 9.23 0 0 0-4.1-1.06c-.86 0-1.44.25-1.44.9 0 1.85 6.29.97 6.29 5.88z" fill-rule="evenodd"></path>
</svg>
</div>
<div class="hidden lg:block">
<ul class="flex space-x-10 text-sm font-medium">
<li><a href="#">Products</a></li>
<li><a href="#">Use cases</a></li>
<li><a href="#">Developers</a></li>
<li><a href="#">Company</a></li>
<li><a href="#">Pricing</a></li>
</ul>
</div>
<div class="hidden lg:flex space-x-2">
<button class="pl-5 pr-5 pt-[5px] pb-[6px] bg-white text-white bg-opacity-10 rounded-full text-sm font-medium">Sign in</button>
</div>
<a class="lg:hidden px-4 py-3 bg-white bg-opacity-10 inline-flex justify-center rounded-full text-white" href="#" title="Open mobile navigation">
<svg class="text-white" width="16" height="10" viewBox="0 0 16 10">
<title>Open mobile navigation</title>
<g fill="currentColor" fill-rule="evenodd">
<rect y="8" width="16" height="2" rx="1"></rect>
<rect y="4" width="16" height="2" rx="1"></rect>
<rect width="16" height="2" rx="1"></rect>
</g>
</svg>
</a>
</nav>
</header>
<main>
<section class="px-6 xl:px-4 mt-20">
<div class="relative bg-gray-900 bg-opacity-30 inline-block px-6 xl:px-4 rounded sm:rounded-full text-xs font-normal text-white py-2 sm:py-1 tracking-wide space-x-2" style="">
<span class="font-bold">Watch now</span>
<span class="">•</span>
<a class="" href="#">Sessions, our virtual conference, is on&nbsp;demand&nbsp;</a>
</div>
</section>
<div class="md:grid md:grid-flow-col md:grid-cols-2">
<!-- Left side -->
<section>
<h1 class="text-5xl sm:text-6xl md:text-7xl xl:text-8xl font-semibold tracking-tight mt-14 z-[-10] relative px-8 sm:px-6 xl:px-4">Payments infrastructure <br /><span class=" sm:whitespace-nowrap">for the internet</span></h1>
<p class="w-11/12 mt-10 text-lg tracking-wide text-gray-500 pl-6 xl:pl-4">Millions of companies of all sizes—from startups to Fortune 500s—use Stripe’s software and APIs to accept payments, send payouts, and manage their businesses online.</p>
<div class="mt-10 grid grid-cols-1 lg:grid-cols-2 justify-items-start" data-name="cta-buttons">
<div class="flex justify-between items-center space-x-2 pl-6 xl:pl-4">
<button class="pl-5 pr-3 pt-[6px] pb-[6px] bg-gray-800 rounded-full text-white text-sm flex justify-between items-center space-x-3">
<span>Start now</span>
<svg class="text-white stroke-2 stroke-current ml-1" style="fill: none;" width="10" height="10" viewBox="0 0 10 10" aria-hidden="true">
<g fill-rule="evenodd">
<!-- <path class="linePath" d="M0 5h7"></path> -->
<path class="tipPath" d="M1 1l4 4-4 4"></path>
</g>
</svg>
</button>
<button class="ml-2 px-0 text-gray-800 text-sm flex justify-between items-center">
<span>Contact Sales&nbsp;</span>
<svg class="text-gray-800 stroke-2 stroke-current ml-1" style="fill: none;" width="10" height="10" viewBox="0 0 10 10" aria-hidden="true">
<g fill-rule="evenodd">
<!-- <path class="linePath" d="M0 5h7"></path> -->
<path class="tipPath" d="M1 1l4 4-4 4"></path>
</g>
</svg>
</button>
</div>
</div>
</section>
<!-- End left side -->
<section class="hidden md:block relative px-6 xl:px-4">
<div class="h-full ml-28">
<div class="bg-white h-full w-[930px] absolute top-0 rounded-lg shadow-2xl drop-shadow-lg -mt-16 left-[230px] opacity-30 z-[-9]"></div>
<!-- Phone -->
<div class="bg-blue-50 w-[272px] rounded-[36px] shadow-2xl drop-shadow-2xl p-[8px]" >
<div class="bg-gray-50 w-full h-full rounded-[36px] px-[16px] py-[24px]">
<!-- Cards -->
<div class="grid justify-center">
<div class="relative">
<svg class="h-[70px] w-[46px] " viewBox="0 0 460 700">
<rect width="460" height="700" fill="#44B7BC" rx="40"></rect>
<g transform="translate(0 48)">
<polygon fill="#000" points="0 43.138 203 0 203 54.028 0 97.271"></polygon>
<path fill="#fff" d="M21.57 54.77l-9.2 2v3.07l5.82-1.27v19.67l9.2-2v-3.08l-5.82 1.27V54.77zm38.7-5.5c2.85-.63 3.9.85 4.01 3.7l3.39-.74c-.32-4.97-2.44-7.19-7.3-6.13-4.54.95-7.61 4.12-7.61 9.62v7.72c0 4.97 2.43 7.3 7.61 6.13 4.86-1.06 7.09-3.7 7.3-8.46l-3.28.74c-.1 2.64-1.48 4.12-4.02 4.65-3.17.64-4.33-.63-4.23-3.7v-7.72c-.1-3.59 1.27-5.18 4.13-5.81zM46.42 69.15V56.04c0-3.92-1.7-6.45-5.5-5.71-2.43.53-5.08 2.53-5.71 4.86v-3.28L28 53.4v3.07l3.81-.85v19.56l3.39-.74v-16.5c1.58-3.07 3.28-4.02 4.86-4.34 1.8-.42 3.07.43 3.07 2.97v16.28l7.19-1.48V68.3l-3.91.85zM189.47 22.2v-3.17l-11.95 2.54v3.17l3.38-.74v19.56l8.57-1.8V38.7l-5.18 1.05V23.26l5.18-1.06zM92.09 59.84c-3.07.64-4.23-.74-4.23-3.8v-3.18l11.63-2.43V46.2c0-4.86-2.64-7.71-7.5-6.66-4.76 1.06-7.51 4.76-7.51 9.52v7.72c0 4.86 2.85 7.19 7.61 6.23 5.92-1.26 7.61-5.6 7.61-8.56l-3.17.53c-.21 3.07-2 4.33-4.44 4.86zm-4.23-11.63c0-2.96 1.16-5.18 4.12-5.81 3.07-.64 4.13 1.27 4.13 4.44V48l-8.25 1.8v-1.6zm56.88.43c-3.06.63-4.23-.74-4.23-3.81v-3.17l11.63-2.43V35c0-4.87-2.64-7.72-7.5-6.66-4.76 1.05-7.5 4.75-7.5 9.51v7.72c0 4.86 2.85 7.19 7.6 6.24 5.92-1.27 7.62-5.6 7.62-8.57l-3.07.64c-.42 2.96-2.22 4.23-4.55 4.76zm-4.23-11.53c0-2.96 1.17-5.18 4.13-5.81 3.06-.64 4.12 1.26 4.12 4.44v1.16l-8.25 1.8v-1.6zm32.78 4.97V28.97c0-3.7-2.11-6.45-5.7-5.6-2.44.52-4.87 2.53-5.61 4.86v-3.28l-7.2 1.48v3.07l3.81-.85v19.56l3.39-.74v-16.5c1.58-3.06 3.27-4 4.86-4.33 1.8-.42 3.07.43 3.07 2.96v16.3l7.19-1.48v-3.07l-3.81.74zm-42.71 9.1V37.52c0-3.49-2.33-5.81-5.71-5.18-2.12.43-4.87 2.86-5.29 4.97-.42-1.69-2.75-3.17-5.18-2.64-2.12.42-4.44 2.54-4.86 4.65v-3.28l-7.2 1.48v3.07l3.81-.85V59.3l3.39-.74V42.2c.95-2.01 2.43-3.92 4.44-4.34 1.26-.21 2.74.21 2.74 3.17V57.2l3.39-.74V40.07c.95-2 2.43-3.91 4.44-4.33 1.27-.22 2.75.2 2.75 3.17v16.17l7.19-1.48v-3.06l-3.91.63zm-58.37-7.2v22.74l3.39-.75V46.42l5.81-1.27v-3.07l-9.2 1.9z"></path>
</g>
<polygon fill="#000" points=".001 396.001 108.001 304.001 108.001 432.001 .001 432.001"></polygon>
<path fill="#000" d="M62.93 647.13c11.7 0 19.72-5.63 19.72-15 0-8.4-4.5-12.75-13.2-15l-8.7-2.25c-4.87-1.28-7.27-3.08-7.27-6.98 0-3.67 3.3-6 8.7-6 4.65 0 8.85 1.65 9.45 7.35h9.75c-1.05-10.65-8.55-15.37-19.05-15.37-11.4 0-18.6 5.85-18.6 14.1 0 7.5 4.05 12.6 12.37 14.77l9.98 2.63c4.57 1.2 6.82 3.22 6.82 6.82 0 4.43-4.42 6.9-10.12 6.9-6 0-9.98-2.32-10.8-8.32h-9.75c.9 11.85 9.37 16.35 20.7 16.35zm38.65-.23c9.22 0 15.6-4.95 16.8-13.42H109c-.45 3.9-3.3 6.15-7.35 6.15s-7.57-2.63-7.57-7.2v-2.55h24.6v-4.73c0-10.5-6.75-18.3-17.1-18.3-10.35 0-17.25 7.95-17.25 19.95s6.37 20.1 17.25 20.1zm7.5-24.3h-15v-1.35c0-4.12 3.22-7.12 7.5-7.12 4.27 0 7.5 3 7.5 7.12v1.35zM9 458c58.96 0 107 22.88 107 52S67.96 562 9 562c-3.03 0-6.03-.06-9-.18v-4c2.97.12 5.97.18 9 .18 57.02 0 103-21.9 103-48S66.02 462 9 462c-3.03 0-6.03.06-9 .18v-4c2.97-.12 5.97-.18 9-.18zM376.96 0c-.63 3.9-.96 7.91-.96 12 0 40.33 31.8 73 71 73 4.44 0 8.79-.42 13-1.22v4.07A73.58 73.58 0 0 1 447 89c-41.43 0-75-34.48-75-77 0-4.08.31-8.09.9-12h4.06z"></path>
</svg>
<svg class="h-[70px] w-[46px] absolute top-2 left-2" viewBox="0 0 460 700">
<defs>
<linearGradient id="HomepageIncrementPhone__imageGradientA" x1="50%" x2="50%" y1="0%" y2="88.24%">
<stop offset="0%" stop-color="#AC9CC0"></stop>
<stop offset="100%" stop-color="#F2D6DF"></stop>
</linearGradient>
<linearGradient id="HomepageIncrementPhone__imageGradientB" x1="50%" x2="50%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#6F74A9"></stop>
<stop offset="80%" stop-color="#515997"></stop>
<stop offset="100%" stop-color="#323C83"></stop>
</linearGradient>
<linearGradient id="HomepageIncrementPhone__imageGradientC" x1="0%" x2="100%" y1="50%" y2="50%">
<stop offset="0%" stop-color="#B1AFCC"></stop>
<stop offset="100%" stop-color="#7B80B1"></stop>
</linearGradient>
<linearGradient id="HomepageIncrementPhone__imageGradientD" x1="0%" x2="100%" y1="0%" y2="0%">
<stop offset="0%" stop-color="#EB938A"></stop>
<stop offset="90%" stop-color="#E6887F"></stop>
<stop offset="100%" stop-color="#B74840"></stop>
</linearGradient>
<linearGradient id="HomepageIncrementPhone__imageGradientE" x1="0%" x2="100%" y1="50%" y2="50%">
<stop offset="0%" stop-color="#FFF" stop-opacity="0"></stop>
<stop offset="100%" stop-color="#FFF" stop-opacity=".5"></stop>
</linearGradient>
<linearGradient id="HomepageIncrementPhone__imageGradientF" x1="50%" x2="50%" y1="60%" y2="100%">
<stop offset="0%" stop-color="#4FBED4"></stop>
<stop offset="100%" stop-color="#439CCA"></stop>
</linearGradient>
<linearGradient id="HomepageIncrementPhone__imageGradientG" x1="50%" x2="50%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#52468C" stop-opacity=".8"></stop>
<stop offset="100%" stop-color="#52468C" stop-opacity=".2"></stop>
</linearGradient>
<linearGradient id="HomepageIncrementPhone__imageGradientH" x1="50%" x2="50%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#F2B532"></stop>
<stop offset="100%" stop-color="#EB9234"></stop>
</linearGradient>
</defs>
<path fill="url(#HomepageIncrementPhone__imageGradientA)" d="M0 239h460v421a40 40 0 0 1-40 40H40a40 40 0 0 1-40-40V239z"></path>
<rect width="460" height="28" x=".01" y="211" fill="url(#HomepageIncrementPhone__imageGradientB)"></rect>
<path fill="#52468C" d="M40 0h380a40 40 0 0 1 40 40v171H0V40A40 40 0 0 1 40 0z"></path>
<path fill="url(#HomepageIncrementPhone__imageGradientC)" d="M459 155.88l1 .88V211H0V40a39.86 39.86 0 0 1 10.46-26.96C134.2 29 289.04 127.07 459 155.88z"></path>
<path fill="#8888B5" d="M460 60H231.5c36.15 0 151.64-18.83 214.75-50.2A39.9 39.9 0 0 1 460 40v20z"></path>
<rect width="75" height="461" x="128" y="239" fill="url(#HomepageIncrementPhone__imageGradientD)"></rect>
<path fill="url(#HomepageIncrementPhone__imageGradientE)" d="M319 79c72.35 0 131 58.65 131 131v1H188.01v-1c0-71.63 57.48-129.83 128.83-130.98L319 79z"></path>
<path fill="url(#HomepageIncrementPhone__imageGradientF)" d="M452.5 239c0 36.46-16.76 79.52-44.74 113-32.25 38.58-76.16 61.5-126.26 61.5-86.47 0-151.19 66.96-152.48 153.38L129.01 700H99V569.5c0-103.94 78.25-186 182.5-186 40.68 0 76.4-18.65 103.24-50.75 23.37-27.96 37.47-63.86 37.75-92.87V239h30z"></path>
<path fill="#000" d="M263.5 547.13c10.65 0 18.6-5.02 20.18-16.73h-9.75c-.98 6-4.2 8.48-10.28 8.48-6.15 0-11.02-4.5-11.02-10.65v-15.6c0-6.38 4.5-10.5 10.72-10.5 5.78 0 9.23 2.7 9.75 8.1h9.75c-.67-10.05-8.32-16.35-18.82-16.35-14.78 0-21.9 10.57-21.9 26.77 0 15.38 6.67 26.48 21.37 26.48zm32.95-1.13v-51h-9.37v51h9.37zm21.93.9c11.47 0 17.92-8.02 17.92-20.02s-6.45-20.02-17.92-20.02c-11.48 0-17.93 8.02-17.93 20.02s6.45 20.02 17.93 20.02zm0-7.27c-4.65 0-8.18-2.63-8.18-7.2v-11.1c0-4.58 3.53-7.2 8.18-7.2s8.17 2.55 8.17 7.2v11.1c0 4.65-3.52 7.2-8.17 7.2zm33.85 7.27c5.4 0 8.92-2.32 11.25-6.44V546h9.37v-38.25h-9.37v22.13c0 5.55-3.15 9.38-8.18 9.38-4.42 0-6-2.7-6-7.13v-24.38h-9.37v25.05c0 8.86 4.12 14.1 12.3 14.1zm39.92 0a12.3 12.3 0 0 0 11.03-6.07V546h9.37v-51h-9.37v17.93c-2.4-3.82-6.15-6.07-11.18-6.07-10.27 0-15.07 8.92-15.07 20.02s5.02 20.02 15.22 20.02zm2.4-7.27c-4.8 0-7.87-3.08-7.87-7.35v-10.8c0-4.27 3-7.35 7.87-7.35 6 0 8.63 3.9 8.63 9.9v5.7c0 6-2.63 9.9-8.63 9.9z"></path>
<path fill="#fff" d="M383.32 211H0V90.88c104.75 9.6 237.36 95.4 383.32 120.12z"></path>
<polygon fill="#000" points=".005 91.138 203.005 48 203.005 102.028 .005 145.271"></polygon>
<path fill="#fff" d="M21.57 102.77l-9.2 2v3.07l5.82-1.27v19.67l9.2-2v-3.08l-5.82 1.27v-19.66zm38.7-5.5c2.85-.63 3.91.85 4.02 3.7l3.38-.74c-.32-4.97-2.43-7.19-7.3-6.13-4.54.95-7.6 4.12-7.6 9.62v7.72c0 4.97 2.43 7.3 7.6 6.13 4.87-1.06 7.09-3.7 7.3-8.46l-3.28.74c-.1 2.64-1.48 4.13-4.01 4.65-3.18.64-4.34-.63-4.23-3.7v-7.72c-.1-3.59 1.27-5.18 4.12-5.81zm-13.85 19.88v-13.11c0-3.92-1.7-6.45-5.5-5.71-2.43.53-5.07 2.53-5.7 4.86v-3.28l-7.2 1.48v3.07l3.8-.85v19.56l3.4-.74v-16.49c1.58-3.07 3.27-4.02 4.86-4.34 1.8-.42 3.06.43 3.06 2.97v16.28l7.2-1.48v-3.07l-3.92.85zM189.47 70.2v-3.17l-11.95 2.54v3.17l3.39-.74v19.56l8.56-1.8V86.7l-5.18 1.05V71.26l5.18-1.06zM92.1 107.84c-3.06.64-4.22-.74-4.22-3.8v-3.18l11.63-2.43V94.2c0-4.86-2.65-7.71-7.51-6.66-4.76 1.06-7.5 4.76-7.5 9.52v7.72c0 4.86 2.85 7.19 7.6 6.23 5.93-1.26 7.62-5.6 7.62-8.56l-3.17.53c-.22 3.07-2.01 4.33-4.45 4.86zm-4.22-11.63c0-2.96 1.16-5.18 4.12-5.81 3.07-.64 4.12 1.27 4.12 4.44V96l-8.24 1.8v-1.6zm56.88.43c-3.07.63-4.23-.74-4.23-3.81v-3.17l11.63-2.43V83c0-4.87-2.64-7.72-7.5-6.66-4.77 1.05-7.51 4.75-7.51 9.51v7.72c0 4.86 2.85 7.19 7.6 6.24 5.93-1.27 7.62-5.6 7.62-8.57l-3.07.64c-.42 2.96-2.22 4.23-4.54 4.76zm-4.23-11.53c0-2.96 1.16-5.18 4.12-5.81 3.07-.64 4.13 1.26 4.13 4.44v1.16l-8.25 1.8v-1.6zm32.77 4.97V76.97c0-3.7-2.11-6.45-5.7-5.6-2.44.52-4.87 2.53-5.6 4.86v-3.28l-7.2 1.48v3.07l3.8-.85v19.56l3.4-.74v-16.5c1.58-3.06 3.27-4 4.86-4.33 1.8-.42 3.06.43 3.06 2.96v16.3l7.2-1.48v-3.07l-3.82.74zm-42.71 9.1V85.52c0-3.49-2.33-5.81-5.7-5.18-2.12.43-4.87 2.86-5.3 4.97-.42-1.69-2.74-3.17-5.18-2.64-2.11.42-4.44 2.54-4.86 4.65v-3.28l-7.19 1.48v3.07l3.8-.85v19.56l3.39-.74V90.2c.95-2.01 2.43-3.92 4.44-4.34 1.27-.21 2.75.21 2.75 3.17v16.18l3.38-.74v-16.4c.95-2 2.43-3.91 4.44-4.33 1.27-.21 2.75.2 2.75 3.17v16.17l7.2-1.48v-3.06l-3.92.63zm-58.36-7.2v22.74l3.38-.75V94.42l5.82-1.27v-3.07l-9.2 1.9z"></path>
<path fill="url(#HomepageIncrementPhone__imageGradientG)" d="M361.5 239c0 46.23-17.56 99.17-47.13 142.65-33.51 49.28-79.68 83.15-132.66 91.37l-4.29.66c-4.1.6-16.41 2.3-36.95 5.05a1106.44 1106.44 0 0 0-39.46 6.02c-35.16 6.44-61.21 15.33-82.22 29.1a125.89 125.89 0 0 0-18.79 15V431.6c24.8-12.05 52.5-20.22 85.07-26.27l4.18-.76 3.02-.54c9.86-1.74 17.98-2.95 34.57-5.19l23.68-3.16a931.3 931.3 0 0 0 18.77-2.7c28.52-4.42 56.28-24.79 78.1-56.87 20.54-30.21 32.87-67.03 33.11-96.22V239h81z"></path>
<path fill="url(#HomepageIncrementPhone__imageGradientH)" d="M22.18 561.36c23.26 23.48 58.34 36.87 104.91 37.14H340c46.1 0 90.76 22.88 120 57.03V660a40.02 40.02 0 0 1-27.94 38.15c-18.82-29.08-54.21-51-90.45-51.64l-213.1-.01c-52.72 0-96.33-14.18-128.5-40.52V528.2a105.93 105.93 0 0 0 22.17 33.17z"></path>
</svg>
</div>
</div>
<div class="mt-6 text-center text-xs text-gray-800 font-medium">
Increment Magazine
<p class="text-gray-500 font-normal">$14 per quarter</p>
</div>
<!-- Pay apple -->
<div class="w-full bg-gray-800 py-1 rounded mt-4">
<svg class="h-4 w-full" viewBox="0 0 32 14">
<path fill="#FFF" d="M25.94 4.22l1.62 5.23h.03l1.62-5.23h1.4l-2.41 6.77c-.56 1.55-1.19 2.06-2.52 2.06-.1 0-.44 0-.53-.03v-1.06l.4.02c.6 0 .95-.26 1.16-.92l.12-.4-2.32-6.44h1.43zM7.4 3.43c.31.03 1.2.12 1.76.96C9.1 4.43 8.1 5 8.1 6.22c.01 1.45 1.27 1.94 1.29 1.95-.02.04-.2.69-.66 1.36-.4.59-.82 1.17-1.47 1.18-.64.01-.85-.38-1.58-.38-.73 0-.97.37-1.57.4-.63.01-1.11-.64-1.51-1.23-.83-1.19-1.45-3.36-.6-4.83a2.32 2.32 0 0 1 1.97-1.2c.63-.01 1.2.41 1.58.41.38 0 1.05-.5 1.83-.45zm14 .71c1.57 0 2.6.82 2.6 2.1v4.4h-1.27V9.6h-.03a2.26 2.26 0 0 1-2.02 1.12c-1.28 0-2.17-.76-2.17-1.9 0-1.13.87-1.78 2.46-1.88l1.7-.1v-.5c0-.72-.46-1.11-1.3-1.11-.7 0-1.2.36-1.3.9h-1.24c.04-1.15 1.12-1.98 2.57-1.98zm-6.13-2.35c1.71 0 2.9 1.18 2.9 2.9a2.8 2.8 0 0 1-2.95 2.93h-1.9v3.03h-1.36V1.79h3.3zm7.4 5.95l-1.52.1c-.85.06-1.3.38-1.3.93s.46.9 1.2.9c.92 0 1.63-.6 1.63-1.43v-.5zm-7.76-4.8h-1.58v3.53h1.57c1.2 0 1.87-.65 1.87-1.77 0-1.11-.68-1.75-1.86-1.75zM7.4 1.12c.06.57-.16 1.13-.5 1.54-.34.4-.88.73-1.42.68-.07-.55.2-1.13.5-1.48.35-.42.94-.71 1.42-.74z"></path>
</svg>
</div>
<div class="mt-4 text-center text-xs text-gray-500 font-normal">
<div class="relative">
<div class="absolute bg-gradient-to-br from-gray-300 to-gray-300 h-[1px] w-full bg-no-repeat top-2 z-0"></div>
<span class="bg-white z-10 px-2 relative">Or pay with card</span>
</div>
</div>
<div class="mt-2">
<label class="text-xs text-gray-600" for="email">Email</label>
<div class="w-full border rounded mt-1 shadow-sm">&nbsp;</div>
</div>
<div class="mt-2 mb-4">
<label class="text-xs text-gray-600" for="email">Card Information</label>
<div class="text-xs w-full mt-1 shadow-sm grid grid-flow-row auto-cols-fr grid-cols-2 font-light">
<div class="min-h-[24px] border border-r-0 rounded rounded-b-none rounded-r-none text-gray-400 py-1 px-2">Number</div>
<div class="min-h-[24px] border border-l-0 rounded rounded-b-none rounded-l-none text-gray-400 py-1 px-2 flex justify-end items-center space-x-2">
<svg width="17" viewBox="0 0 17 12">
<path fill="#FFF" stroke="#000" stroke-opacity=".2" stroke-width=".5" d="M1.6.18h13.8c.79 0 1.42.63 1.42 1.41v8.74c0 .78-.63 1.42-1.41 1.42H1.59c-.78 0-1.41-.64-1.41-1.42V1.6C.18.81.8.18 1.59.18z"></path>
<path fill="#171E6C" d="M1.98 4.39A5.1 5.1 0 0 0 .7 3.9l.02-.09h1.93c.27 0 .48.1.55.37l.42 2.01.13.6 1.18-2.97h1.28l-1.9 4.35H3.05l-1.07-3.8zm5.17 3.8h-1.2l.75-4.37h1.2l-.75 4.37zm4.37-4.26l-.16.95-.11-.05c-.21-.09-.5-.18-.9-.17-.48 0-.69.19-.7.38 0 .2.27.33.68.54.7.3 1.02.69 1.02 1.19-.01.9-.83 1.48-2.1 1.48-.54 0-1.06-.1-1.34-.22l.16-.99.17.07c.39.17.64.24 1.13.24.34 0 .71-.14.72-.43 0-.19-.16-.33-.63-.54-.45-.22-1.06-.57-1.05-1.2 0-.84.85-1.44 2.03-1.44.47 0 .85.1 1.08.19zm1.6 2.72h1l-.27-1.27-.09-.38-.15.43-.48 1.22zm1.5-2.83l.96 4.37h-1.12l-.14-.65h-1.54l-.26.65h-1.26l1.79-4c.13-.3.34-.36.63-.36h.93v-.01z"></path>
</svg>
<svg width="17" viewBox="0 0 17 12">
<rect width="17" height="12" fill="#0A2540" rx="2"></rect>
<circle cx="6" cy="6" r="3.6" fill="#ED0006"></circle>
<circle cx="10.8" cy="6" r="3.6" fill="#F9A000"></circle>
<path fill="#FF5D00" d="M8.4 3.32a3.6 3.6 0 0 1 0 5.36 3.58 3.58 0 0 1-.08-5.29z"></path>
</svg>
<svg width="17" viewBox="0 0 17 12">
<rect width="17" height="12" fill="#016FD0" rx="2"></rect>
<polygon fill="#FFF" points="9.347 10.101 9.347 5.801 17 5.808 17 6.996 16.115 7.941 17 8.895 17 10.108 15.588 10.108 14.837 9.28 14.092 10.111"></polygon>
<polygon fill="#016FD0" points="9.858 9.63 9.858 6.275 12.703 6.275 12.703 7.047 10.779 7.047 10.779 7.572 12.657 7.572 12.657 8.332 10.779 8.332 10.779 8.847 12.703 8.847 12.703 9.63"></polygon>
<polygon fill="#016FD0" points="12.689 9.63 14.263 7.95 12.689 6.275 13.907 6.275 14.869 7.338 15.834 6.275 17 6.275 17 6.301 15.459 7.95 17 9.582 17 9.63 15.822 9.63 14.843 8.556 13.874 9.63"></polygon>
<polygon fill="#FFF" points="9.704 1.985 11.549 1.985 12.197 3.456 12.197 1.985 14.474 1.985 14.867 3.087 15.261 1.985 17 1.985 17 6.285 7.809 6.285"></polygon>
<path fill="#016FD0" d="M10.05 2.45L8.56 5.8H9.6l.28-.67h1.52l.28.67h1.05l-1.49-3.35h-1.18zm.13 1.93l.45-1.07.44 1.07h-.89z"></path>
<polygon fill="#016FD0" points="12.701 5.804 12.701 2.451 14.137 2.457 14.875 4.517 15.619 2.451 17 2.451 17 5.804 16.111 5.812 16.111 3.509 15.272 5.804 14.461 5.804 13.604 3.501 13.604 5.804"></polygon>
</svg>
<svg width="17" viewBox="0 0 17 12">
<path fill="#FFF" stroke="#000" stroke-opacity=".2" stroke-width=".5" d="M15.58 11.75c.68 0 1.24-.55 1.24-1.24V1.4c0-.32-.14-.64-.37-.87a1.22 1.22 0 0 0-.87-.36H1.42C1.09.18.78.3.55.53a1.3 1.3 0 0 0-.37.89v9.09c0 .32.14.64.37.88.23.23.54.36.87.36h14.16z"></path>
<path fill="#F27712" d="M8.93 12.07h6.65c.78 0 1.41-.62 1.42-1.4V9a27.44 27.44 0 0 1-8.07 3.07z"></path>
<path fill="#000" d="M16.41 6.79h-.6l-.68-.9h-.07v.9h-.49V4.56h.73c.57 0 .9.23.9.65 0 .35-.21.57-.57.64l.78.94zm-.72-1.56c0-.21-.17-.33-.47-.33h-.15v.68h.14c.31 0 .48-.12.48-.35zm-2.83-.67h1.38v.37h-.9v.5h.87v.38h-.87v.6h.9v.38h-1.4V4.56h.02zm-1.6 2.28l-1.06-2.3h.54l.67 1.51.68-1.5h.53l-1.07 2.3h-.28zm-4.46 0c-.75 0-1.34-.51-1.34-1.17 0-.65.6-1.17 1.35-1.17.21 0 .39.04.6.13v.52a.88.88 0 0 0-.61-.25c-.47 0-.83.34-.83.77 0 .44.36.77.85.77.23 0 .4-.07.6-.25v.52c-.23.1-.41.13-.62.13zM5.31 6.1c0 .43-.35.73-.88.73-.37 0-.63-.13-.87-.43l.33-.26c.1.2.3.3.53.3.22 0 .38-.15.38-.32 0-.1-.05-.18-.15-.23-.1-.05-.22-.1-.34-.13-.46-.15-.62-.3-.62-.62 0-.36.34-.63.79-.63.28 0 .53.08.74.24l-.25.3a.54.54 0 0 0-.4-.18c-.21 0-.37.11-.37.25 0 .12.1.18.38.28.57.18.73.34.73.7zM2.9 4.56h.5v2.23h-.5V4.56zM1.3 6.79H.59V4.56h.72c.8 0 1.35.46 1.35 1.1 0 .35-.16.66-.45.87-.25.18-.52.26-.9.26zm.57-1.67c-.16-.13-.35-.18-.67-.18h-.13v1.48h.14c.31 0 .5-.06.66-.18a.7.7 0 0 0 0-1.12z"></path>
<path fill="#F27712" d="M8.79 4.5c-.64 0-1.17.52-1.17 1.15 0 .68.5 1.2 1.17 1.2.66 0 1.18-.52 1.18-1.18 0-.65-.51-1.17-1.18-1.17z"></path>
</svg>
</div>
<div class="min-h-[24px] border border-r-0 border-t-0 rounded rounded-t-none rounded-r-none rounded-br-none text-gray-400 py-1 px-2">MM / YY</div>
<div class="min-h-[24px] border border-t-0 rounded rounded-t-none rounded-l-0 rounded-bl-none text-gray-400 py-1 px-2 flex justify-between items-center">
<span>CVC</span>
<svg class="CheckoutPhoneGraphic__cvcIcon" width="19" viewBox="0 0 19 14">
<rect width="17" height="12" y="2" fill="#E6EBF1" rx="2"></rect>
<rect width="13" height="2" x="2" y="4" fill="#FFF" rx="1"></rect>
<circle cx="14.5" cy="4.5" r="4.5" fill="#B4C2D0"></circle>
<path fill="#FFF" d="M12.5 5.96V3.03H12c-.04.33-.2.46-.58.5l-.24.01v.51h.66v1.9h.67zm1.61.04c.65 0 1.07-.4 1.07-.87 0-.36-.2-.57-.46-.67a.65.65 0 0 0 .4-.62c0-.48-.38-.84-.99-.84-.63 0-1.02.4-1.09.92l.62.07c.04-.25.2-.43.44-.43.23 0 .37.13.37.32 0 .22-.17.32-.42.32h-.26v.54h.27c.27 0 .46.1.46.33 0 .24-.18.37-.42.37-.25 0-.44-.16-.48-.45l-.65.1c.08.6.54.91 1.14.91zm2.53 0c.6 0 1.07-.43 1.07-1.02 0-.56-.36-.98-.95-.98-.2 0-.37.07-.48.16l.05-.54h1.2v-.58h-1.7l-.14 1.6.6.07c.07-.1.2-.18.37-.18.26 0 .42.2.42.46 0 .27-.2.45-.45.45s-.42-.17-.46-.44l-.65.1c.09.58.52.9 1.12.9z"></path>
</svg>
</div>
</div>
</div>
<div class="mt-2 mb-4">
<label class="text-xs text-gray-600" for="email">Country or region</label>
<div class="text-xs w-full mt-1 shadow-sm grid grid-flow-row auto-cols-fr grid-cols-1">
<div class="min-h-[24px] border rounded rounded-b-none text-gray-500 py-1 px-2">United States</div>
<div class="min-h-[24px] border rounded border-t-0 rounded-t-none text-gray-400 py-1 px-2">ZIP</div>
</div>
</div>
<div class="w-full bg-gray-800 py-1 rounded mt-4 text-center text-white font-light text-xs">
Pay
</div>
</div>
</div>
</div>
</section>
</div>
<section class="grid grid-cols-2 md:grid-cols-4 gap-y-16 mt-36 justify-items-center pb-20">
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="40" viewBox="0 0 200 40" class="w-36 lg:w-48"><title>Instacart logo</title><g fill="none" fill-rule="evenodd"><path fill="var(--userLogoColor, #FF8200)" fill-rule="nonzero" d="M46.7 16.23c1.64 1.66 2.99 4.38 2.22 6-2.07 4.3-17.46 11.87-18.77 10.56-1.3-1.3 6.26-16.72 10.57-18.79 1.6-.77 4.32.58 5.98 2.23z"></path><path fill="var(--userLogoColor, #43B02A)" fill-rule="nonzero" d="M54.85 14.41c-.27-.99-.95-2-1.97-2.11-1.87-.22-4.82 3.1-4.61 3.88.2.78 4.37 2.17 5.93 1.05.8-.58.92-1.82.65-2.82zm-5.8-9.17c1.4.38 2.8 1.34 2.97 2.77.3 2.62-4.33 6.76-5.43 6.47-1.1-.3-3.04-6.15-1.48-8.33.81-1.13 2.56-1.28 3.95-.91zm41.43 15.54l-1.37-.2c-1.31-.2-2.07-.63-2.07-1.4 0-.89.98-1.44 2.45-1.44 1.03 0 1.87.39 2.68.8l.16.08c.18.1.38.14.6.14.47 0 .9-.26 1.14-.68l.11-.2a1.34 1.34 0 0 0-.57-1.85 8.8 8.8 0 0 0-4.12-1.12c-3.5 0-5.77 1.7-5.77 4.42 0 2.24 1.61 3.64 4.65 4.06l1.4.18c1.46.2 2.17.64 2.17 1.33 0 .64-.34 1.48-2.61 1.48a6.7 6.7 0 0 1-3.56-.97 1.33 1.33 0 0 0-1.81.43l-.08.12c-.2.31-.25.7-.16 1.05.09.36.31.65.63.83a11.2 11.2 0 0 0 4.98 1.37c3.65 0 5.91-1.6 5.91-4.42 0-2.26-1.6-3.55-4.76-4zm42.49 4.93a1.4 1.4 0 0 0-1.8-.25c-.74.48-1.56.73-2.36.73-2.19 0-3.78-1.74-3.78-4.13 0-2.4 1.59-4.13 3.78-4.13.85 0 1.6.23 2.31.7.55.37 1.34.28 1.79-.2l.11-.13a1.53 1.53 0 0 0-.25-2.3 6.96 6.96 0 0 0-3.87-1.1c-4.21 0-7.16 2.94-7.16 7.16 0 4.22 2.95 7.16 7.16 7.16 1.46 0 2.8-.38 3.89-1.11a1.52 1.52 0 0 0 .28-2.29l-.1-.11zM64.78 10.05c-1.1 0-1.95.87-1.95 1.98 0 1.12.84 1.96 1.95 1.96 1.11 0 1.98-.86 1.98-1.96s-.87-1.98-1.98-1.98zm.6 4.96h-1.16c-.57 0-1.02.46-1.02 1.03v11.81c0 .57.46 1.03 1.02 1.03h1.15c.57 0 1.03-.46 1.03-1.03V16.04c0-.57-.46-1.03-1.03-1.03zm37.87 11.12a2.8 2.8 0 0 1-2.8-2.8V18h2.8c.57 0 1.03-.46 1.03-1.03v-.93c0-.57-.46-1.03-1.03-1.03h-2.8v-3.07c0-.57-.46-1.03-1.03-1.03h-1.21c-.57 0-1.03.46-1.03 1.03v11.2c0 3.22 2.45 6.07 5.83 6.07a1.26 1.26 0 0 0 1.27-1.27v-.79c0-.57-.47-1.02-1.03-1.02zM75.29 14.9a6.22 6.22 0 0 0-6.38 6.08v6.87c0 .57.46 1.03 1.03 1.03h1.16c.57 0 1.03-.46 1.03-1.03V21.5c0-2.13 1.28-3.54 3.16-3.54 1.88 0 3.17 1.41 3.17 3.54v6.35c0 .57.46 1.03 1.02 1.03h1.17c.56 0 1.02-.46 1.02-1.03v-6.87c0-2.8-2.28-6.08-6.38-6.08zm84.24.14a14.4 14.4 0 0 0-2.14-.14h-.15a6.14 6.14 0 0 0-6.1 6.15v6.8c0 .57.46 1.03 1.03 1.03h1.16c.57 0 1.03-.46 1.03-1.03v-6.68c0-1.94 1.38-3.2 3.08-3.2.3 0 .64.03.97.1a1.4 1.4 0 0 0 1.63-1.05l.2-.84a.93.93 0 0 0-.71-1.14zm8.56 2.96c.56 0 1.02-.46 1.02-1.03v-.93c0-.57-.46-1.03-1.02-1.03h-2.81v-3.07c0-.57-.46-1.03-1.03-1.03h-1.21c-.57 0-1.03.46-1.03 1.03v11.2c0 3.22 2.45 6.07 5.83 6.07a1.26 1.26 0 0 0 1.27-1.27v-.79c0-.57-.47-1.02-1.03-1.02a2.8 2.8 0 0 1-2.8-2.8V18h2.8zm-22.27-2a6.96 6.96 0 0 0-3.88-1.1H141.8c-1.45 0-2.79.38-3.87 1.1a6.92 6.92 0 0 0-3.13 6.06c0 2.8 1.3 5.05 3.4 6.23a6.7 6.7 0 0 0 3.42.93c2.3 0 3.69-1.3 4.12-1.87v.5c0 .56.46 1.02 1.03 1.02h1.16c.57 0 1.03-.46 1.03-1.03v-5.78a6.92 6.92 0 0 0-3.13-6.06zm-2.67 9.97a4.16 4.16 0 0 1-1.21.22h-.14a4.09 4.09 0 0 1-1.22-.22c-1.5-.53-2.5-2.01-2.5-3.9 0-2.25 1.39-3.91 3.37-4.12h.03a3.98 3.98 0 0 1 .34-.02h.09a4.1 4.1 0 0 1 .35.02h.03c1.98.2 3.37 1.87 3.37 4.11 0 1.9-1 3.38-2.5 3.91zM116.7 16a6.96 6.96 0 0 0-3.87-1.1H112.67c-1.45 0-2.8.38-3.87 1.1a6.92 6.92 0 0 0-3.14 6.06c0 2.8 1.3 5.05 3.42 6.23a6.7 6.7 0 0 0 3.4.93c2.3 0 3.7-1.3 4.13-1.87v.5c0 .56.46 1.02 1.02 1.02h1.17c.57 0 1.02-.46 1.02-1.03v-5.78A6.92 6.92 0 0 0 116.7 16zm-2.66 9.97a4.16 4.16 0 0 1-1.22.22h-.14a4.09 4.09 0 0 1-1.21-.22c-1.51-.53-2.51-2.01-2.51-3.9 0-2.25 1.4-3.91 3.37-4.12h.03a3.98 3.98 0 0 1 .35-.02h.09a4.1 4.1 0 0 1 .34.02h.03c1.98.2 3.38 1.87 3.38 4.11 0 1.9-1 3.38-2.51 3.91z"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="40" viewBox="0 0 200 40" class="w-36 lg:w-48"><title>Salesforce logo</title><g fill="none" fill-rule="evenodd"><g fill-rule="nonzero"><path fill="var(--userLogoColor, #00A1E0)" d="M94.78 4.37a10.08 10.08 0 0 1 7.25-3.12c3.78 0 7.06 2.11 8.82 5.23a12.35 12.35 0 0 1 17.3 11.36 12.37 12.37 0 0 1-14.73 12.18 9.01 9.01 0 0 1-11.8 3.72 10.29 10.29 0 0 1-19.1-.47 9.58 9.58 0 0 1-11.5-9.45 9.66 9.66 0 0 1 4.77-8.35 11.07 11.07 0 0 1 18.99-11.1"></path><path fill="var(--userLogoColor, #FFF)" d="M79.29 20.75l.24-.64c.04-.11.1-.07.15-.04l.2.13c.68.44 1.32.44 1.52.44.5 0 .83-.27.83-.64v-.02c0-.4-.48-.55-1.05-.73l-.14-.04c-.77-.22-1.6-.55-1.6-1.52v-.02c0-.92.75-1.58 1.82-1.58h.11c.64 0 1.23.17 1.67.46.05.02.1.07.07.13l-.24.64c-.05.1-.16.04-.16.04-.4-.22-.98-.37-1.49-.37-.46 0-.75.24-.75.57v.02c0 .38.5.55 1.08.73l.1.02c.78.24 1.6.57 1.6 1.52v.02c0 1-.73 1.62-1.9 1.62-.57 0-1.12-.08-1.71-.4-.11-.06-.22-.1-.33-.19-.02-.04-.07-.06-.02-.15zm17.14 0l.24-.64c.04-.11.13-.07.15-.04l.2.13c.68.44 1.32.44 1.52.44.5 0 .83-.27.83-.64v-.02c0-.4-.48-.55-1.05-.73l-.13-.04c-.77-.22-1.6-.55-1.6-1.52v-.02c0-.92.74-1.58 1.82-1.58h.1c.64 0 1.24.17 1.68.46.04.02.08.07.06.13l-.24.64c-.04.1-.15.04-.15.04-.4-.22-1-.37-1.5-.37-.46 0-.74.24-.74.57v.02c0 .38.5.55 1.07.73l.11.02c.77.24 1.58.57 1.58 1.52v.02c0 1-.72 1.62-1.89 1.62-.57 0-1.12-.08-1.71-.4-.11-.06-.22-.1-.33-.19 0-.04-.04-.06-.02-.15zm12.7-3.01c.09.33.16.68.16 1.05s-.05.73-.16 1.06a2.12 2.12 0 0 1-1.19 1.43c-.3.13-.65.2-1.05.2s-.75-.07-1.05-.2c-.31-.14-.55-.33-.75-.58-.2-.24-.35-.52-.44-.85a4.07 4.07 0 0 1-.16-1.06c0-.37.05-.72.16-1.05a2.12 2.12 0 0 1 1.19-1.43 2.66 2.66 0 0 1 2.1 0c.31.13.55.33.75.57.2.24.35.53.44.86zm-.99 1.03c0-.57-.1-1.01-.3-1.32-.2-.3-.53-.46-.95-.46-.44 0-.75.15-.94.46-.2.3-.31.75-.31 1.32 0 .57.1 1.01.3 1.34.2.3.51.46.95.46.44 0 .75-.15.95-.46.21-.3.3-.77.3-1.34zm9.04 1.65l.24.66c.02.08-.05.1-.05.1a3.8 3.8 0 0 1-1.38.25c-.86 0-1.5-.24-1.94-.73a2.81 2.81 0 0 1-.65-1.95c0-.38.04-.73.15-1.06a2.35 2.35 0 0 1 1.27-1.43c.31-.13.69-.22 1.1-.22.29 0 .53.03.73.05.22.04.53.1.66.17.02 0 .09.05.06.11-.08.27-.15.44-.24.66-.04.11-.1.07-.1.07a3.09 3.09 0 0 0-1.04-.15c-.48 0-.86.15-1.08.48-.24.3-.37.72-.37 1.3 0 .61.15 1.05.42 1.34.26.28.63.41 1.12.41.2 0 .37-.02.52-.04.16-.02.31-.07.47-.13-.03.04.06.02.1.1zm4.98-2.88c.22.75.11 1.38.1 1.43 0 .08-.1.08-.1.08h-3.31c.02.51.13.86.4 1.1.23.25.6.4 1.13.4.8 0 1.13-.15 1.37-.24 0 0 .09-.02.13.06l.22.62c.04.1 0 .13-.02.15-.2.11-.7.33-1.67.33-.46 0-.88-.06-1.21-.2-.33-.13-.62-.3-.84-.54a2.45 2.45 0 0 1-.48-.84 3.31 3.31 0 0 1-.15-1.05c0-.38.04-.73.15-1.06.09-.33.24-.62.44-.86s.46-.44.77-.57c.3-.15.68-.22 1.1-.22.35 0 .68.07.94.2a1.95 1.95 0 0 1 1.03 1.2zm-3.3.7h2.36c-.02-.3-.09-.57-.22-.79-.2-.3-.48-.48-.92-.48-.44 0-.75.17-.95.48-.13.2-.2.46-.26.8zm-23.22-.7c.22.75.1 1.38.1 1.43 0 .08-.08.08-.08.08h-3.32c.02.51.13.86.4 1.1.24.25.61.4 1.14.4.79 0 1.12-.15 1.36-.24 0 0 .09-.02.13.06l.22.62c.05.1 0 .13-.02.15-.2.11-.7.33-1.67.33-.46 0-.88-.06-1.2-.2-.34-.13-.62-.3-.84-.54a2.45 2.45 0 0 1-.49-.84 3.31 3.31 0 0 1-.15-1.05c0-.38.04-.73.15-1.06.1-.33.25-.62.44-.86a2.45 2.45 0 0 1 1.87-.8c.35.01.68.08.95.21a1.82 1.82 0 0 1 1.01 1.2zm-3.3.7h2.37c-.02-.3-.08-.57-.22-.79-.2-.3-.48-.48-.92-.48-.44 0-.75.17-.94.48-.16.2-.22.46-.29.8zm-5.82-.17l.55.06V18c0-.44-.1-.66-.27-.8A1.38 1.38 0 0 0 86 17s-.81 0-1.45.33c-.02.02-.05.02-.05.02s-.08.02-.1-.04l-.25-.64c-.04-.09.02-.13.02-.13.31-.24 1.02-.38 1.02-.38.24-.04.63-.08.87-.08.66 0 1.17.15 1.52.46.35.3.53.79.53 1.47v3.03s0 .1-.07.11c0 0-.13.05-.24.07l-.83.15a5.1 5.1 0 0 1-1.9 0 2.12 2.12 0 0 1-.68-.28 1.49 1.49 0 0 1-.59-1.28c0-.28.07-.55.18-.77.1-.22.28-.4.48-.55a2.45 2.45 0 0 1 1.5-.44c.26.03.43.03.57.03zM85.2 20.4s.3.24.96.2c.49-.03.9-.12.9-.12v-1.51s-.41-.07-.9-.07c-.68 0-.96.24-.96.24-.2.13-.29.35-.29.64 0 .18.05.33.11.44.02.04.05.09.18.18zm28.02-4.03c-.02.1-.2.55-.24.7-.02.07-.07.1-.13.1 0 0-.2-.05-.38-.05-.1 0-.28.02-.44.07a1.05 1.05 0 0 0-.7.73c-.07.19-.11.52-.11.87v2.46c0 .07-.04.11-.11.11h-.88c-.07 0-.1-.04-.1-.1V16.3c0-.07.03-.11.08-.11h.86c.06 0 .08.04.08.1v.4c.14-.17.36-.33.55-.41.2-.1.44-.16.86-.14.22.03.5.07.55.1.09.01.13.04.11.12zm-8.15-2.28c.02 0 .08.04.06.1l-.26.71c-.02.05-.05.09-.16.05-.02 0-.06-.03-.17-.05-.07-.02-.18-.02-.27-.02-.13 0-.24.02-.35.04a.57.57 0 0 0-.28.18c-.1.09-.18.2-.24.35a3.3 3.3 0 0 0-.18.75h1.05c.1 0 .11.04.11.1l-.13.69c-.02.1-.1.09-.1.09h-1.1l-.7 4.24c-.1.44-.19.81-.3 1.12-.1.3-.24.53-.43.75-.18.2-.38.35-.62.41-.22.1-.5.14-.81.14-.16 0-.31 0-.49-.05-.13-.02-.2-.04-.3-.09-.05-.02-.07-.06-.05-.13l.24-.68c.05-.09.11-.04.11-.04l.18.06c.09.03.17.03.26.03.16 0 .29-.03.4-.07a.66.66 0 0 0 .3-.24c.1-.11.16-.27.25-.46.06-.2.13-.49.2-.82l.74-4.15h-.72c-.09 0-.11-.05-.11-.11l.13-.68c.02-.11.11-.09.11-.09h.75l.04-.22a2.7 2.7 0 0 1 .66-1.5c.33-.32.81-.5 1.4-.5.18 0 .34.02.47.04.09-.02.2 0 .3.05zm-14.82 7.14c0 .07-.04.11-.09.11h-.87c-.07 0-.1-.04-.1-.1v-7.06c0-.05.05-.11.1-.11h.87c.07 0 .1.04.1.1v7.06z"></path></g></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="40" viewBox="0 0 200 40" class="w-36 lg:w-48"><title>Amazon logo</title><g fill="none" fill-rule="evenodd"><path fill="var(--userLogoColor, #EFA82E)" d="M111.58 33.91C106.18 37.9 98.37 40 91.64 40a36.13 36.13 0 0 1-24.37-9.28c-.5-.45-.05-1.08.56-.72a49.08 49.08 0 0 0 24.37 6.46c5.98 0 12.55-1.24 18.6-3.8.9-.39 1.67.6.78 1.25"></path><path fill="var(--userLogoColor, #EFA82E)" d="M113.82 31.36c-.69-.88-4.56-.42-6.3-.21-.52.06-.6-.4-.13-.73 3.09-2.17 8.15-1.54 8.73-.82.6.74-.15 5.8-3.04 8.21-.45.38-.87.18-.67-.31.65-1.63 2.1-5.26 1.41-6.14"></path><path fill="var(--userLogoColor, #1B1A19)" d="M107.65 15.13v-2.1c0-.33.24-.54.53-.54h9.45c.3 0 .54.22.54.53v1.8c0 .3-.26.7-.71 1.33l-4.9 6.97c1.82-.04 3.74.23 5.4 1.16.36.2.47.51.5.82v2.24c0 .31-.34.67-.7.48a10.89 10.89 0 0 0-9.98.02c-.33.17-.67-.18-.67-.49v-2.13c0-.34 0-.93.35-1.45l5.67-8.11h-4.94a.53.53 0 0 1-.54-.53M73.2 28.26h-2.88a.54.54 0 0 1-.5-.48V13.06c0-.3.24-.53.55-.53h2.67c.28.01.5.23.52.5v1.92h.06c.7-1.86 2-2.73 3.78-2.73 1.8 0 2.92.87 3.73 2.73a4.08 4.08 0 0 1 3.96-2.73c1.2 0 2.52.5 3.33 1.61.9 1.24.72 3.04.72 4.62v9.28c0 .3-.25.53-.55.53h-2.87a.54.54 0 0 1-.52-.52v-7.8c0-.63.06-2.18-.08-2.76-.22-1-.86-1.27-1.69-1.27-.7 0-1.42.46-1.72 1.2-.29.75-.26 1.99-.26 2.82v7.8c0 .3-.25.53-.56.53h-2.87a.54.54 0 0 1-.51-.52v-7.8c0-1.65.26-4.06-1.77-4.06-2.07 0-1.99 2.35-1.99 4.05v7.8c0 .3-.25.53-.55.53m53.11-13.03c-2.11 0-2.25 2.88-2.25 4.67 0 1.8-.02 5.64 2.23 5.64 2.22 0 2.33-3.1 2.33-4.99 0-1.24-.05-2.72-.43-3.9-.32-1.02-.96-1.42-1.88-1.42m-.02-3.01c4.26 0 6.57 3.66 6.57 8.3 0 4.5-2.55 8.05-6.57 8.05-4.19 0-6.46-3.65-6.46-8.2 0-4.59 2.3-8.15 6.46-8.15m12.1 16.04h-2.87a.54.54 0 0 1-.51-.52V13a.55.55 0 0 1 .55-.48h2.66c.25.01.46.18.51.41v2.25h.05c.81-2.01 1.94-2.97 3.92-2.97 1.29 0 2.55.47 3.35 1.74.75 1.17.75 3.16.75 4.58v9.26a.55.55 0 0 1-.55.46h-2.88a.54.54 0 0 1-.5-.46v-8c0-1.6.18-3.95-1.8-3.95-.7 0-1.35.46-1.67 1.17-.4.9-.46 1.8-.46 2.79v7.92c0 .3-.25.53-.55.53m-35.38-.03a.6.6 0 0 1-.68.06c-.96-.79-1.13-1.15-1.65-1.9-1.57 1.6-2.7 2.08-4.73 2.08-2.42 0-4.3-1.5-4.3-4.47a4.87 4.87 0 0 1 3.06-4.69c1.56-.68 3.74-.8 5.4-1v-.36c0-.69.06-1.5-.35-2.08-.35-.53-1.02-.75-1.61-.75-1.1 0-2.07.56-2.31 1.72-.05.26-.24.52-.5.53l-2.78-.3c-.24-.05-.5-.24-.43-.6.64-3.37 3.69-4.4 6.42-4.4 1.4 0 3.23.38 4.33 1.44 1.4 1.3 1.26 3.04 1.26 4.93v4.47c0 1.34.56 1.93 1.09 2.66.18.26.22.57-.01.76-.59.49-1.63 1.4-2.2 1.9h-.01zm-2.9-7c0 1.12.03 2.05-.54 3.05-.45.8-1.18 1.3-1.98 1.3-1.1 0-1.75-.84-1.75-2.08 0-2.44 2.2-2.88 4.27-2.88v.61zm-34.76 7a.6.6 0 0 1-.68.06c-.95-.79-1.12-1.15-1.65-1.9-1.57 1.6-2.69 2.08-4.73 2.08-2.42 0-4.3-1.5-4.3-4.47a4.87 4.87 0 0 1 3.06-4.69c1.56-.68 3.74-.8 5.4-1v-.36c0-.69.06-1.5-.35-2.08-.34-.53-1.02-.75-1.6-.75-1.1 0-2.08.56-2.32 1.72-.05.26-.24.52-.5.53l-2.78-.3c-.23-.05-.5-.24-.43-.6.64-3.37 3.7-4.4 6.43-4.4 1.4 0 3.22.38 4.32 1.44 1.4 1.3 1.27 3.04 1.27 4.93v4.47c0 1.34.55 1.93 1.08 2.66.18.26.22.57-.01.76-.59.49-1.63 1.4-2.2 1.9zm-2.9-7c0 1.12.03 2.05-.53 3.05-.46.8-1.18 1.3-2 1.3-1.1 0-1.74-.84-1.74-2.08 0-2.44 2.2-2.88 4.28-2.88v.61z"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="40" viewBox="0 0 200 40" class="w-36 lg:w-48"><title>Slack logo</title><g fill="none" fill-rule="evenodd"><path fill="var(--userLogoColor, #000)" fill-rule="nonzero" d="M80.95 28.15l1.32-3.06a8.8 8.8 0 0 0 5.2 1.62c1.38 0 2.25-.53 2.25-1.34-.02-2.26-8.28-.49-8.34-6.15-.03-2.87 2.53-5.08 6.15-5.08 2.15 0 4.3.53 5.83 1.75L92.12 19a9.32 9.32 0 0 0-4.8-1.53c-1.13 0-1.88.53-1.88 1.21.02 2.21 8.34 1 8.43 6.4 0 2.94-2.49 5-6.07 5-2.61 0-5.02-.62-6.85-1.94M131.59 24a3.8 3.8 0 1 1 0-3.74l3.64-2.02a7.98 7.98 0 1 0 0 7.78l-3.64-2.02zM95.7 7.53h4.55v22.26H95.7zM137.01 7.53V29.8h4.56v-6.68l5.4 6.68h5.84l-6.88-7.93 6.37-7.4h-5.58l-5.15 6.15V7.53zM113.8 24.03a4.2 4.2 0 0 1-3.56 1.9 3.8 3.8 0 1 1 0-7.62c1.53 0 2.9.85 3.55 1.96v3.76zm0-9.57v1.8c-.75-1.25-2.6-2.12-4.54-2.12-4 0-7.15 3.53-7.15 7.95 0 4.43 3.15 8 7.15 8 1.94 0 3.79-.87 4.53-2.13v1.8h4.56v-15.3h-4.56z"></path><path fill="var(--userLogoColor, #E01E5A)" fill-rule="nonzero" d="M52.79 24a2.8 2.8 0 1 1-2.81-2.8h2.81V24zm1.4 0a2.8 2.8 0 1 1 5.62 0v7.02a2.8 2.8 0 1 1-5.62 0v-7.01z"></path><path fill="var(--userLogoColor, #36C5F0)" fill-rule="nonzero" d="M57 12.74a2.8 2.8 0 1 1 2.81-2.8v2.8h-2.8zm0 1.42a2.8 2.8 0 1 1 0 5.62h-7.04a2.8 2.8 0 1 1 0-5.62H57z"></path><path fill="var(--userLogoColor, #2EB67D)" fill-rule="nonzero" d="M68.26 16.97a2.8 2.8 0 1 1 2.81 2.8h-2.8v-2.8zm-1.4 0a2.8 2.8 0 1 1-5.62 0V9.93a2.8 2.8 0 1 1 5.62 0v7.04z"></path><path fill="var(--userLogoColor, #ECB22E)" fill-rule="nonzero" d="M64.05 28.22a2.8 2.8 0 1 1-2.81 2.8v-2.8h2.8zm0-1.4a2.8 2.8 0 1 1 0-5.62h7.04a2.8 2.8 0 1 1 0 5.61h-7.04z"></path></g></svg>
<svg width="200" height="40" viewBox="0 0 200 40" xmlns="http://www.w3.org/2000/svg" class="w-36 lg:w-48"><title>Shopify logo</title><path d="M66.54 8.43c-.02-.18-.18-.26-.3-.27-.11-.02-2.46-.04-2.46-.04L61.61 6c-.19-.2-.56-.14-.72-.1l-1 .31a6.5 6.5 0 0 0-.46-1.15c-.7-1.35-1.72-2.05-2.97-2.05-.08 0-.18 0-.26.02a2.6 2.6 0 0 0-2.17-.98c-1.6.04-3.18 1.2-4.5 3.26A12.73 12.73 0 0 0 47.75 10c-1.84.57-3.13.96-3.14.98-.92.3-.96.31-1.08 1.2-.1.64-2.52 19.41-2.52 19.41l20.34 3.52 8.81-2.19S66.55 8.6 66.54 8.43zm-7.66-1.9l-1.58.5a9.17 9.17 0 0 0-.5-2.92c1.24.23 1.83 1.6 2.08 2.42zm-2.64.82l-3.4 1.06c.33-1.25.96-2.5 1.72-3.32.3-.32.68-.65 1.15-.84.45.92.53 2.22.53 3.1zm-2.19-4.22c.37 0 .69.08.96.26-.43.21-.86.54-1.25.97a9.33 9.33 0 0 0-2.11 4.42l-2.8.86c.6-2.58 2.74-6.43 5.2-6.5z" fill="var(--userLogoColor, #95BF47)" fill-rule="nonzero"></path><path d="M66.25 8.16c-.12-.02-2.47-.04-2.47-.04L61.61 6a.39.39 0 0 0-.27-.12V35.1l8.81-2.19s-3.6-24.3-3.61-24.48a.35.35 0 0 0-.3-.27z" fill="var(--userLogoColor, #5E8E3E)" fill-rule="nonzero"></path><path d="M56.46 12.69l-1.02 3.83s-1.13-.53-2.5-.43c-2 .12-2.01 1.37-2 1.7.12 1.72 4.62 2.09 4.87 6.1.2 3.16-1.68 5.31-4.38 5.49a6.59 6.59 0 0 1-5.02-1.7l.69-2.92s1.8 1.35 3.22 1.27a1.26 1.26 0 0 0 1.23-1.36c-.14-2.23-3.8-2.11-4.04-5.77-.2-3.09 1.83-6.21 6.3-6.5 1.77-.16 2.65.29 2.65.29z" fill="var(--userLogoColorAlt, #FFF)" fill-rule="nonzero"></path><path d="M82.1 20.86c-1.02-.55-1.55-1.02-1.55-1.66 0-.83.72-1.35 1.88-1.35 1.32 0 2.5.54 2.5.54l.93-2.85s-.86-.66-3.38-.66c-3.51 0-5.96 2.01-5.96 4.84 0 1.6 1.14 2.84 2.66 3.72 1.23.7 1.66 1.19 1.66 1.93 0 .76-.6 1.37-1.76 1.37-1.7 0-3.3-.88-3.3-.88l-1 2.85s1.49 1 3.97 1c3.62 0 6.22-1.78 6.22-4.98.02-1.74-1.3-2.97-2.88-3.87zm14.41-6.02c-1.77 0-3.18.84-4.26 2.13l-.05-.02 1.54-8.1H89.7l-3.9 20.58h4.02l1.35-7.03c.53-2.66 1.9-4.3 3.18-4.3.9 0 1.25.6 1.25 1.49 0 .54-.05 1.23-.17 1.77l-1.53 8.05h4.03l1.58-8.32c.18-.88.3-1.93.3-2.62 0-2.24-1.22-3.63-3.3-3.63zm12.41 0c-4.84 0-8.05 4.37-8.05 9.26 0 3.13 1.94 5.63 5.55 5.63 4.75 0 7.97-4.26 7.97-9.26-.02-2.88-1.72-5.63-5.47-5.63zm-2 11.8c-1.36 0-1.95-1.17-1.95-2.62 0-2.3 1.2-6.08 3.39-6.08 1.42 0 1.9 1.24 1.9 2.43 0 2.48-1.2 6.27-3.33 6.27zm17.75-11.8c-2.71 0-4.26 2.38-4.26 2.38h-.06l.24-2.17h-3.56a77.76 77.76 0 0 1-.82 5.34l-2.8 14.73h4.03l1.12-5.96h.07s.82.53 2.37.53c4.73 0 7.81-4.85 7.81-9.75.02-2.68-1.19-5.1-4.14-5.1zm-3.85 11.86c-1.05 0-1.66-.59-1.66-.59l.67-3.77c.46-2.5 1.77-4.18 3.18-4.18 1.23 0 1.6 1.13 1.6 2.23 0 2.6-1.54 6.3-3.79 6.3zm13.76-17.63a2.3 2.3 0 0 0-2.3 2.35c0 1.19.75 2.01 1.89 2.01h.06c1.25 0 2.34-.84 2.36-2.34 0-1.18-.78-2.02-2.01-2.02zm-5.63 20.36h4.03l2.73-14.26h-4.06l-2.7 14.26zm17-14.3h-2.8l.14-.66c.24-1.37 1.06-2.6 2.39-2.6.72 0 1.29.2 1.29.2l.78-3.15s-.7-.35-2.19-.35c-1.43 0-2.85.4-3.95 1.34-1.37 1.18-2.01 2.86-2.34 4.56l-.12.66h-1.88l-.58 3.03h1.87l-2.13 11.27h4.03l2.13-11.27h2.77l.6-3.03zm9.7.04s-2.53 6.35-3.66 9.8h-.06c-.08-1.1-1-9.8-1-9.8h-4.22l2.43 13.11c.05.3.02.47-.08.67a6.95 6.95 0 0 1-2.2 2.42c-.75.55-1.6.9-2.28 1.13l1.12 3.42c.82-.17 2.5-.84 3.94-2.19 1.84-1.72 3.54-4.37 5.28-7.99l4.92-10.57h-4.2z" fill="var(--userLogoColor, #000)" fill-rule="nonzero"></path></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="40" viewBox="0 0 200 40" class="w-36 lg:w-48"><title>Google logo</title><g fill="none" fill-rule="evenodd"><path fill="var(--userLogoColor, #EA4335)" fill-rule="nonzero" d="M92.6 21.65a8.28 8.28 0 0 1-8.41 8.38 8.28 8.28 0 0 1-8.4-8.38 8.25 8.25 0 0 1 8.4-8.38c4.63 0 8.4 3.52 8.4 8.38zm-3.69 0c0-3.02-2.19-5.08-4.72-5.08-2.54 0-4.73 2.06-4.73 5.08 0 2.98 2.19 5.07 4.73 5.07 2.53 0 4.72-2.1 4.72-5.07z"></path><path fill="var(--userLogoColor, #FBBC05)" fill-rule="nonzero" d="M110.73 21.65a8.28 8.28 0 0 1-8.41 8.38 8.28 8.28 0 0 1-8.4-8.38 8.26 8.26 0 0 1 8.4-8.38c4.63 0 8.4 3.52 8.4 8.38zm-3.68 0c0-3.02-2.2-5.08-4.73-5.08-2.54 0-4.73 2.06-4.73 5.08 0 2.98 2.2 5.07 4.73 5.07 2.54 0 4.73-2.1 4.73-5.07z"></path><path fill="var(--userLogoColor, #4285F4)" fill-rule="nonzero" d="M128.1 13.77v15.05c0 6.18-3.65 8.71-7.96 8.71a7.98 7.98 0 0 1-7.43-4.94l3.2-1.33a4.63 4.63 0 0 0 4.23 2.97c2.76 0 4.47-1.7 4.47-4.9v-1.21h-.13a5.7 5.7 0 0 1-4.41 1.9c-4.2 0-8.03-3.65-8.03-8.34 0-4.73 3.84-8.41 8.03-8.41 2 0 3.58.88 4.41 1.87h.13v-1.36h3.5zm-3.23 7.9c0-2.94-1.97-5.1-4.47-5.1-2.54 0-4.67 2.16-4.67 5.1 0 2.93 2.13 5.05 4.67 5.05 2.5 0 4.47-2.12 4.47-5.04z"></path><path fill="var(--userLogoColor, #34A853)" fill-rule="nonzero" d="M133.86 4.96V29.5h-3.59V4.96z"></path><path fill="var(--userLogoColor, #EA4335)" fill-rule="nonzero" d="M147.85 24.4l2.86 1.9a8.34 8.34 0 0 1-6.99 3.72 8.2 8.2 0 0 1-8.31-8.38c0-4.98 3.58-8.38 7.9-8.38 4.35 0 6.48 3.46 7.17 5.33l.38.96-11.2 4.63a4.26 4.26 0 0 0 4.06 2.54c1.88 0 3.18-.92 4.13-2.32zm-8.8-3.01l7.5-3.11c-.42-1.05-1.65-1.78-3.11-1.78a4.6 4.6 0 0 0-4.38 4.89z"></path><path fill="var(--userLogoColor, #4285F4)" fill-rule="nonzero" d="M62.2 19.47V15.9h11.98c.11.62.17 1.35.17 2.15 0 2.66-.73 5.96-3.08 8.31-2.28 2.38-5.2 3.65-9.07 3.65-7.17 0-13.2-5.84-13.2-13C49 9.83 55.03 4 62.2 4c3.97 0 6.8 1.56 8.92 3.59l-2.51 2.5a9.06 9.06 0 0 0-6.41-2.54 9.33 9.33 0 0 0-9.34 9.46c0 5.24 4.1 9.46 9.34 9.46a8.7 8.7 0 0 0 6.57-2.6c1-1.01 1.66-2.45 1.92-4.4h-8.5z"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="40" viewBox="0 0 200 40" class="w-36 lg:w-48"><title>Lyft logo</title><g fill="none" fill-rule="evenodd"><path fill="var(--userLogoColor, #FF00BF)" fill-rule="nonzero" d="M75.18 3.6h7.71v20.74c0 3.3 1.49 5.25 2.7 6.07-1.26 1.1-5.08 2.08-7.95-.28-1.7-1.39-2.46-3.7-2.46-5.86V3.59zm48.15 17.25v-2.19h2.36v-7.64h-2.59A10.18 10.18 0 0 0 103 13.21v17.82a6.4 6.4 0 0 0 5.12-1.39c1.7-1.39 2.46-3.7 2.46-5.86v-.67h3.85v-7.64h-3.85v-2.31a2.59 2.59 0 1 1 5.18 0v7.66a10.2 10.2 0 0 0 10.17 10.2v-7.6a2.58 2.58 0 0 1-2.59-2.57zM94.17 11v11.23c0 .65-.54 1.16-1.18 1.16-.64 0-1.18-.51-1.18-1.16V11h-7.6v13.19c0 2.36.78 5.37 4.45 6.35 3.66.98 5.77-1.05 5.77-1.05-.2 1.33-1.44 2.31-3.46 2.52a10.5 10.5 0 0 1-4.46-.78v7c2.48.74 5.1.98 7.69.46 4.66-.9 7.6-4.8 7.6-10.03V10.95h-7.63V11z"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="40" viewBox="0 0 200 40" class="w-36 lg:w-48"><title>Zoom logo</title><g fill="none" fill-rule="evenodd"><path fill="var(--userLogoColor, #2D8CFF)" d="M71 10l1 .05A3.02 3.02 0 0 1 74.95 13l.05 1-12 12h9l1 .05c1.65.1 2.83 1.3 2.95 2.95l.05 1H61l-1-.05A3.06 3.06 0 0 1 57.05 27L57 26l12-12h-9l-1-.05A3.11 3.11 0 0 1 56.05 11L56 10h15zm66 0a8 8 0 0 1 8 8v12l-1-.05a3.06 3.06 0 0 1-2.95-2.95l-.05-1v-7l-.05-1a4.15 4.15 0 0 0-.47-2 4.02 4.02 0 0 0-6.93-.03c-.35.6-.45 1.28-.5 2.03l-.05 1v11l-1-.05a3.08 3.08 0 0 1-2.95-2.95l-.05-1v-7l-.05-1a4.39 4.39 0 0 0-.5-2 3.98 3.98 0 0 0-6.9 0 4.3 4.3 0 0 0-.5 2l-.05 1v7l-.05 1a3.02 3.02 0 0 1-2.95 2.95l-1 .05V10c1 0 2.75.5 3.53 1.38A8 8 0 0 1 131 12.7a8 8 0 0 1 6-2.7zm-52 0h.32a10.02 10.02 0 0 1 6.75 17.07 10.02 10.02 0 0 1-14.14 0A10.02 10.02 0 0 1 85 10zm21 0a10.02 10.02 0 0 1 7.08 17.07 10.02 10.02 0 0 1-14.16 0A10.02 10.02 0 0 1 106 10zm-16.75 5.78a5.98 5.98 0 0 0-8.47 0 5.98 5.98 0 0 0 0 8.47 5.98 5.98 0 0 0 8.47 0 6.02 6.02 0 0 0 0-8.47zm21 0a5.98 5.98 0 0 0-8.47 0 5.98 5.98 0 0 0 0 8.47 5.98 5.98 0 0 0 8.47 0 6.02 6.02 0 0 0 0-8.47z"></path></g></svg>
</section>
</main>
</div>
<canvas class="absolute h-[540px] md:h-[620px] w-screen bottom-0 -top-64 rotate-0 min-w-[1000px] -skew-y-12 bg-gradient-to-r from-purple-400 via-yellow-300 to-blue-500 opacity-30 z-[-9]"></canvas>
<canvas class="absolute h-[540px] md:h-[620px] w-screen bottom-0 -top-64 rotate-0 min-w-[1000px] -skew-y-12 bg-gradient-to-r from-purple-400 via-pink-500 to-blue-500 opacity-90 z-[-11]"></canvas>
<div class="container mx-auto max-w-6xl absolute grid grid-flow-col grid-cols-2 lg:grid-cols-4 min-h-screen w-screen inset-0 z-[-12]">
<div class="sm:border-l border-r border-dashed border-gray-800 border-opacity-10"></div>
<div class="sm:border-r border-dashed border-gray-800 border-opacity-10"></div>
<div class="sm:border-r border-dashed border-gray-800 border-opacity-10"></div>
<div class="sm:border-r border-dashed border-gray-800 border-opacity-10"></div>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment