755 lines
41 KiB
HTML
755 lines
41 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="scroll-smooth">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>EzSepa Bank Payment for Shopify | SEPA QR payments & analytics</title>
|
|
<meta name="description"
|
|
content="Generate SEPA EPC QR codes and let customers pay by bank transfer directly from the thank-you page — simple, secure, analytics-ready.">
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:url" content="https://ezsepa.com/">
|
|
<meta property="og:title" content="EzSepa Bank Payment for Shopify | SEPA QR payments & analytics">
|
|
<meta property="og:description"
|
|
content="Generate SEPA EPC QR codes and let customers pay by bank transfer directly from the thank-you page — simple, secure, analytics-ready.">
|
|
<meta property="og:image" content="/assets/hero.png">
|
|
|
|
<!-- Twitter -->
|
|
<meta property="twitter:card" content="summary_large_image">
|
|
<meta property="twitter:url" content="https://ezsepa.com/">
|
|
<meta property="twitter:title" content="EzSepa Bank Payment for Shopify | SEPA QR payments & analytics">
|
|
<meta property="twitter:description"
|
|
content="Generate SEPA EPC QR codes and let customers pay by bank transfer directly from the thank-you page — simple, secure, analytics-ready.">
|
|
<meta property="twitter:image" content="/assets/hero.png">
|
|
|
|
<!-- Favicon -->
|
|
<link rel="icon" type="image/svg+xml" href="/assets/favicon.svg">
|
|
|
|
<!-- JSON-LD Structured Data -->
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "SoftwareApplication",
|
|
"name": "EzSepa Bank Payment",
|
|
"applicationCategory": "BusinessApplication",
|
|
"operatingSystem": "Web",
|
|
"offers": {
|
|
"@type": "AggregateOffer",
|
|
"priceCurrency": "EUR",
|
|
"lowPrice": "0",
|
|
"highPrice": "149"
|
|
},
|
|
"description": "Generate SEPA EPC QR codes and let customers pay by bank transfer directly from the thank-you page",
|
|
"creator": {
|
|
"@type": "Organization",
|
|
"name": "EzSepa"
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<link rel="stylesheet" href="/styles.css">
|
|
</head>
|
|
|
|
<body class="antialiased text-gray-800">
|
|
|
|
<!-- Navigation -->
|
|
<nav class="fixed top-0 left-0 right-0 bg-white/95 backdrop-blur-sm shadow-sm z-50">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="flex justify-between items-center h-16">
|
|
<!-- Logo -->
|
|
<div class="flex items-center">
|
|
<svg class="w-8 h-8 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M12 4v1m6 11h2m-6 0h-2v4m0-11v3m0 0h.01M12 12h4.01M16 20h4M4 12h4m12 0h.01M5 8h2a1 1 0 001-1V5a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1zm12 0h2a1 1 0 001-1V5a1 1 0 00-1-1h-2a1 1 0 00-1 1v2a1 1 0 001 1zM5 20h2a1 1 0 001-1v-2a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1z">
|
|
</path>
|
|
</svg>
|
|
<span class="ml-2 text-xl font-bold text-brand-navy">Ez<span class="text-primary">Sepa</span></span>
|
|
</div>
|
|
|
|
<!-- Desktop Navigation -->
|
|
<div class="hidden md:flex items-center space-x-8">
|
|
<a href="#features" class="text-gray-600 hover:text-primary transition-colors">Features</a>
|
|
<a href="#how-it-works" class="text-gray-600 hover:text-primary transition-colors">How it works</a>
|
|
<a href="#pricing" class="text-gray-600 hover:text-primary transition-colors">Pricing</a>
|
|
<a href="#faq" class="text-gray-600 hover:text-primary transition-colors">FAQ</a>
|
|
<a href="/docs" class="text-gray-600 hover:text-primary transition-colors">Docs</a>
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="inline-flex items-center px-5 py-2.5 bg-primary text-white rounded-lg hover:bg-brand-orange-dark transition-colors font-medium shadow-sm hover:shadow-md">
|
|
Install on Shopify
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Mobile menu button -->
|
|
<button id="mobile-menu-button"
|
|
class="md:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-600 hover:text-primary hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-primary"
|
|
aria-expanded="false" aria-label="Toggle navigation menu">
|
|
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path class="menu-open" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M4 6h16M4 12h16M4 18h16"></path>
|
|
<path class="menu-close hidden" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M6 18L18 6M6 6l12 12"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mobile menu -->
|
|
<div id="mobile-menu" class="hidden md:hidden border-t border-gray-100">
|
|
<div class="px-2 pt-2 pb-3 space-y-1">
|
|
<a href="#features"
|
|
class="block px-3 py-2 rounded-md text-gray-600 hover:text-primary hover:bg-gray-50 transition-colors">Features</a>
|
|
<a href="#how-it-works"
|
|
class="block px-3 py-2 rounded-md text-gray-600 hover:text-primary hover:bg-gray-50 transition-colors">How
|
|
it works</a>
|
|
<a href="#pricing"
|
|
class="block px-3 py-2 rounded-md text-gray-600 hover:text-primary hover:bg-gray-50 transition-colors">Pricing</a>
|
|
<a href="#faq"
|
|
class="block px-3 py-2 rounded-md text-gray-600 hover:text-primary hover:bg-gray-50 transition-colors">FAQ</a>
|
|
<a href="/docs"
|
|
class="block px-3 py-2 rounded-md text-gray-600 hover:text-primary hover:bg-gray-50 transition-colors">Docs</a>
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="block mx-3 my-2 px-5 py-2.5 bg-primary text-white rounded-lg hover:bg-brand-orange-dark transition-colors font-medium text-center">
|
|
Install on Shopify
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Hero Section -->
|
|
<section class="pt-24 pb-12 md:pt-32 md:pb-20 bg-gradient-to-br from-orange-50 via-blue-50 to-white">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="grid md:grid-cols-2 gap-12 items-center">
|
|
<!-- Left Column: Text Content -->
|
|
<div class="animate-fade-in-up">
|
|
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-brand-navy leading-tight mb-6">
|
|
Quick, Easy, <span class="text-primary">Secure.</span>
|
|
<span class="block text-3xl md:text-4xl lg:text-5xl mt-2 text-primary">Bank Transfers</span>
|
|
</h1>
|
|
<p class="text-xl text-gray-600 mb-8 leading-relaxed">
|
|
Generate SEPA EPC QR codes and let customers pay by bank transfer directly from the thank-you page — simple,
|
|
secure, analytics-ready.
|
|
</p>
|
|
|
|
<div class="flex flex-col sm:flex-row gap-4 mb-8">
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="inline-flex items-center justify-center px-8 py-4 bg-primary text-white text-lg font-semibold rounded-lg hover:bg-brand-orange-dark transition-all shadow-lg hover:shadow-xl transform hover:-translate-y-0.5">
|
|
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
|
|
<path fill-rule="evenodd"
|
|
d="M3 17a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM6.293 6.707a1 1 0 010-1.414l3-3a1 1 0 011.414 0l3 3a1 1 0 01-1.414 1.414L11 5.414V13a1 1 0 11-2 0V5.414L7.707 6.707a1 1 0 01-1.414 0z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
Install on Shopify
|
|
</a>
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="inline-flex items-center justify-center px-8 py-4 bg-white text-secondary text-lg font-semibold rounded-lg border-2 border-secondary hover:bg-blue-50 transition-colors">
|
|
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z">
|
|
</path>
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
</svg>
|
|
See it in action
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Trust Badges -->
|
|
<div class="flex flex-wrap items-center gap-6 text-sm text-gray-500">
|
|
<div class="flex items-center">
|
|
<svg class="w-5 h-5 text-success mr-2" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
GDPR Compliant
|
|
</div>
|
|
<div class="flex items-center">
|
|
<svg class="w-5 h-5 text-success mr-2" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
SEPA Standard
|
|
</div>
|
|
<div class="flex items-center">
|
|
<svg class="w-5 h-5 text-success mr-2" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
5 Languages
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Right Column: 3D Scene -->
|
|
<div class="relative w-full h-[400px] md:h-[500px] pt-26">
|
|
<!-- 3D Canvas Container -->
|
|
<!-- <div id="hero-3d-container" class="w-full h-full rounded-xl overflow-hidden"></div> -->
|
|
<img src="assets/hero-2.png" alt="" class="border-2 rounded-xl">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Features Section -->
|
|
<section id="features" class="py-20 bg-white">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">Powerful Features for Modern Merchants</h2>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto">Everything you need to accept SEPA bank payments on Shopify,
|
|
with analytics and automation built-in.</p>
|
|
</div>
|
|
|
|
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
|
<!-- Feature 1: QR Code Generation -->
|
|
<div
|
|
class="bg-gradient-to-br from-orange-50 to-white p-8 rounded-xl hover:shadow-lg transition-shadow border border-brand-100">
|
|
<div class="w-14 h-14 bg-primary rounded-lg flex items-center justify-center mb-5">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M12 4v1m6 11h2m-6 0h-2v4m0-11v3m0 0h.01M12 12h4.01M16 20h4M4 12h4m12 0h.01M5 8h2a1 1 0 001-1V5a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1zm12 0h2a1 1 0 001-1V5a1 1 0 00-1-1h-2a1 1 0 00-1 1v2a1 1 0 001 1zM5 20h2a1 1 0 001-1v-2a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1z">
|
|
</path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Styled EPC/SEPA QR Codes</h3>
|
|
<p class="text-gray-600">Server-side generated, styled SVG QR codes embedded directly into Shopify checkout
|
|
thank-you and order status pages.</p>
|
|
</div>
|
|
|
|
<!-- Feature 2: Analytics -->
|
|
<div
|
|
class="bg-gradient-to-br from-blue-50 to-white p-8 rounded-xl hover:shadow-lg transition-shadow border border-blue-100">
|
|
<div class="w-14 h-14 bg-secondary rounded-lg flex items-center justify-center mb-5">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z">
|
|
</path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Real-Time Analytics Dashboard</h3>
|
|
<p class="text-gray-600">Track QR code generations and customer scans with built-in analytics. Monitor usage
|
|
across all your orders in one place.</p>
|
|
</div>
|
|
|
|
<!-- Feature 3: Auto Order Lookup -->
|
|
<div
|
|
class="bg-gradient-to-br from-orange-50 to-white p-8 rounded-xl hover:shadow-lg transition-shadow border border-orange-100">
|
|
<div class="w-14 h-14 bg-primary rounded-lg flex items-center justify-center mb-5">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Automatic Order Lookup</h3>
|
|
<p class="text-gray-600">Server automatically fetches order details from Shopify via GraphQL API by order
|
|
number or GID. No manual data entry needed.</p>
|
|
</div>
|
|
|
|
<!-- Feature 4: Usage Limits -->
|
|
<div
|
|
class="bg-gradient-to-br from-blue-50 to-white p-8 rounded-xl hover:shadow-lg transition-shadow border border-blue-100">
|
|
<div class="w-14 h-14 bg-secondary rounded-lg flex items-center justify-center mb-5">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z">
|
|
</path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Plan-Based Usage Limits</h3>
|
|
<p class="text-gray-600">Visual warnings at 80% usage and automatic enforcement at 100%. Transparent limits:
|
|
Free (5), Starter (50), Premium (150), Enterprise (Unlimited).</p>
|
|
</div>
|
|
|
|
<!-- Feature 5: Multi-language -->
|
|
<div
|
|
class="bg-gradient-to-br from-orange-50 to-white p-8 rounded-xl hover:shadow-lg transition-shadow border border-orange-100">
|
|
<div class="w-14 h-14 bg-primary rounded-lg flex items-center justify-center mb-5">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129">
|
|
</path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Multi-Language Support</h3>
|
|
<p class="text-gray-600">Built-in internationalization for English, French, German, Spanish, and Italian.
|
|
Perfect for EU merchants across all markets.</p>
|
|
</div>
|
|
|
|
<!-- Feature 6: Checkout Extension -->
|
|
<div
|
|
class="bg-gradient-to-br from-blue-50 to-white p-8 rounded-xl hover:shadow-lg transition-shadow border border-blue-100">
|
|
<div class="w-14 h-14 bg-secondary rounded-lg flex items-center justify-center mb-5">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-3">Native Checkout Integration</h3>
|
|
<p class="text-gray-600">Seamless Shopify UI Extensions integration on thank-you and order status pages. Works
|
|
natively with Shopify's checkout experience.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- How It Works Section -->
|
|
<section id="how-it-works" class="py-20 bg-gradient-to-br from-gray-50 to-white">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">How It Works</h2>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto">Get started with SEPA bank payments in three simple steps</p>
|
|
</div>
|
|
|
|
<div class="grid md:grid-cols-3 gap-8 lg:gap-12">
|
|
<!-- Step 1 -->
|
|
<div class="relative">
|
|
<div class="flex flex-col items-center text-center">
|
|
<div
|
|
class="w-20 h-20 bg-primary rounded-full flex items-center justify-center text-white text-3xl font-bold mb-6 shadow-lg">
|
|
1
|
|
</div>
|
|
<h3 class="text-2xl font-semibold text-gray-900 mb-4">Install the App</h3>
|
|
<p class="text-gray-600 leading-relaxed">
|
|
Click "Install on Shopify" and authorize the app in your store. Takes less than 60 seconds to get started.
|
|
</p>
|
|
</div>
|
|
<!-- Connector Arrow (hidden on mobile) -->
|
|
<svg class="hidden md:block absolute top-10 left-full w-12 h-12 text-brand-200 -ml-6" fill="none"
|
|
stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"></path>
|
|
</svg>
|
|
</div>
|
|
|
|
<!-- Step 2 -->
|
|
<div class="relative">
|
|
<div class="flex flex-col items-center text-center">
|
|
<div
|
|
class="w-20 h-20 bg-primary rounded-full flex items-center justify-center text-white text-3xl font-bold mb-6 shadow-lg">
|
|
2
|
|
</div>
|
|
<h3 class="text-2xl font-semibold text-gray-900 mb-4">Configure Your IBAN</h3>
|
|
<p class="text-gray-600 leading-relaxed">
|
|
Enter your SEPA IBAN details, business name, and payment reference format in the app settings dashboard.
|
|
</p>
|
|
</div>
|
|
<!-- Connector Arrow (hidden on mobile) -->
|
|
<svg class="hidden md:block absolute top-10 left-full w-12 h-12 text-brand-200 -ml-6" fill="none"
|
|
stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"></path>
|
|
</svg>
|
|
</div>
|
|
|
|
<!-- Step 3 -->
|
|
<div class="relative">
|
|
<div class="flex flex-col items-center text-center">
|
|
<div
|
|
class="w-20 h-20 bg-primary rounded-full flex items-center justify-center text-white text-3xl font-bold mb-6 shadow-lg">
|
|
3
|
|
</div>
|
|
<h3 class="text-2xl font-semibold text-gray-900 mb-4">QR Appears at Checkout</h3>
|
|
<p class="text-gray-600 leading-relaxed">
|
|
Customers see the SEPA QR code on the thank-you page. They scan, pay, and you track everything in the
|
|
analytics dashboard.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Screenshot Showcase -->
|
|
<!-- <div class="mt-16">
|
|
<div class="bg-white rounded-2xl shadow-xl p-8 border border-gray-100">
|
|
<img src="/assets/checkout.png" alt="Checkout extension showing SEPA QR code on thank you page"
|
|
class="rounded-lg w-full" loading="lazy">
|
|
</div>
|
|
</div> -->
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Pricing Section -->
|
|
<section id="pricing" class="py-20 bg-white">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">Simple, Transparent Pricing</h2>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto">Choose the plan that fits your business needs. Upgrade or
|
|
downgrade anytime.</p>
|
|
</div>
|
|
|
|
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
|
|
<!-- Free Plan -->
|
|
<div class="bg-white border-2 border-gray-200 rounded-xl p-8 hover:border-secondary transition-colors">
|
|
<h3 class="text-2xl font-bold text-gray-900 mb-2">Free</h3>
|
|
<div class="mb-6">
|
|
<span class="text-4xl font-bold text-gray-900">€0</span>
|
|
<span class="text-gray-600">/month</span>
|
|
</div>
|
|
<ul class="space-y-4 mb-8">
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600"><strong>5 QR codes</strong> per month</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">Basic analytics</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">5 languages</span>
|
|
</li>
|
|
</ul>
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="block w-full text-center px-6 py-3 bg-gray-100 text-gray-900 rounded-lg hover:bg-gray-200 transition-colors font-medium">
|
|
Get Started
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Starter Plan -->
|
|
<div class="bg-white border-2 border-gray-200 rounded-xl p-8 hover:border-secondary transition-colors">
|
|
<h3 class="text-2xl font-bold text-gray-900 mb-2">Starter</h3>
|
|
<div class="mb-6">
|
|
<span class="text-4xl font-bold text-gray-900">€9.90</span>
|
|
<span class="text-gray-600">/month</span>
|
|
</div>
|
|
<ul class="space-y-4 mb-8">
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600"><strong>50 QR codes</strong> per month</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">Customizable QRCode</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">Predefined templates</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">Realtime analytics</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">In-app support</span>
|
|
</li>
|
|
</ul>
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="block w-full text-center px-6 py-3 bg-gray-100 text-gray-900 rounded-lg hover:bg-gray-200 transition-colors font-medium">
|
|
Choose Starter
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Premium Plan (Popular) -->
|
|
<div
|
|
class="bg-gradient-to-br from-primary via-brand-orange-dark to-secondary border-2 border-primary rounded-xl p-8 relative shadow-xl transform lg:-translate-y-2 text-white">
|
|
<div class="absolute top-0 right-6 transform -translate-y-1/2">
|
|
<span class="bg-secondary text-white px-4 py-1 rounded-full text-sm font-semibold">Popular</span>
|
|
</div>
|
|
<h3 class="text-2xl font-bold text-white mb-2">Grow</h3>
|
|
<div class="mb-6">
|
|
<span class="text-4xl font-bold text-white">€19.90</span>
|
|
<span class="text-orange-100">/month</span>
|
|
</div>
|
|
<ul class="space-y-4 mb-8">
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class=""><strong>150 QR codes</strong> per month</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="">Customizable QRCode</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="">Predefined templates</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="">Realtime analytics</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="">In-app support</span>
|
|
</li>
|
|
</ul>
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="block w-full text-center px-6 py-3 bg-white text-primary rounded-lg hover:bg-orange-50 transition-colors font-medium shadow-md">
|
|
Choose Grow
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Enterprise Plan -->
|
|
<div class="bg-white border-2 border-gray-200 rounded-xl p-8 hover:border-secondary transition-colors">
|
|
<h3 class="text-2xl font-bold text-gray-900 mb-2">Enterprise</h3>
|
|
<div class="mb-6">
|
|
<span class="text-4xl font-bold text-gray-900">Custom</span>
|
|
</div>
|
|
<ul class="space-y-4 mb-8">
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600"><strong>Unlimited</strong> QR codes</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">Custom integrations</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<svg class="w-6 h-6 text-success mr-3 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-600">Dedicated support</span>
|
|
</li>
|
|
</ul>
|
|
<a href="mailto:contact@ezsepa.com"
|
|
class="block w-full text-center px-6 py-3 bg-gray-100 text-gray-900 rounded-lg hover:bg-gray-200 transition-colors font-medium">
|
|
Contact Sales
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Pricing Note -->
|
|
<div class="mt-12 text-center">
|
|
<p class="text-gray-600">All plans include visual warnings at 80% usage and automatic enforcement at 100% limit.
|
|
</p>
|
|
<p class="text-gray-600 mt-2">GDPR compliant • SEPA standard • Multi-language support included</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FAQ Section -->
|
|
<section id="faq" class="py-20 bg-gradient-to-br from-gray-50 to-white">
|
|
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-3xl md:text-4xl font-bold text-gray-900 mb-4">Frequently Asked Questions</h2>
|
|
<p class="text-xl text-gray-600">Everything you need to know about EzSepa Bank Payment</p>
|
|
</div>
|
|
|
|
<div class="space-y-6">
|
|
<!-- FAQ 1 -->
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-3">How is my data handled?</h3>
|
|
<p class="text-gray-600">
|
|
We follow strict GDPR compliance. Session data is stored in PostgreSQL, and we implement all required
|
|
Shopify webhooks (APP_UNINSTALLED, CUSTOMERS_DATA_REQUEST, CUSTOMERS_REDACT, SHOP_REDACT). Your IBAN details
|
|
are encrypted at rest and in transit. We never store customer payment credentials—only order metadata for
|
|
analytics.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- FAQ 2 -->
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-3">What happens when I hit my plan limit?</h3>
|
|
<p class="text-gray-600">
|
|
You'll receive a visual warning at 80% of your monthly limit. At 100%, new QR codes won't generate until the
|
|
next billing cycle or you upgrade your plan. Existing QR codes remain functional. You can upgrade at any
|
|
time to unlock more capacity immediately.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- FAQ 3 -->
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-3">How do refunds work with bank transfers?</h3>
|
|
<p class="text-gray-600">
|
|
SEPA bank transfers are one-way payments. If you need to refund a customer, you'll need to process a
|
|
separate bank transfer back to them. The app tracks which orders had QR codes generated, making it easy to
|
|
identify bank transfer payments in your analytics dashboard.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- FAQ 4 -->
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-3">Can I customize the QR code appearance?</h3>
|
|
<p class="text-gray-600">
|
|
QR codes are generated as styled SVGs server-side following EPC/SEPA standards. While the QR structure
|
|
itself must remain standard-compliant for bank apps to scan correctly, you can customize the surrounding UI
|
|
elements through your Shopify theme customization.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- FAQ 5 -->
|
|
<div class="bg-white rounded-xl p-6 shadow-sm border border-gray-100">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-3">What if I need help or have technical issues?</h3>
|
|
<p class="text-gray-600">
|
|
Free plan users can access community support. Paid plans include email support
|
|
(Starter/Premium) or dedicated support (Enterprise). Check our <a href="/docs"
|
|
class="text-primary hover:text-brand-orange-dark underline">documentation</a> for detailed setup guides,
|
|
troubleshooting tips, and API
|
|
references.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA Section -->
|
|
<section class="py-20 bg-gradient-to-r from-primary to-secondary">
|
|
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
<h2 class="text-3xl md:text-4xl font-bold text-white mb-6">
|
|
Ready to Accept SEPA Bank Payments?
|
|
</h2>
|
|
<p class="text-xl text-orange-100 mb-10 max-w-2xl mx-auto">
|
|
Install EzSepa Bank Payment today and start offering customers a seamless bank transfer payment option at
|
|
checkout.
|
|
</p>
|
|
<div class="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="inline-flex items-center justify-center px-8 py-4 bg-white text-primary text-lg font-semibold rounded-lg hover:bg-orange-50 transition-all shadow-lg hover:shadow-xl transform hover:-translate-y-0.5">
|
|
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
|
|
<path fill-rule="evenodd"
|
|
d="M3 17a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM6.293 6.707a1 1 0 010-1.414l3-3a1 1 0 011.414 0l3 3a1 1 0 01-1.414 1.414L11 5.414V13a1 1 0 11-2 0V5.414L7.707 6.707a1 1 0 01-1.414 0z"
|
|
clip-rule="evenodd"></path>
|
|
</svg>
|
|
Install on Shopify
|
|
</a>
|
|
<a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="inline-flex items-center justify-center px-8 py-4 bg-brand-navy text-white text-lg font-semibold rounded-lg border-2 border-white hover:bg-brand-navy-dark transition-colors">
|
|
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z">
|
|
</path>
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
</svg>
|
|
Watch Demo
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer class="bg-brand-navy text-gray-300 py-12">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="grid md:grid-cols-4 gap-8 mb-8">
|
|
<!-- Company -->
|
|
<div>
|
|
<div class="flex items-center mb-4">
|
|
<svg class="w-8 h-8 text-primary" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M12 4v1m6 11h2m-6 0h-2v4m0-11v3m0 0h.01M12 12h4.01M16 20h4M4 12h4m12 0h.01M5 8h2a1 1 0 001-1V5a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1zm12 0h2a1 1 0 001-1V5a1 1 0 00-1-1h-2a1 1 0 00-1 1v2a1 1 0 001 1zM5 20h2a1 1 0 001-1v-2a1 1 0 00-1-1H5a1 1 0 00-1 1v2a1 1 0 001 1z">
|
|
</path>
|
|
</svg>
|
|
<span class="ml-2 text-xl font-bold text-white">Ez<span class="text-primary">Sepa</span></span>
|
|
</div>
|
|
<p class="text-sm text-gray-400">
|
|
SEPA bank payment solution for Shopify merchants across Europe.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Product -->
|
|
<div>
|
|
<h4 class="text-white font-semibold mb-4">Product</h4>
|
|
<ul class="space-y-2 text-sm">
|
|
<li><a href="#features" class="hover:text-primary transition-colors">Features</a></li>
|
|
<li><a href="#pricing" class="hover:text-primary transition-colors">Pricing</a></li>
|
|
<li><a href="#faq" class="hover:text-primary transition-colors">FAQ</a></li>
|
|
<li><a href="https://apps.shopify.com/auto-bank-payment"
|
|
class="hover:text-primary transition-colors">Demo</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Resources -->
|
|
<div>
|
|
<h4 class="text-white font-semibold mb-4">Resources</h4>
|
|
<ul class="space-y-2 text-sm">
|
|
<li><a href="/docs" class="hover:text-primary transition-colors">Documentation</a></li>
|
|
<li><a href="/support" class="hover:text-primary transition-colors">Support</a></li>
|
|
<li><a href="/api" class="hover:text-primary transition-colors">API Reference</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Legal -->
|
|
<div>
|
|
<h4 class="text-white font-semibold mb-4">Legal</h4>
|
|
<ul class="space-y-2 text-sm">
|
|
<li><a href="/privacy" class="hover:text-primary transition-colors">Privacy Policy</a></li>
|
|
<li><a href="/terms" class="hover:text-primary transition-colors">Terms of Service</a></li>
|
|
<li><a href="/gdpr" class="hover:text-primary transition-colors">GDPR Compliance</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="border-t border-gray-800 pt-8 flex flex-col md:flex-row justify-between items-center">
|
|
<p class="text-sm text-gray-400">
|
|
© 2025 EzSepa Bank Payment. All rights reserved.
|
|
</p>
|
|
<div class="flex space-x-6 mt-4 md:mt-0">
|
|
<a href="https://twitter.com/ezsepa" class="text-gray-400 hover:text-primary transition-colors"
|
|
target="_blank" rel="noopener noreferrer" aria-label="Twitter">
|
|
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
|
|
<path
|
|
d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84">
|
|
</path>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script type="module" src="/main.js"></script>
|
|
</body>
|
|
|
|
</html> |