PageSourceSearch

https://overphish.app/

html overphish.app collected 2026-10-02 01:14:22 UTC 93,044 bytes, 1,287 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en" class="scroll-smooth font-sans">
3
4<head>
5    <!-- Preload critical resources -->
6    <link rel="preload" href="/public/Inter/Inter-VariableFont_opsz,wght.ttf" as="font" type="font/ttf" crossorigin>
7    <link rel="preload" href="/public/output.css" as="style">
8
9    <meta charset="UTF-8">
10    <meta name="viewport" content="width=device-width, initial-scale=1.0">
11    <meta http-equiv="X-UA-Compatible" content="IE=edge">
12    <meta name="referrer" content="strict-origin-when-cross-origin">
13
14    <title>OverPhish — Free Phishing Domain Blocker &amp; Malware Protection</title>
15    <meta name="description"
16        content="OverPhish is a free, open-source, privacy-first browser extension that blocks phishing and malware sites in real time using community-driven blocklists. Zero telemetry, fully auditable, works on Chrome, Edge, Firefox, Brave &amp; more.">
17    <meta name="keywords"
18        content="phishing blocker, anti-phishing extension, malware protection, browser extension, privacy-first security, community blocklist, zero telemetry, auditable open source, chrome extension, firefox addon">
19    <meta name="theme-color" content="#0ea5e9">
20    <meta name="robots" content="index, follow, max-image-preview:large">
21
22    <!-- Open Graph / Social -->
23    <meta property="og:title" content="OverPhish — Free Phishing Domain Blocker &amp; Malware Protection">
24    <meta property="og:description"
25        content="Free, open-source browser extension with real-time phishing &amp; malware protection. Daily-updated community blocklists. 100% local, no telemetry, no tracking.">
26    <meta property="og:type" content="website">
27    <meta property="og:url" content="https://overphish.app/">
28    <meta property="og:image" content="https://overphish.app/og-image.png">
29    <meta property="og:image:width" content="1200">
30    <meta property="og:image:height" content="630">
31    <meta property="og:site_name" content="OverPhish">
32
33    <!-- Twitter -->
34    <meta name="twitter:card" content="summary_large_image">
35    <meta name="twitter:title" content="OverPhish — Free Phishing Domain Blocker &amp; Malware Protection">
36    <meta name="twitter:description"
37        content="Free, open-source browser extension with real-time phishing &amp; malware protection. Daily-updated community blocklists. 100% local, no telemetry.">
38    <meta name="twitter:image" content="https://overphish.app/og-image.png">
39
40    <link rel="canonical" href="https://overphish.app/">
41    <link rel="icon" href="/favicon.ico" type="image/x-icon">
42    <link rel="apple-touch-icon" href="/apple-touch-icon.png">
43
44    <link rel="stylesheet" href="/public/output.css">
45
46    <!-- Structured Data: SoftwareApplication (enhanced) -->
47    
47<script type="application/ld+json">
48    {
49        "@context": "https://schema.org",
50        "@type": "SoftwareApplication",
51        "@id": "https://overphish.app/#overphish",
52        "url": "https://overphish.app/",
53        "name": "OverPhish",
54        "description": "Free, open-source, privacy-first browser extension that blocks phishing and malware sites in real time using daily-updated community blocklists. 100% local processing — zero telemetry, fully auditable.",
55        "applicationCategory": "SecurityApplication",
56        "operatingSystem": "Chrome, Microsoft Edge, Mozilla Firefox, Brave, and other Chromium-based and Firefox-based browsers",
57        "softwareVersion": "1.1.0",
58        "datePublished": "2025-12-09",
59        "image": "https://overphish.app/logo.png",
60        "screenshot": "https://overphish.app/og-image.png",
61        "keywords": ["phishing blocker", "anti-phishing extension", "malware protection", "privacy browser extension", "auditable security tool", "zero telemetry", "open source"],
62        "author": {
63            "@type": "Person",
64            "name": "Kevin Gillispie",
65            "email": "[email protected]",
66            "url": "https://overphish.app/"
67        },
68        "offers": [
69            {
70                "@type": "Offer",
71                "price": "0",
72                "priceCurrency": "USD",
73                "url": "https://chromewebstore.google.com/detail/overphish/mapbfceckmkfnmecoadhfehmdpoomjoa",
74                "seller": {
75                    "@type": "Organization",
76                    "name": "Chrome Web Store"
77                },
78                "availability": "https://schema.org/InStock"
79            },
80            {
81                "@type": "Offer",
82                "price": "0",
83                "priceCurrency": "USD",
84                "url": "https://microsoftedge.microsoft.com/addons/detail/overphish-phishing-domai/fmnmgpjbkbhgeaognhhlkdnjlhdlmlll",
85                "seller": {
86                    "@type": "Organization",
87                    "name": "Microsoft Edge Addons"
88                },
89                "availability": "https://schema.org/InStock"
90            },
91            {
92                "@type": "Offer",
93                "price": "0",
94                "priceCurrency": "USD",
95                "url": "https://addons.mozilla.org/en-US/firefox/addon/overphish/",
96                "seller": {
97                    "@type": "Organization",
98                    "name": "Mozilla Add-ons"
99                },
100                "availability": "https://schema.org/InStock"
101            }
102        ],
103        "installUrl": "https://overphish.app/",
104        "sameAs": [
105            "https://github.com/overphish",
106            "https://x.com/overphish"
107        ],
108        "aggregateRating": {
109            "@type": "AggregateRating",
110            "ratingValue": "4.9",
111            "reviewCount": "124"
112        }
113    }
114    </script>
114
115
116    <!-- Structured Data: FAQPage (SEO boost) -->
117    
117<script type="application/ld+json">
118    {
119        "@context": "https://schema.org",
120        "@type": "FAQPage",
121        "mainEntity": [
122            {
123                "@type": "Question",
124                "name": "When will OverPhish be released?",
125                "acceptedAnswer": {
126                    "@type": "Answer",
127                    "text": "It’s live right now! Install it directly from the Chrome Web Store, Microsoft Edge Add-ons, or Mozilla Add-ons."
128                }
129            },
130            {
131                "@type": "Question",
132                "name": "Does OverPhish protection cost anything?",
133                "acceptedAnswer": {
134                    "@type": "Answer",
135                    "text": "Nope! Core protection is free forever and fully auditable."
136                }
137            },
138            {
139                "@type": "Question",
140                "name": "Which browsers will be supported?",
141                "acceptedAnswer": {
142                    "@type": "Answer",
143                    "text": "Chrome, Firefox, Edge, Brave, and all Chromium-based and Firefox-based browsers at launch. Safari support is planned."
144                }
145            },
146            {
147                "@type": "Question",
148                "name": "Does OverPhish collect any data?",
149                "acceptedAnswer": {
150                    "@type": "Answer",
151                    "text": "Absolutely not. OverPhish runs 100% locally and never phones home except for blocklist updates."
152                }
153            }
154        ]
155    }
156    </script>
156
157
158    <style>
159        /* Skip to content link */
160        .skip-link {
161            position: absolute;
162            top: -40px;
163            left: 10px;
164            background: #0ea5e9;
165            color: #fff;
166            padding: 8px 12px;
167            z-index: 10000;
168            border-radius: 0 0 4px 4px;
169            font-weight: 700;
170            text-decoration: none;
171            box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
172        }
173
174        .skip-link:focus {
175            top: 10px;
176        }
177
178        /* Enhanced focus styles for keyboard navigation */
179        a:focus-visible,
180        button:focus-visible,
181        input:focus-visible,
182        textarea:focus-visible,
183        summary:focus-visible {
184            outline: 3px solid #0ea5e9;
185            outline-offset: 3px;
186            border-radius: 6px;
187        }
188
189        /* Accordion accessibility & animation */
190        .accordion-panel {
191            overflow: hidden;
192            transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
193        }
194
195        /* Gentle floating balloon animation */
196        @keyframes levitate {
197
198            0%,
199            100% {
200                transform: translateY(0) translateX(0) rotate(0deg);
201            }
202
203            25% {
204                transform: translateY(-3px) translateX(4px) rotate(5deg);
205            }
206
207            50% {
208                transform: translateY(-1px) translateX(-3px) rotate(-4deg);
209            }
210
211            75% {
212                transform: translateY(-2px) translateX(5px) rotate(6deg);
213            }
214        }
215
216        .made-with {
217            position: relative;
218            cursor: default;
219        }
220
221        .heart-balloon {
222            transition: fill 0.3s ease;
223            transform-origin: center bottom;
224        }
225
226        .made-with:hover .heart-balloon {
227            fill: #ef4444;
228            animation: levitate 4s ease-in-out infinite;
229        }
230
231        .made-with:hover .heart-balloon {
232            animation: levitate 4s ease-in-out infinite,
233                bounceIn 0.6s ease-out;
234        }
235
236        @keyframes bounceIn {
237            0% {
238                transform: scale(1) translateY(0);
239            }
240
241            40% {
242                transform: scale(1.1) translateY(-1px);
243            }
244
245            60% {
246                transform: scale(0.9);
247            }
248
249            100% {
250                transform: scale(1) translateY(0);
251            }
252        }
253    </style>
254</head>
255
256<body class="bg-white text-gray-800 antialiased">
257    <!-- Skip to main content -->
258    <a href="#main-content" class="skip-link font-bold px-3"><span class="text-zinc-950">Skip to main content</span></a>
259
260    <!-- Hero Header -->
261    <header
262        class="relative min-h-screen flex items-center justify-center bg-gradient-to-br from-slate-50 via-white to-sky-50 overflow-hidden"
263        aria-labelledby="hero-heading">
264        <div class="absolute inset-0 bg-grid-slate-100/50"></div>
265        <div class="relative max-w-5xl mx-auto px-6 py-24 text-center">
266            <img src="https://overphish.app/logo.png" width="200" height="200" alt="OverPhish logo"
267                class="mx-auto mb-8">
268            <h1 id="hero-heading" class="text-5xl md:text-7xl font-extrabold text-dark mb-8">
269                Stop phishing<br><span class="text-sky-500">before it stops <i>you</i>.</span>
270            </h1>
271
272            <p class="text-xl md:text-2xl text-gray-600 max-w-3xl mx-auto mb-12">
273                <strong class="font-extrabold">OverPhish</strong> is a free, auditable <span
274                    class="border-none rounded px-2 pb-1 bg-sky-100">browser extension</span> that blocks phishing sites
275                in
276                real time — no telemetry, no accounts, no nonsense.
277            </p>
278
279            <div class="flex flex-row flex-wrap justify-around gap-6">
280                <div class="flex flex-col sm:flex-row gap-6 justify-center items-center w-full sm:w-auto">
281                    <a href="https://chromewebstore.google.com/detail/overphish/mapbfceckmkfnmecoadhfehmdpoomjoa"
282                        target="_blank" rel="noopener"
283                        class="inline-flex items-center gap-3 px-8 py-5 bg-sky-500 hover:bg-sky-600 text-zinc-950 hover:text-white font-bold text-lg rounded-xl shadow-xl hover:shadow-2xl transition transform hover:-translate-y-1 w-full sm:w-auto max-w-80">
284                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
285                            viewBox="0 0 48 48" height="48" width="48">
286                            <defs>
287                                <linearGradient id="a" x1="3.2173" y1="15" x2="44.7812" y2="15"
288                                    gradientUnits="userSpaceOnUse">
289                                    <stop offset="0" stop-color="#d93025" />
290                                    <stop offset="1" stop-color="#ea4335" />
291                                </linearGradient>
292                                <linearGradient id="b" x1="20.7219" y1="47.6791" x2="41.5039" y2="11.6837"
293                                    gradientUnits="userSpaceOnUse">
294                                    <stop offset="0" stop-color="#fcc934" />
295                                    <stop offset="1" stop-color="#fbbc04" />
296                                </linearGradient>
297                                <linearGradient id="c" x1="26.5981" y1="46.5015" x2="5.8161" y2="10.506"
298                                    gradientUnits="userSpaceOnUse">
299                                    <stop offset="0" stop-color="#1e8e3e" />
300                                    <stop offset="1" stop-color="#34a853" />
301                                </linearGradient>
302                            </defs>
303                            <circle cx="24" cy="23.9947" r="12" style="fill:#fff" />
304                            <path
305                                d="M3.2154,36A24,24,0,1,0,12,3.2154,24,24,0,0,0,3.2154,36ZM34.3923,18A12,12,0,1,1,18,13.6077,12,12,0,0,1,34.3923,18Z"
306                                style="fill:none" />
307                            <path
308                                d="M24,12H44.7812a23.9939,23.9939,0,0,0-41.5639.0029L13.6079,30l.0093-.0024A11.9852,11.9852,0,0,1,24,12Z"
309                                style="fill:url(#a)" />
310                            <circle cx="24" cy="24" r="9.5" style="fill:#1a73e8" />
311                            <path
312                                d="M34.3913,30.0029,24.0007,48A23.994,23.994,0,0,0,44.78,12.0031H23.9989l-.0025.0093A11.985,11.985,0,0,1,34.3913,30.0029Z"
313                                style="fill:url(#b)" />
314                            <path
315                                d="M13.6086,30.0031,3.218,12.006A23.994,23.994,0,0,0,24.0025,48L34.3931,30.0029l-.0067-.0068a11.9852,11.9852,0,0,1-20.7778.007Z"
316                                style="fill:url(#c)" />
317                        </svg>
318                        Add to Chrome
319                    </a>
320                </div>
321                <div class="flex flex-col sm:flex-row gap-6 justify-center items-center w-full sm:w-auto">
322                    <a href="https://microsoftedge.microsoft.com/addons/detail/overphish-phishing-domai/fmnmgpjbkbhgeaognhhlkdnjlhdlmlll"
323                        target="_blank" rel="noopener"
324                        class="inline-flex items-center gap-3 px-8 py-5 bg-sky-500 hover:bg-sky-600 text-zinc-950 hover:text-white font-bold text-lg rounded-xl shadow-xl hover:shadow-2xl transition transform hover:-translate-y-1 w-full sm:w-auto max-w-80">
325                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" width="48" height="48">
326                            <defs>
327                                <radialGradient id="b" cx="161.8" cy="68.9" r="95.4"
328                                    gradientTransform="matrix(1 0 0 -.95 0 248.8)" gradientUnits="userSpaceOnUse">
329                                    <stop offset=".7" stop-opacity="0" />
330                                    <stop offset=".9" stop-opacity=".5" />
331                                    <stop offset="1" />
332                                </radialGradient>
333                                <radialGradient id="d" cx="-340.3" cy="63" r="143.2"
334                                    gradientTransform="matrix(.15 -.99 -.8 -.12 176.6 -125.4)"
335                                    gradientUnits="userSpaceOnUse">
336                                    <stop offset=".8" stop-opacity="0" />
337                                    <stop offset=".9" stop-opacity=".5" />
338                                    <stop offset="1" />
339                                </radialGradient>
340                                <radialGradient id="e" cx="113.4" cy="570.2" r="202.4"
341                                    gradientTransform="matrix(-.04 1 2.13 .08 -1179.5 -106.7)"
342                                    gradientUnits="userSpaceOnUse">
343                                    <stop offset="0" stop-color="#35c1f1" />
344                                    <stop offset=".1" stop-color="#34c1ed" />
345                                    <stop offset=".2" stop-color="#2fc2df" />
346                                    <stop offset=".3" stop-color="#2bc3d2" />
347                                    <stop offset=".7" stop-color="#36c752" />
348                                </radialGradient>
349                                <radialGradient id="f" cx="376.5" cy="568" r="97.3"
350                                    gradientTransform="matrix(.28 .96 .78 -.23 -303.8 -148.5)"
351                                    gradientUnits="userSpaceOnUse">
352                                    <stop offset="0" stop-color="#66eb6e" />
353                                    <stop offset="1" stop-color="#66eb6e" stop-opacity="0" />
354                                </radialGradient>
355                                <linearGradient id="a" x1="63.3" y1="84" x2="241.7" y2="84"
356                                    gradientTransform="matrix(1 0 0 -1 0 266)" gradientUnits="userSpaceOnUse">
357                                    <stop offset="0" stop-color="#0c59a4" />
358                                    <stop offset="1" stop-color="#114a8b" />
359                                </linearGradient>
360                                <linearGradient id="c" x1="157.3" y1="161.4" x2="46" y2="40.1"
361                                    gradientTransform="matrix(1 0 0 -1 0 266)" gradientUnits="userSpaceOnUse">
362                                    <stop offset="0" stop-color="#1b9de2" />
363                                    <stop offset=".2" stop-color="#1595df" />
364                                    <stop offset=".7" stop-color="#0680d7" />
365                                    <stop offset="1" stop-color="#0078d4" />
366                                </linearGradient>
367                            </defs>
368                            <path
369                                d="M235.7 195.5a93.7 93.7 0 0 1-10.6 4.7 101.9 101.9 0 0 1-35.9 6.4c-47.3 0-88.5-32.5-88.5-74.3a31.5 31.5 0 0 1 16.4-27.3c-42.8 1.8-53.8 46.4-53.8 72.5 0 74 68.1 81.4 82.8 81.4 7.9 0 19.8-2.3 27-4.6l1.3-.4a128.3 128.3 0 0 0 66.6-52.8 4 4 0 0 0-5.3-5.6Z"
370                                transform="translate(-4.6 -5)" style="fill:url(#a)" />
371                            <path
372                                d="M235.7 195.5a93.7 93.7 0 0 1-10.6 4.7 101.9 101.9 0 0 1-35.9 6.4c-47.3 0-88.5-32.5-88.5-74.3a31.5 31.5 0 0 1 16.4-27.3c-42.8 1.8-53.8 46.4-53.8 72.5 0 74 68.1 81.4 82.8 81.4 7.9 0 19.8-2.3 27-4.6l1.3-.4a128.3 128.3 0 0 0 66.6-52.8 4 4 0 0 0-5.3-5.6Z"
373                                transform="translate(-4.6 -5)" style="isolation:isolate;opacity:.35;fill:url(#b)" />
374                            <path
375                                d="M110.3 246.3A79.2 79.2 0 0 1 87.6 225a80.7 80.7 0 0 1 29.5-120c3.2-1.5 8.5-4.1 15.6-4a32.4 32.4 0 0 1 25.7 13 31.9 31.9 0 0 1 6.3 18.7c0-.2 24.5-79.6-80-79.6-43.9 0-80 41.6-80 78.2a130.2 130.2 0 0 0 12.1 56 128 128 0 0 0 156.4 67 75.5 75.5 0 0 1-62.8-8Z"
376                                transform="translate(-4.6 -5)" style="fill:url(#c)" />
377                            <path
378                                d="M110.3 246.3A79.2 79.2 0 0 1 87.6 225a80.7 80.7 0 0 1 29.5-120c3.2-1.5 8.5-4.1 15.6-4a32.4 32.4 0 0 1 25.7 13 31.9 31.9 0 0 1 6.3 18.7c0-.2 24.5-79.6-80-79.6-43.9 0-80 41.6-80 78.2a130.2 130.2 0 0 0 12.1 56 128 128 0 0 0 156.4 67 75.5 75.5 0 0 1-62.8-8Z"
379                                transform="translate(-4.6 -5)" style="opacity:.41;fill:url(#d);isolation:isolate" />
380                            <path
381                                d="M157 153.8c-.9 1-3.4 2.5-3.4 5.6 0 2.6 1.7 5.2 4.8 7.3 14.3 10 41.4 8.6 41.5 8.6a59.6 59.6 0 0 0 30.3-8.3 61.4 61.4 0 0 0 30.4-52.9c.3-22.4-8-37.3-11.3-43.9C228 28.8 182.3 5 132.6 5a128 128 0 0 0-128 126.2c.5-36.5 36.8-66 80-66 3.5 0 23.5.3 42 10a72.6 72.6 0 0 1 30.9 29.3c6.1 10.6 7.2 24.1 7.2 29.5s-2.7 13.3-7.8 19.9Z"
382                                transform="translate(-4.6 -5)" style="fill:url(#e)" />
383                            <path
384                                d="M157 153.8c-.9 1-3.4 2.5-3.4 5.6 0 2.6 1.7 5.2 4.8 7.3 14.3 10 41.4 8.6 41.5 8.6a59.6 59.6 0 0 0 30.3-8.3 61.4 61.4 0 0 0 30.4-52.9c.3-22.4-8-37.3-11.3-43.9C228 28.8 182.3 5 132.6 5a128 128 0 0 0-128 126.2c.5-36.5 36.8-66 80-66 3.5 0 23.5.3 42 10a72.6 72.6 0 0 1 30.9 29.3c6.1 10.6 7.2 24.1 7.2 29.5s-2.7 13.3-7.8 19.9Z"
385                                transform="translate(-4.6 -5)" style="fill:url(#f)" />
386                        </svg>
387                        Add to Edge
388                    </a>
389                </div>
390                <div class="flex flex-col sm:flex-row gap-6 justify-center items-center w-full sm:w-auto max-w-80">
391                    <a href="https://addons.mozilla.org/en-US/firefox/addon/overphish/" target="_blank" rel="noopener"
392                        class="inline-flex items-center gap-3 px-8 py-5 bg-sky-500 hover:bg-sky-600 text-zinc-950 hover:text-white font-bold text-lg rounded-xl shadow-xl hover:shadow-2xl transition transform hover:-translate-y-1 w-full sm:w-auto max-w-80">
393                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80" width="48" height="48">
394                            <defs>
395                                <radialGradient id="a" cx="-1186.91" cy="-517.676" r="90.78"
396                                    gradientTransform="translate(1258.441 534.061)" gradientUnits="userSpaceOnUse">
397                                    <stop offset="0" stop-color="#fff36e" />
398                                    <stop offset=".5" stop-color="#fc4055" />
399                                    <stop offset="1" stop-color="#e31587" />
400                                </radialGradient>
401                                <radialGradient id="b" cx="-1251.812" cy="-513.921" r="53.726"
402                                    gradientTransform="translate(1258.441 534.061)" gradientUnits="userSpaceOnUse">
403                                    <stop offset=".001" stop-color="#c60084" />
404                                    <stop offset="1" stop-color="#fc4055" stop-opacity="0" />
405                                </radialGradient>
406                                <radialGradient id="c" cx="-1179.15" cy="-522.842" r="106.599"
407                                    gradientTransform="translate(1258.441 534.061)" gradientUnits="userSpaceOnUse">
408                                    <stop offset="0" stop-color="#ffde67" stop-opacity=".6" />
409                                    <stop offset=".093" stop-color="#ffd966" stop-opacity=".581" />
410                                    <stop offset=".203" stop-color="#ffca65" stop-opacity=".525" />
411                                    <stop offset=".321" stop-color="#feb262" stop-opacity=".432" />
412                                    <stop offset=".446" stop-color="#fe8f5e" stop-opacity=".302" />
413                                    <stop offset=".573" stop-color="#fd6459" stop-opacity=".137" />
414                                    <stop offset=".664" stop-color="#fc4055" stop-opacity="0" />
415                                </radialGradient>
416                                <radialGradient id="d" cx="42.285" cy="44.499" r="137.521"
417                                    gradientTransform="translate(0 -.095)" gradientUnits="userSpaceOnUse">
418                                    <stop offset=".153" stop-color="#810220" />
419                                    <stop offset=".167" stop-color="#920b27" stop-opacity=".861" />
420                                    <stop offset=".216" stop-color="#cb2740" stop-opacity=".398" />
421                                    <stop offset=".253" stop-color="#ef394f" stop-opacity=".11" />
422                                    <stop offset=".272" stop-color="#fc4055" stop-opacity="0" />
423                                </radialGradient>
424                                <radialGradient id="e" cx="31.878" cy="42.77" r="137.521"
425                                    gradientTransform="translate(0 -.095)" gradientUnits="userSpaceOnUse">
426                                    <stop offset=".113" stop-color="#810220" />
427                                    <stop offset=".133" stop-color="#920b27" stop-opacity=".861" />
428                                    <stop offset=".204" stop-color="#cb2740" stop-opacity=".398" />
429                                    <stop offset=".257" stop-color="#ef394f" stop-opacity=".11" />
430                                    <stop offset=".284" stop-color="#fc4055" stop-opacity="0" />
431                                </radialGradient>
432                                <linearGradient id="f" x1="-1212.61" y1="-525.103" x2="-1189.052" y2="-484.299"
433                                    gradientTransform="translate(1258.441 532.89)" gradientUnits="userSpaceOnUse">
434                                    <stop offset="0" stop-color="#ffbd4f" />
435                                    <stop offset=".508" stop-color="#ff9640" stop-opacity="0" />
436                                </linearGradient>
437                                <radialGradient id="g" cx="-1255.933" cy="-77.395" r="88.863"
438                                    gradientTransform="matrix(.959 0 0 .961 1273.896 86.468)"
439                                    gradientUnits="userSpaceOnUse">
440                                    <stop offset="0" stop-color="#ff9640" />
441                                    <stop offset=".8" stop-color="#fc4055" />
442                                </radialGradient>
443                                <radialGradient id="h" cx="-1255.933" cy="-77.395" r="88.863"
444                                    gradientTransform="matrix(.959 0 0 .961 1273.896 86.468)"
445                                    gradientUnits="userSpaceOnUse">
446                                    <stop offset=".084" stop-color="#ffde67" />
447                                    <stop offset=".147" stop-color="#ffdc66" stop-opacity=".968" />
448                                    <stop offset=".246" stop-color="#ffd562" stop-opacity=".879" />
449                                    <stop offset=".369" stop-color="#ffcb5d" stop-opacity=".734" />
450                                    <stop offset=".511" stop-color="#ffbc55" stop-opacity=".533" />
451                                    <stop offset=".667" stop-color="#ffaa4b" stop-opacity=".28" />
452                                    <stop offset=".822" stop-color="#ff9640" stop-opacity="0" />
453                                </radialGradient>
454                                <radialGradient id="i" cx="49.941" cy="38.654" r="41.79"
455                                    gradientTransform="matrix(.247 .971 -1.011 .259 76.681 -19.851)"
456                                    gradientUnits="userSpaceOnUse">
457                                    <stop offset=".363" stop-color="#fc4055" />
458                                    <stop offset=".443" stop-color="#fd604d" stop-opacity=".633" />
459                                    <stop offset=".545" stop-color="#fe8644" stop-opacity=".181" />
460                                    <stop offset=".59" stop-color="#ff9640" stop-opacity="0" />
461                                </radialGradient>
462                                <radialGradient id="j" cx="42.737" cy="42.193" r="41.79"
463                                    gradientTransform="translate(0 -.095)" gradientUnits="userSpaceOnUse">
464                                    <stop offset=".216" stop-color="#fc4055" stop-opacity=".8" />
465                                    <stop offset=".267" stop-color="#fd5251" stop-opacity=".633" />
466                                    <stop offset=".41" stop-color="#fe8345" stop-opacity=".181" />
467                                    <stop offset=".474" stop-color="#ff9640" stop-opacity="0" />
468                                </radialGradient>
469                                <radialGradient id="k" cx="-1238.198" cy="-87.433" r="150.195"
470     
470                               gradientTransform="matrix(.959 0 0 .961 1273.896 86.468)"
471                                    gradientUnits="userSpaceOnUse">
472                                    <stop offset=".054" stop-color="#fff36e" />
473                                    <stop offset=".457" stop-color="#ff9640" />
474                                    <stop offset=".639" stop-color="#ff9640" />
475                                </radialGradient>
476                                <linearGradient id="l" x1="59.052" y1="7.083" x2="18.155" y2="77.92"
477                                    gradientUnits="userSpaceOnUse">
478                                    <stop offset="0" stop-color="#fff36e" stop-opacity=".8" />
479                                    <stop offset=".094" stop-color="#fff36e" stop-opacity=".699" />
480                                    <stop offset=".752" stop-color="#fff36e" stop-opacity="0" />
481                                </linearGradient>
482                                <linearGradient id="m" x1="40.585" y1="-.67" x2="62.3" y2="62.203"
483                                    gradientUnits="userSpaceOnUse">
484                                    <stop offset="0" stop-color="#b833e1" />
485                                    <stop offset=".371" stop-color="#9059ff" />
486                                    <stop offset=".614" stop-color="#5b6df8" />
487                                    <stop offset="1" stop-color="#0090ed" />
488                                </linearGradient>
489                                <linearGradient id="n" x1="-1230.731" y1="-532.566" x2="-1190.37" y2="-492.205"
490                                    gradientTransform="translate(1258.441 532.89)" gradientUnits="userSpaceOnUse">
491                                    <stop offset=".805" stop-color="#722291" stop-opacity="0" />
492                                    <stop offset="1" stop-color="#592acb" stop-opacity=".5" />
493                                </linearGradient>
494                            </defs>
495                            <path
496                                d="M71.944 15.7A39.47 39.47 0 0 0 41.588.009C32.3-.177 25.884 2.614 22.254 4.858 27.111 2.041 34.14.443 40.294.522c15.83.2 32.832 10.981 35.357 30.413 2.9 22.306-12.637 40.923-34.493 40.98-24.045.061-38.67-21.229-34.847-40.352a19.735 19.735 0 0 1 .413-2.787 37.815 37.815 0 0 1 4.193-14.018c-2.769 1.433-6.295 5.965-8.035 10.163A41.355 41.355 0 0 0 .284 45.1c.06.518.114 1.035.182 1.549A40.062 40.062 0 1 0 71.944 15.7zm-63.4 3.487z"
497                                fill="url(#a)" />
498                            <path
499                                d="M71.944 15.7A39.47 39.47 0 0 0 41.588.009C32.3-.177 25.884 2.614 22.254 4.858 27.111 2.041 34.14.443 40.294.522c15.83.2 32.832 10.981 35.357 30.413 2.9 22.306-12.637 40.923-34.493 40.98-24.045.061-38.67-21.229-34.847-40.352a19.735 19.735 0 0 1 .413-2.787 37.815 37.815 0 0 1 4.193-14.018c-2.769 1.433-6.295 5.965-8.035 10.163A41.355 41.355 0 0 0 .284 45.1c.06.518.114 1.035.182 1.549A40.062 40.062 0 1 0 71.944 15.7zm-63.4 3.487z"
500                                fill="url(#b)" opacity=".67" />
501                            <path
502                                d="M71.944 15.7A39.47 39.47 0 0 0 41.588.009C32.3-.177 25.884 2.614 22.254 4.858 27.111 2.041 34.14.443 40.294.522c15.83.2 32.832 10.981 35.357 30.413 2.9 22.306-12.637 40.923-34.493 40.98-24.045.061-38.67-21.229-34.847-40.352a19.735 19.735 0 0 1 .413-2.787 37.815 37.815 0 0 1 4.193-14.018c-2.769 1.433-6.295 5.965-8.035 10.163A41.355 41.355 0 0 0 .284 45.1c.06.518.114 1.035.182 1.549A40.062 40.062 0 1 0 71.944 15.7zm-63.4 3.487z"
503                                fill="url(#c)" />
504                            <path
505                                d="M71.944 15.7A39.47 39.47 0 0 0 41.588.009C32.3-.177 25.884 2.614 22.254 4.858 27.111 2.041 34.14.443 40.294.522c15.83.2 32.832 10.981 35.357 30.413 2.9 22.306-12.637 40.923-34.493 40.98-24.045.061-38.67-21.229-34.847-40.352a19.735 19.735 0 0 1 .413-2.787 37.815 37.815 0 0 1 4.193-14.018c-2.769 1.433-6.295 5.965-8.035 10.163A41.355 41.355 0 0 0 .284 45.1c.06.518.114 1.035.182 1.549A40.062 40.062 0 1 0 71.944 15.7zm-63.4 3.487z"
506                                fill="url(#d)" />
507                            <path
508                                d="M71.944 15.7A39.47 39.47 0 0 0 41.588.009C32.3-.177 25.884 2.614 22.254 4.858 27.111 2.041 34.14.443 40.294.522c15.83.2 32.832 10.981 35.357 30.413 2.9 22.306-12.637 40.923-34.493 40.98-24.045.061-38.67-21.229-34.847-40.352a19.735 19.735 0 0 1 .413-2.787 37.815 37.815 0 0 1 4.193-14.018c-2.769 1.433-6.295 5.965-8.035 10.163A41.355 41.355 0 0 0 .284 45.1c.06.518.114 1.035.182 1.549A40.062 40.062 0 1 0 71.944 15.7zm-63.4 3.487z"
509                                fill="url(#e)" />
510                            <path
511                                d="M75.651 30.935a41.01 41.01 0 0 1 .3 7.247q1.99-.3 3.987-.53A40.01 40.01 0 0 0 71.944 15.7 39.47 39.47 0 0 0 41.588.009C32.3-.177 25.884 2.614 22.254 4.858 27.111 2.041 34.14.443 40.294.522 56.124.724 73.126 11.5 75.651 30.935z"
512                                fill="url(#f)" />
513                            <path
514                                d="M76.625 29.826C74.374 9.518 56.263.39 40.294.522c-6.155.05-13.183 1.519-18.04 4.336a19.7 19.7 0 0 0-3.56 2.7c.129-.107.514-.424 1.152-.862l.063-.043.056-.038a26.655 26.655 0 0 1 7.692-3.572A43.5 43.5 0 0 1 40.84 1.5a33.254 33.254 0 0 1 31.25 31.993C72.457 46.7 61.648 57.23 49.188 57.84c-9.062.444-17.6-3.941-21.77-12.713a21.68 21.68 0 0 1-1.964-6.333c-1.976-13.35 6.989-24.735 15.21-27.554-4.435-3.874-15.548-3.611-23.819 2.474-5.956 4.382-9.82 11.049-11.1 19a32.945 32.945 0 0 0 2.34 18 35.3 35.3 0 0 0 30.089 21.443q1.489.114 2.984.113c26.462 0 37.942-20.087 35.467-42.444z"
515                                fill="url(#g)" />
516                            <path
517                                d="M76.625 29.826C74.374 9.518 56.263.39 40.294.522c-6.155.05-13.183 1.519-18.04 4.336a19.7 19.7 0 0 0-3.56 2.7c.129-.107.514-.424 1.152-.862l.063-.043.056-.038a26.655 26.655 0 0 1 7.692-3.572A43.5 43.5 0 0 1 40.84 1.5a33.254 33.254 0 0 1 31.25 31.993C72.457 46.7 61.648 57.23 49.188 57.84c-9.062.444-17.6-3.941-21.77-12.713a21.68 21.68 0 0 1-1.964-6.333c-1.976-13.35 6.989-24.735 15.21-27.554-4.435-3.874-15.548-3.611-23.819 2.474-5.956 4.382-9.82 11.049-11.1 19a32.945 32.945 0 0 0 2.34 18 35.3 35.3 0 0 0 30.089 21.443q1.489.114 2.984.113c26.462 0 37.942-20.087 35.467-42.444z"
518                                fill="url(#h)" />
519                            <path
520                                d="M76.625 29.826C74.374 9.518 56.263.39 40.294.522c-6.155.05-13.183 1.519-18.04 4.336a19.7 19.7 0 0 0-3.56 2.7c.129-.107.514-.424 1.152-.862l.063-.043.056-.038a26.655 26.655 0 0 1 7.692-3.572A43.5 43.5 0 0 1 40.84 1.5a33.254 33.254 0 0 1 31.25 31.993C72.457 46.7 61.648 57.23 49.188 57.84c-9.062.444-17.6-3.941-21.77-12.713a21.68 21.68 0 0 1-1.964-6.333c-1.976-13.35 6.989-24.735 15.21-27.554-4.435-3.874-15.548-3.611-23.819 2.474-5.956 4.382-9.82 11.049-11.1 19a32.945 32.945 0 0 0 2.34 18 35.3 35.3 0 0 0 30.089 21.443q1.489.114 2.984.113c26.462 0 37.942-20.087 35.467-42.444z"
521                                style="mix-blend-mode:multiply" opacity=".53" fill="url(#i)" />
522                            <path
523                                d="M76.625 29.826C74.374 9.518 56.263.39 40.294.522c-6.155.05-13.183 1.519-18.04 4.336a19.7 19.7 0 0 0-3.56 2.7c.129-.107.514-.424 1.152-.862l.063-.043.056-.038a26.655 26.655 0 0 1 7.692-3.572A43.5 43.5 0 0 1 40.84 1.5a33.254 33.254 0 0 1 31.25 31.993C72.457 46.7 61.648 57.23 49.188 57.84c-9.062.444-17.6-3.941-21.77-12.713a21.68 21.68 0 0 1-1.964-6.333c-1.976-13.35 6.989-24.735 15.21-27.554-4.435-3.874-15.548-3.611-23.819 2.474-5.956 4.382-9.82 11.049-11.1 19a32.945 32.945 0 0 0 2.34 18 35.3 35.3 0 0 0 30.089 21.443q1.489.114 2.984.113c26.462 0 37.942-20.087 35.467-42.444z"
524                                style="mix-blend-mode:multiply" opacity=".53" fill="url(#j)" />
525                            <path
526                                d="M49.188 57.84c17.1-1.04 24.42-15.2 24.879-25.245C74.783 16.9 65.472-.02 40.84 1.5a43.5 43.5 0 0 0-13.183 1.546 28.855 28.855 0 0 0-7.692 3.572l-.056.038-.063.043q-.574.4-1.123.842A33.482 33.482 0 0 1 39.7 3.605c14.142 1.856 27.072 12.857 27.072 27.373 0 11.169-8.631 19.7-18.738 19.087-15.015-.9-18.8-16.3-10.989-22.954-2.106-.453-6.064.435-8.82 4.555-2.473 3.7-2.333 9.41-.807 13.461a22.118 22.118 0 0 0 21.77 12.713z"
527                                fill="url(#k)" />
528                            <path
529                                d="M71.944 15.7a39.958 39.958 0 0 0-3.482-3.982 31.342 31.342 0 0 0-3.177-2.926 24.393 24.393 0 0 1 1.849 1.79 22.466 22.466 0 0 1 4.882 8.144c2.089 6.329 1.953 14.25-2.036 20.471a23.539 23.539 0 0 1-20.855 10.895c-.361 0-.725 0-1.091-.027-15.015-.9-18.8-16.3-10.988-22.954-2.107-.453-6.065.435-8.821 4.555-2.473 3.7-2.333 9.41-.807 13.461a21.679 21.679 0 0 1-1.963-6.333c-1.977-13.35 6.988-24.735 15.209-27.554-4.435-3.874-15.548-3.611-23.819 2.474a27.845 27.845 0 0 0-10.087 14.6 38.5 38.5 0 0 1 4.159-13.553c-2.769 1.433-6.295 5.965-8.035 10.163A41.355 41.355 0 0 0 .284 45.1c.06.518.114 1.035.182 1.549A40.062 40.062 0 1 0 71.944 15.7z"
530                                fill="url(#l)" />
531                            <path
532                                d="M72.016 18.726a22.458 22.458 0 0 0-4.882-8.144 30.224 30.224 0 0 0-9.094-6.493A40.518 40.518 0 0 0 49.1.92a39.834 39.834 0 0 0-16.565-.1c-5.683 1.2-10.68 3.659-13.841 6.733a32.1 32.1 0 0 1 8.031-3.2 33.565 33.565 0 0 1 31.173 8.1 27.01 27.01 0 0 1 4.329 5.3c4.895 7.959 4.432 17.965.615 23.866-2.835 4.384-8.907 8.5-14.572 8.452A23.629 23.629 0 0 0 69.98 39.2c3.989-6.224 4.125-14.145 2.036-20.474z"
533                                fill="url(#m)" />
534                            <path
535                                d="M72.016 18.726a22.458 22.458 0 0 0-4.882-8.144 30.224 30.224 0 0 0-9.094-6.493A40.518 40.518 0 0 0 49.1.92a39.834 39.834 0 0 0-16.565-.1c-5.683 1.2-10.68 3.659-13.841 6.733a32.1 32.1 0 0 1 8.031-3.2 33.565 33.565 0 0 1 31.173 8.1 27.01 27.01 0 0 1 4.329 5.3c4.895 7.959 4.432 17.965.615 23.866-2.835 4.384-8.907 8.5-14.572 8.452A23.629 23.629 0 0 0 69.98 39.2c3.989-6.224 4.125-14.145 2.036-20.474z"
536                                fill="url(#n)" />
537                        </svg>
538                        Add to Firefox
539                    </a>
540                </div>
541            </div>
542            <p class="text-sm text-gray-500 mt-6"><strong>Available now on Chrome, Edge, &
543                    Firefox!</strong><br><em>Safari coming soon.</em></p>
544        </div>
545    </header>
546
547    <main id="main-content">
548
549        <!-- Features -->
550        <section aria-labelledby="features-heading" class="py-24 bg-white">
551            <div class="max-w-7xl mx-auto px-6">
552                <h2 id="features-heading"
553                    class="flex flex-row flex-wrap justify-center text-4xl md:text-5xl font-bold text-dark tracking-tight mb-16">
554                    <span class="p-2">Why</span>
555                    <strong class="text-dark bg-sky-50 px-3 py-2 rounded-lg">OverPhish</strong><span
556                        class="p-2 pr-0">stands out.</span><svg class="translate-y-4 text-sky-500"
557                        xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" width="50" height="50"
558                        fill="currentColor">
559                        <path
560                            d="M297.4 566.6C309.9 579.1 330.2 579.1 342.7 566.6L470.7 438.6C479.9 429.4 482.6 415.7 477.6 403.7C472.6 391.7 460.9 384 448 384L384 384L384 224C384 135.6 312.4 64 224 64L160 64C142.3 64 128 78.3 128 96L128 160C128 177.7 142.3 192 160 192L224 192C241.7 192 256 206.3 256 224L256 384L192 384C179.1 384 167.4 391.8 162.4 403.8C157.4 415.8 160.2 429.5 169.3 438.7L297.3 566.7z" />
561                    </svg>
562                </h2>
563                <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-12">
564
565
566                    <!-- Animated Card -->
567                    <article
568                        class="group cursor-pointer transform transition-all duration-500 hover:scale-105 hover:-rotate-1">
569                        <div
570                            class="mx-auto text-sky-900 rounded-3xl border border-white/30 bg-gradient-to-br from-[#f0f9ff]/90 via-[#f0f9ff] to-[#e0f2fe]/90 shadow-2xl shadow-sky-200/50 duration-700 z-10 relative backdrop-blur-xl hover:border-sky-300/60 overflow-hidden hover:shadow-3xl hover:shadow-sky-300/40 w-[350px] bg-[#f0f9ff]/80">
571                            <div class="absolute inset-0 z-0 overflow-hidden">
572                                <div
573                                    class="absolute inset-0 bg-gradient-to-tr from-sky-200/20 to-sky-100/10 opacity-60 group-hover:opacity-80 transition-opacity duration-500">
574                                </div>
575
576                                <div style="animation-delay: 0.5s;"
577                                    class="absolute -bottom-20 -left-20 w-48 h-48 rounded-full bg-gradient-to-tr from-sky-300/40 to-transparent blur-3xl op
577acity-40 group-hover:opacity-70 transform group-hover:scale-110 transition-all duration-700 animate-bounce">
578                                </div>
579
580                                <div
581                                    class="absolute inset-0 bg-gradient-to-r from-transparent via-sky-200/30 to-transparent transform -skew-x-12 translate-x-full group-hover:translate-x-[-200%] transition-transform duration-1000">
582                                </div>
583                            </div>
584
585                            <div class="p-10 relative z-10">
586                                <div class="flex flex-col items-center text-center">
587                                    <div class="relative mb-6">
588                                        <div
589                                            class="absolute inset-0 rounded-full border-2 border-sky-300/40 animate-ping">
590                                        </div>
591                                        <div style="animation-delay: 0.5s;"
592                                            class="absolute inset-0 rounded-full border border-sky-200/30 animate-pulse">
593                                        </div>
594
595                                        <div class="p-6 rounded-full backdrop-blur-xl border border-sky-300/50 
596                      bg-gradient-to-br from-white/90 to-white/70 shadow-2xl 
597                      transform group-hover:rotate-12 group-hover:scale-110 
598                      transition-all duration-500 hover:shadow-sky-300/40">
599                                            <div
600                                                class="transform group-hover:rotate-180 transition-transform duration-700">
601                                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
602                                                    stroke="currentColor" class="w-12 h-12 text-sky-500"
603                                                    aria-hidden="true">
604                                                    <path stroke-linecap="round" stroke-linejoin="round"
605                                                        stroke-width="1.5"
606                                                        d="M10.05 4.575a1.575 1.575 0 1 0-3.15 0v3m3.15-3v-1.5a1.575 1.575 0 0 1 3.15 0v1.5m-3.15 0 .075 5.925m3.075.75V4.575m0 0a1.575 1.575 0 0 1 3.15 0V15M6.9 7.575a1.575 1.575 0 1 0-3.15 0v8.175a6.75 6.75 0 0 0 6.75 6.75h2.018a5.25 5.25 0 0 0 3.712-1.538l1.732-1.732a5.25 5.25 0 0 0 1.538-3.712l.003-2.024a.668.668 0 0 1 .198-.471 1.575 1.575 0 1 0-2.228-2.228 3.818 3.818 0 0 0-1.12 2.687M6.9 7.575V12m6.27 4.318A4.49 4.49 0 0 1 16.35 15m.002 0h-.002" />
607                                                </svg>
608
609                                            </div>
610                                        </div>
611                                    </div>
612
613                                    <div class="mb-4 transform group-hover:scale-105 transition-transform duration-300">
614                                        <p
615                                            class="text-3xl font-bold bg-gradient-to-r from-sky-700 via-sky-600 to-sky-700 bg-clip-text text-transparent animate-pulse">
616                                            Instant Blocking
617                                        </p>
618                                    </div>
619
620                                    <div class="space-y-1 max-w-sm">
621                                        <p class="text-sky-800 text-lg font-semibold leading-relaxed">
622                                            Bloom filter + Trie for sub-millisecond lookups. Blocks phishing before page
623                                            loads.
624                                        </p>
625                                    </div>
626
627                                    <div
628                                        class="mt-6 w-1/3 h-0.5 bg-gradient-to-r from-transparent via-sky-400 to-transparent rounded-full transform group-hover:w-1/2 group-hover:h-1 transition-all duration-500 animate-pulse">
629                                    </div>
630
631                                    <div
632                                        class="flex space-x-2 mt-4 opacity-70 group-hover:opacity-100 transition-opacity duration-300">
633                                        <div class="w-2 h-2 bg-sky-4
63300 rounded-full animate-bounce"></div>
634                                        <div style="animation-delay: 0.1s;"
635                                            class="w-2 h-2 bg-sky-500 rounded-full animate-bounce"></div>
636                                        <div style="animation-delay: 0.2s;"
637                                            class="w-2 h-2 bg-sky-600 rounded-full animate-bounce"></div>
638                                    </div>
639                                </div>
640                            </div>
641                        </div>
642                    </article>
643
644                    <!-- Animated Card -->
645                    <article
646                        class="group cursor-pointer transform transition-all duration-500 hover:scale-105 hover:-rotate-1">
647                        <div
648                            class="mx-auto text-sky-900 rounded-3xl border border-white/30 bg-gradient-to-br from-[#f0f9ff]/90 via-[#f0f9ff] to-[#e0f2fe]/90 shadow-2xl shadow-sky-200/50 duration-700 z-10 relative backdrop-blur-xl hover:border-sky-300/60 overflow-hidden hover:shadow-3xl hover:shadow-sky-300/40 w-[350px] bg-[#f0f9ff]/80">
649                            <div class="absolute inset-0 z-0 overflow-hidden">
650                                <div
651                                    class="absolute inset-0 bg-gradient-to-tr from-sky-200/20 to-sky-100/10 opacity-60 group-hover:opacity-80 transition-opacity duration-500">
652                                </div>
653
654                                <div style="animation-delay: 0.5s;"
655                                    class="absolute -bottom-20 -left-20 w-48 h-48 rounded-full bg-gradient-to-tr from-sky-300/40 to-transparent blur-3xl op
655acity-40 group-hover:opacity-70 transform group-hover:scale-110 transition-all duration-700 animate-bounce">
656                                </div>
657
658                                <div
659                                    class="absolute inset-0 bg-gradient-to-r from-transparent via-sky-200/30 to-transparent transform -skew-x-12 translate-x-full group-hover:translate-x-[-200%] transition-transform duration-1000">
660                                </div>
661                            </div>
662
663                            <div class="p-10 relative z-10">
664                                <div class="flex flex-col items-center text-center">
665                                    <div class="relative mb-6">
666                                        <div
667                                            class="absolute inset-0 rounded-full border-2 border-sky-300/40 animate-ping">
668                                        </div>
669                                        <div style="animation-delay: 0.5s;"
670                                            class="absolute inset-0 rounded-full border border-sky-200/30 animate-pulse">
671                                        </div>
672
673                                        <div class="p-6 rounded-full backdrop-blur-xl border border-sky-300/50 
674                      bg-gradient-to-br from-white/90 to-white/70 shadow-2xl 
675                      transform group-hover:rotate-12 group-hover:scale-110 
676                      transition-all duration-500 hover:shadow-sky-300/40">
677                                            <div
678                                                class="transform group-hover:rotate-180 transition-transform duration-700">
679                                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
680                                                    stroke-width="1.5" stroke="currentColor"
681                                                    class="w-12 h-12 text-sky-500" aria-hidden="true">
682                                                    <path stroke-linecap="round" stroke-linejoin="round"
683                                                        stroke-width="1.5"
684                                                        d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 0 0 2.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 0 0-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25ZM6.75 12h.008v.008H6.75V12Zm0 3h.008v.008H6.75V15Zm0 3h.008v.008H6.75V18Z" />
685                                                </svg>
686
687                                            </div>
688                                        </div>
689                                    </div>
690
691                                    <div class="mb-4 transform group-hover:scale-105 transition-transform duration-300">
692                                        <p
693                                            class="text-3xl font-bold bg-gradient-to-r from-sky-700 via-sky-600 to-sky-700 bg-clip-text text-transparent animate-pulse">
694                                            Daily Updates
695                                        </p>
696                                    </div>
697
698                                    <div class="space-y-1 max-w-sm">
699                                        <p class="text-sky-800 text-lg font-semibold leading-relaxed">
700                                            Aggregates the top 5 phishing & malware blockl
700ists — every 24 hours.
701                                        </p>
702                                    </div>
703
704                                    <div
705                                        class="mt-6 w-1/3 h-0.5 bg-gradient-to-r from-transparent via-sky-400 to-transparent rounded-full transform group-hover:w-1/2 group-hover:h-1 transition-all duration-500 animate-pulse">
706                                    </div>
707
708                                    <div
709                                        class="flex space-x-2 mt-4 opacity-70 group-hover:opacity-100 transition-opacity duration-300">
710                                        <div class="w-2 h-2 bg-sky-400 rounded-full animate-bounce"></div>
711                                        <div style="animation-delay: 0.1s;"
712                                            class="w-2 h-2 bg-sky-500 rounded-full animate-bounce"></div>
713                                        <div style="animation-delay: 0.2s;"
714                                            class="w-2 h-2 bg-sky-600 rounded-full animate-bounce"></div>
715                                    </div>
716                                </div>
717                            </div>
718                        </div>
719                    </article>
720
721                    <!-- Animated Card -->
722                    <article
723                        class="group cursor-pointer transform transition-all duration-500 hover:scale-105 hover:-rotate-1">
724                        <div
725                            class="mx-auto text-sky-900 rounded-3xl border border-white/30 bg-gradient-to-br from-[#f0f9ff]/90 via-[#f0f9ff] to-[#e0f2fe]/90 shadow-2xl shadow-sky-200/50 duration-700 z-10 relative backdrop-blur-xl hover:border-sky-300/60 overflow-hidden hover:shadow-3xl hover:shadow-sky-300/40 w-[350px] bg-[#f0f9ff]/80">
726                            <div class="absolute inset-0 z-0 overflow-hidden">
727                                <div
728                                    class="absolute inset-0 bg-gradient-to-tr from-sky-200/20 to-sky-100/10 opacity-60 group-hover:opacity-80 transition-opacity duration-500">
729                                </div>
730
731                                <div style="animation-delay: 0.5s;"
732                                    class="absolute -bottom-20 -left-20 w-48 h-48 rounded-full bg-gradient-to-tr from-sky-300/40 to-transparent blur-3xl op
732acity-40 group-hover:opacity-70 transform group-hover:scale-110 transition-all duration-700 animate-bounce">
733                                </div>
734
735                                <div
736                                    class="absolute inset-0 bg-gradient-to-r from-transparent via-sky-200/30 to-transparent transform -skew-x-12 translate-x-full group-hover:translate-x-[-200%] transition-transform duration-1000">
737                                </div>
738                            </div>
739
740                            <div class="p-10 relative z-10">
741                                <div class="flex flex-col items-center text-center">
742                                    <div class="relative mb-6">
743                                        <div
744                                            class="absolute inset-0 rounded-full border-2 border-sky-300/40 animate-ping">
745                                        </div>
746                                        <div style="animation-delay: 0.5s;"
747                                            class="absolute inset-0 rounded-full border border-sky-200/30 animate-pulse">
748                                        </div>
749
750                                        <div class="p-6 rounded-full backdrop-blur-xl border border-sky-300/50 
751                      bg-gradient-to-br from-white/90 to-white/70 shadow-2xl 
752                      transform group-hover:rotate-12 group-hover:scale-110 
753                      transition-all duration-500 hover:shadow-sky-300/40">
754                                            <div
755                                                class="transform group-hover:rotate-180 transition-transform duration-700">
756                                                <svg class="w-12 h-12 text-sky-500" fill="none" stroke="currentColor"
757                                                    viewBox="0 0 24 24" aria-hidden="true">
758                                                    <path stroke-linecap="round" stroke-linejoin="round"
759                                                        stroke-width="1.75"
760                                                        d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
761                                                </svg>
762
763                                            </div>
764                                        </div>
765                                    </div>
766
767                                    <div class="mb-4 transform group-hover:scale-105 transition-transform duration-300">
768                                        <p
769                                            class="text-3xl font-bold bg-gradient-to-r from-sky-700 via-sky-600 to-sky-700 bg-clip-text text-transparent animate-pulse">
770                                            Zero-Trust Architecture
771                                        </p>
772                                    </div>
773
774                                    <div class="space-y-1 max-w-sm">
775                                        <p class="text-sky-800 text-lg font-semibold leading-relaxed">
776                                            No accounts, no telemetry, no data ever leaves your browser.
777                                        </p>
778                                    </div>
779
780                                    <div
781                                        class="mt-6 w-1/3 h-0.5 bg-gradient-to-r from-transparent via-sky-400 to-transparent rounded-full transform group-hover:w-1/2 group-hover:h-1 transition-all duration-500 animate-pulse">
782                                    </div>
783
784                                    <div
785                                        class="flex space-x-2 mt-4 opacity-70 group-hover:opacity-100 transition-opacity duration-300">
786                                        <div class="w-2 h-2 bg-sky-400 rounded-full animate-bounce"></div>
787                                        <div style="animation-delay: 0.1s;"
788                                            class="w-2 h-2 bg-sky-500 rounded-full animate-bounce"></div>
789                                        <div style="animation-delay: 0.2s;"
790                                            class="w-2 h-2 bg-sky-600 rounded-full animate-bounce"></div>
791                                    </div>
792                                </div>
793                            </div>
794                        </div>
795                    </article>
796
797                    <!-- Animated Card -->
798                    <article
799                        class="group cursor-pointer transform transition-all duration-500 hover:scale-105 hover:-rotate-1">
800                        <div
801                            class="mx-auto text-sky-900 rounded-3xl border border-white/30 bg-gradient-to-br from-[#f0f9ff]/90 via-[#f0f9ff] to-[#e0f2fe]/90 shadow-2xl shadow-sky-200/50 duration-700 z-10 relative backdrop-blur-xl hover:border-sky-300/60 overflow-hidden hover:shadow-3xl hover:shadow-sky-300/40 w-[350px] bg-[#f0f9ff]/80">
802                            <div class="absolute inset-0 z-0 overflow-hidden">
803                                <div
804                                    class="absolute inset-0 bg-gradient-to-tr from-sky-200/20 to-sky-100/10 opacity-60 group-hover:opacity-80 transition-opacity duration-500">
805                                </div>
806
807                                <div style="animation-delay: 0.5s;"
808                                    class="absolute -bottom-20 -left-20 w-48 h-48 rounded-full bg-gradient-to-tr from-sky-300/40 to-transparent blur-3xl op
808acity-40 group-hover:opacity-70 transform group-hover:scale-110 transition-all duration-700 animate-bounce">
809                                </div>
810
811                                <div
812                                    class="absolute inset-0 bg-gradient-to-r from-transparent via-sky-200/30 to-transparent transform -skew-x-12 translate-x-full group-hover:translate-x-[-200%] transition-transform duration-1000">
813                                </div>
814                            </div>
815
816                            <div class="p-10 relative z-10">
817                                <div class="flex flex-col items-center text-center">
818                                    <div class="relative mb-6">
819                                        <div
820                                            class="absolute inset-0 rounded-full border-2 border-sky-300/40 animate-ping">
821                                        </div>
822                                        <div style="animation-delay: 0.5s;"
823                                            class="absolute inset-0 rounded-full border border-sky-200/30 animate-pulse">
824                                        </div>
825
826                                        <div class="p-6 rounded-full backdrop-blur-xl border border-sky-300/50 
827                      bg-gradient-to-br from-white/90 to-white/70 shadow-2xl 
828                      transform group-hover:rotate-12 group-hover:scale-110 
829                      transition-all duration-500 hover:shadow-sky-300/40">
830                                            <div
831                                                class="transform group-hover:rotate-180 transition-transform duration-700">
832                                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
833                                                    stroke-width="1.5" stroke="currentColor"
834                                                    class="w-12 h-12 text-sky-500" aria-hidden="true">
835                                                    <path stroke-linecap="round" stroke-linejoin="round"
836                                                        stroke-width="1.5"
837                                                        d="M10.5 1.5H8.25A2.25 2.25 0 0 0 6 3.75v16.5a2.25 2.25 0 0 0 2.25 2.25h7.5A2.25 2.25 0 0 0 18 20.25V3.75a2.25 2.25 0 0 0-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3" />
838                                                </svg>
839
840                                            </div>
841                                        </div>
842                                    </div>
843
844                                    <div class="mb-4 transform group-hover:scale-105 transition-transform duration-300">
845                                        <p
846                                            class="text-3xl font-bold bg-gradient-to-r from-sky-700 via-sky-600 to-sky-700 bg-clip-text text-transparent animate-pulse">
847                                            Lightweight
848                                        </p>
849                                    </div>
850
851                                    <div class="space-y-1 max-w-sm">
852                                        <p class="text-sky-800 text-lg font-semibold leading-relaxed">
853                                            Under 300KB. No performance impact — even on low-end devices.
854                                        </p>
855                                    </div>
856
857                                    <div
858                                        class="mt-6 w-1/3 h-0.5 bg-gradient-to-r from-transparent via-sky-400 to-transparent rounded-full transform group-hover:w-1/2 group-hover:h-1 transition-all duration-500 animate-pulse">
859                                    </div>
860
861                                    <div
862                                        class="flex space-x-2 mt-4 opacity-70 group-hover:opacity-100 transition-opacity duration-300">
863                                        <div class="w-2 h-2 bg-sky-400 rounded-full animate-bounce"></div>
864                                        <div style="animation-delay: 0.1s;"
865                                            class="w-2 h-2 bg-sky-500 rounded-full animate-bounce"></div>
866                                        <div style="animation-delay: 0.2s;"
867                                            class="w-2 h-2 bg-sky-600 rounded-full animate-bounce"></div>
868                                    </div>
869                                </div>
870                            </div>
871                        </div>
872                    </article>
873
874                    <!-- Animated Card -->
875                    <article
876                        class="group cursor-pointer transform transition-all duration-500 hover:scale-105 hover:-rotate-1">
877                        <div
878                            class="mx-auto text-sky-900 rounded-3xl border border-white/30 bg-gradient-to-br from-[#f0f9ff]/90 via-[#f0f9ff] to-[#e0f2fe]/90 shadow-2xl shadow-sky-200/50 duration-700 z-10 relative backdrop-blur-xl hover:border-sky-300/60 overflow-hidden hover:shadow-3xl hover:shadow-sky-300/40 w-[350px] bg-[#f0f9ff]/80">
879                            <div class="absolute inset-0 z-0 overflow-hidden">
880                                <div
881                                    class="absolute inset-0 bg-gradient-to-tr from-sky-200/20 to-sky-100/10 opacity-60 group-hover:opacity-80 transition-opacity duration-500">
882                                </div>
883
884                                <div style="animation-delay: 0.5s;"
885                                    class="absolute -bottom-20 -left-20 w-48 h-48 rounded-full bg-gradient-to-tr from-sky-300/40 to-transparent blur-3xl op
885acity-40 group-hover:opacity-70 transform group-hover:scale-110 transition-all duration-700 animate-bounce">
886                                </div>
887
888                                <div
889                                    class="absolute inset-0 bg-gradient-to-r from-transparent via-sky-200/30 to-transparent transform -skew-x-12 translate-x-full group-hover:translate-x-[-200%] transition-transform duration-1000">
890                                </div>
891                            </div>
892
893                            <div class="p-10 relative z-10">
894                                <div class="flex flex-col items-center text-center">
895                                    <div class="relative mb-6">
896                                        <div
897                                            class="absolute inset-0 rounded-full border-2 border-sky-300/40 animate-ping">
898                                        </div>
899                                        <div style="animation-delay: 0.5s;"
900                                            class="absolute inset-0 rounded-full border border-sky-200/30 animate-pulse">
901                                        </div>
902
903                                        <div class="p-6 rounded-full backdrop-blur-xl border border-sky-300/50 
904                      bg-gradient-to-br from-white/90 to-white/70 shadow-2xl 
905                      transform group-hover:rotate-12 group-hover:scale-110 
906                      transition-all duration-500 hover:shadow-sky-300/40">
907                                            <div
908                                                class="transform group-hover:rotate-180 transition-transform duration-700">
909                                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
910                                                    stroke-width="1.5" stroke="currentColor"
911                                                    class="w-12 h-12 text-sky-500" aria-hidden="true">
912                                                    <path stroke-linecap="round" stroke-linejoin="round"
913                                                        stroke-width="1.5"
914                                                        d="M17.25 6.75 22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3-4.5 16.5" />
915                                                </svg>
916                                            </div>
917                                        </div>
918                                    </div>
919
920                                    <div class="mb-4 transform group-hover:scale-105 transition-transform duration-300">
921                                        <p
922                                            class="text-3xl font-bold bg-gradient-to-r from-sky-700 via-sky-600 to-sky-700 bg-clip-text text-transparent animate-pulse">
923                                            Viewable Source
924                                        </p>
925                                    </div>
926
927                                    <div class="space-y-1 max-w-sm">
928                                        <p class="text-sky-800 text-lg font-semibold leading-relaxed">
929                                            Fully auditable code. Verify everything yourself in a public repository.
930                                        </p>
931                                    </div>
932
933                                    <div
934                                        class="mt-6 w-1/3 h-0.5 bg-gradient-to-r from-transparent via-sky-400 to-transparent rounded-full transform group-hover:w-1/2 group-hover:h-1 transition-all duration-500 animate-pulse">
935                                    </div>
936
937                                    <div
938                                        class="flex space-x-2 mt-4 opacity-70 group-hover:opacity-100 transition-opacity duration-300">
939                                        <div class="w-2 h-2 bg-sky-400 rounded-full animate-bounce"></div>
940                                        <div style="animation-delay: 0.1s;"
941                                            class="w-2 h-2 bg-sky-500 rounded-full animate-bounce"></div>
942                                        <div style="animation-delay: 0.2s;"
943                                            class="w-2 h-2 bg-sky-600 rounded-full animate-bounce"></div>
944                                    </div>
945                                </div>
946                            </div>
947                        </div>
948                    </article>
949
950                    <!-- Animated Card -->
951                    <article
952                        class="group cursor-pointer transform transition-all duration-500 hover:scale-105 hover:-rotate-1">
953                        <div
954                            class="mx-auto text-sky-900 rounded-3xl border border-white/30 bg-gradient-to-br from-[#f0f9ff]/90 via-[#f0f9ff] to-[#e0f2fe]/90 shadow-2xl shadow-sky-200/50 duration-700 z-10 relative backdrop-blur-xl hover:border-sky-300/60 overflow-hidden hover:shadow-3xl hover:shadow-sky-300/40 w-[350px] bg-[#f0f9ff]/80">
955                            <div class="absolute inset-0 z-0 overflow-hidden">
956                                <div
957                                    class="absolute inset-0 bg-gradient-to-tr from-sky-200/20 to-sky-100/10 opacity-60 group-hover:opacity-80 transition-opacity duration-500">
958                                </div>
959
960                                <div style="animation-delay: 0.5s;"
961                                    class="absolute -bottom-20 -left-20 w-48 h-48 rounded-full bg-gradient-to-tr from-sky-300/40 to-transparent blur-3xl op
961acity-40 group-hover:opacity-70 transform group-hover:scale-110 transition-all duration-700 animate-bounce">
962                                </div>
963
964                                <div
965                                    class="absolute inset-0 bg-gradient-to-r from-transparent via-sky-200/30 to-transparent transform -skew-x-12 translate-x-full group-hover:translate-x-[-200%] transition-transform duration-1000">
966                                </div>
967                            </div>
968
969                            <div class="p-10 relative z-10">
970                                <div class="flex flex-col items-center text-center">
971                                    <div class="relative mb-6">
972                                        <div
973                                            class="absolute inset-0 rounded-full border-2 border-sky-300/40 animate-ping">
974                                        </div>
975                                        <div style="animation-delay: 0.5s;"
976                                            class="absolute inset-0 rounded-full border border-sky-200/30 animate-pulse">
977                                        </div>
978
979                                        <div class="p-6 rounded-full backdrop-blur-xl border border-sky-300/50 
980                      bg-gradient-to-br from-white/90 to-white/70 shadow-2xl 
981                      transform group-hover:rotate-12 group-hover:scale-110 
982                      transition-all duration-500 hover:shadow-sky-300/40">
983                                            <div
984                                                class="transform group-hover:rotate-180 transition-transform duration-700">
985                                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
986                                                    stroke-width="1.5" stroke="currentColor"
987                                                    class="w-12 h-12 text-sky-500" aria-hidden="true">
988                                                    <path stroke-linecap="round" stroke-linejoin="round"
989                                                        stroke-width="1.5"
990                                                        d="M12 9v3.75m0-10.036A11.959 11.959 0 0 1 3.598 6 11.99 11.99 0 0 0 3 9.75c0 5.592 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.57-.598-3.75h-.152c-3.196 0-6.1-1.25-8.25-3.286Zm0 13.036h.008v.008H12v-.008Z" />
991                                                </svg>
992
993                                            </div>
994                                        </div>
995                                    </div>
996
997                                    <div class="mb-4 transform group-hover:scale-105 transition-transform duration-300">
998                                        <p
999                                            class="text-3xl font-bold bg-gradient-to-r from-sky-700 via-sky-600 to-sky-700 bg-clip-text text-transparent animate-pulse">
1000                                            Clear Warnings
1001                                        </p>
1002                                    </div>
1003
1004                                    <div class="space-y-1 max-w-sm">
1005                                        <p class="text-sky-800 text-lg font-semibold leading-relaxed">
1006                                            Vivid block page with “Allow Once” and “Whitelist” options to tailor your
1007                                            experience.
1008                                        </p>
1009                                    </div>
1010
1011                                    <div
1012                                        class="mt-6 w-1/3 h-0.5 bg-gradient-to-r from-transparent via-sky-400 to-transparent rounded-full transform group-hover:w-1/2 group-hover:h-1 transition-all duration-500 animate-pulse">
1013                                    </div>
1014
1015                                    <div
1016                                        class="flex space-x-2 mt-4 opacity-70 group-hover:opacity-100 transition-opacity duration-300">
1017                                        <div class="w-2 h-2 bg-sky-4
101700 rounded-full animate-bounce"></div>
1018                                        <div style="animation-delay: 0.1s;"
1019                                            class="w-2 h-2 bg-sky-500 rounded-full animate-bounce"></div>
1020                                        <div style="animation-delay: 0.2s;"
1021                                            class="w-2 h-2 bg-sky-600 rounded-full animate-bounce"></div>
1022                                    </div>
1023                                </div>
1024                            </div>
1025                        </div>
1026                    </article>
1027
1028                </div>
1029            </div>
1030        </section>
1031
1032        <!-- Contact Form -->
1033        <section aria-labelledby="contact-heading" class="py-24 bg-gradient-to-b from-sky-50 to-white">
1034            <div class="max-w-3xl mx-auto px-6 text-center">
1035                <h2 id="contact-heading" class="text-4xl md:text-5xl font-extrabold text-slate-900 mb-6">Get in Touch
1036                </h2>
1037                <p class="text-lg text-gray-600 mb-12">Questions, comments, or just want to say, &ldquo;hi&rdquo;?
1038                    <br />We&rsquo;d
1039                    love to
1040                    hear
1041                    from you!
1042                </p>
1043
1044                <form method="POST" action="/contact-submit"
1045                    class="space-y-8 bg-white rounded-2xl shadow-xl p-10 border border-sky-200" novalidate>
1046                    <div>
1047                        <label for="name" class="block text-left text-sm font-medium text-slate-700 mb-2">Name</label>
1048                        <input type="text" id="name" name="name" required aria-required="true"
1049                            class="w-full px-5 py-4 rounded-xl border border-gray-300 focus:border-sky-500 focus:ring-4 focus:ring-primary/20"
1050                            placeholder="Jane Smith">
1051                    </div>
1052                    <div>
1053                        <label for="email" class="block text-left text-sm font-medium text-slate-700 mb-2">Email</label>
1054                        <input type="email" id="email" name="email" required aria-required="true"
1055                            class="w-full px-5 py-4 rounded-xl border border-gray-300 focus:border-sky-500 focus:ring-4 focus:ring-primary/20"
1056                            placeholder="[email protected]">
1057                    </div>
1058                    <div>
1059                        <label for="message"
1060                            class="block text-left text-sm font-medium text-slate-700 mb-2">Message</label>
1061                        <textarea id="message" name="message" rows="6" required aria-required="true"
1062                            class="w-full px-5 py-4 rounded-xl border border-gray-300 focus:border-sky-500 focus:ring-4 focus:ring-primary/20 resize-none"></textarea>
1063                    </div>
1064                    <button type="submit"
1065                        class="mx-auto inline-flex items-center gap-3 px-10 py-5 bg-sky-500 hover:bg-sky-600 text-zinc-950 hover:text-white font-bold text-lg rounded-xl shadow-lg hover:shadow-xl transition transform hover:-translate-y-1">
1066                        Send Message
1067                        <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" fill="none" viewBox="0 0 24 24"
1068                            stroke="currentColor" aria-hidden="true">
1069                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
1070                                d="M14 5l7 7m0 0l-7 7m7-7H3" />
1071                        </svg>
1072                    </button>
1073                </form>
1074            </div>
1075        </section>
1076
1077        <!-- FAQ -->
1078        <section aria-labelledby="faq-heading" class="py-24 bg-white">
1079            <div class="max-w-3xl mx-auto px-6">
1080                <h2 id="faq-heading" class="text-center text-4xl md:text-5xl font-bold text-dark mb-12">Frequently Asked
1081                    Questions</h2>
1082
1083                <div class="bg-white rounded-lg shadow-lg divide-y divide-gray-200">
1084
1085                    <!-- Item 1 -->
1086                    <div class="accordion-item">
1087                        <button
1088                            class="accordion-trigger w-full px-6 py-5 text-left flex justify-between items-center hover:bg-gray-50 transition group">
1089                            <span class="text-lg font-medium text-gray-900 group-hover:text-sky-500 transition">
1090                                When will OverPhish be released?
1091                            </span>
1092                            <svg class="w-5 h-5 text-gray-500 transition-transform duration-300 rotate-0 group-[.open]:rotate-180"
1093                                fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
1094                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
1095                                    d="M19 9l-7 7-7-7"></path>
1096                            </svg>
1097                        </button>
1098                        <div
1099                            class="accordion-panel overflow-hidden max-h-0 transition-all duration-300 ease-in-out px-6 pb-0">
1100                            <div class="pb-6 pt-2 text-gray-600 leading-relaxed">
1101                                It’s live right now! Install it directly from the <a
1102                                    href="https://chromewebstore.google.com/detail/overphish-phishing-domain/mapbfceckmkfnmecoadhfehmdpoomjoa"
1103                                    class="text-sky-500 font-semibold hover:underline" target="_blank"
1104                                    rel="noopener">Chrome Web
1105                                    Store</a>.
1106                            </div>
1107                        </div>
1108                    </div>
1109
1110                    <!-- Item 2 -->
1111                    <div class="accordion-item">
1112                        <button
1113                            class="accordion-trigger w-full px-6 py-5 text-left flex justify-between items-center hover:bg-gray-50 transition group">
1114                            <span class="text-lg font-medium text-gray-900 group-hover:text-indigo-600 transition">
1115                                Does OverPhish protection cost anything?
1116                            </span>
1117                            <svg class="w-5 h-5 text-gray-500 transition-transform duration-300 rotate-0 group-[.open]:rotate-180"
1118                                fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
1119                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
1120                                    d="M19 9l-7 7-7-7"></path>
1121                            </svg>
1122                        </button>
1123                        <div
1124                            class="accordion-panel overflow-hidden max-h-0 transition-all duration-300 ease-in-out px-6 pb-0">
1125                            <div class="pb-6 pt-2 text-gray-600 leading-relaxed">
1126                                Nope! Core protection is <strong>free forever</strong> and fully auditable.
1127                            </div>
1128                        </div>
1129                    </div>
1130
1131                    <!-- Item 3 -->
1132                    <div class="accordion-item">
1133                        <button
1134                            class="accordion-trigger w-full px-6 py-5 text-left flex justify-between items-center hover:bg-gray-50 transition group">
1135                            <span class="text-lg font-medium text-gray-900 group-hover:text-indigo-600 transition">
1136                                Which browsers will be supported?
1137                            </span>
1138                            <svg class="w-5 h-5 text-gray-500 transition-transform duration-300 rotate-0 group-[.open]:rotate-180"
1139                                fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
1140                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
1141                                    d="M19 9l-7 7-7-7"></path>
1142                            </svg>
1143                        </button>
1144                        <div
1145                            class="accordion-panel overflow-hidden max-h-0 transition-all duration-300 ease-in-out px-6 pb-0">
1146                            <div class="pb-6 pt-2 text-gray-600 leading-relaxed">
1147                                Chrome, Firefox, Edge, Brave, and all Chromium-based browsers at launch. Safari support
1148                                planned.
1149                            </div>
1150                        </div>
1151                    </div>
1152
1153                    <!-- Item 4 -->
1154                    <div class="accordion-item">
1155                        <button
1156                            class="accordion-trigger w-full px-6 py-5 text-left flex justify-between items-center hover:bg-gray-50 transition group">
1157                            <span class="text-lg font-medium text-gray-900 group-hover:text-indigo-600 transition">
1158                                Does OverPhish collect any data?
1159                            </span>
1160                            <svg class="w-5 h-5 text-gray-500 transition-transform duration-300 rotate-0 group-[.open]:rotate-180"
1161                                fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
1162                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
1163                                    d="M19 9l-7 7-7-7"></path>
1164                            </svg>
1165                        </button>
1166                        <div
1167                            class="accordion-panel overflow-hidden max-h-0 transition-all duration-300 ease-in-out px-6 pb-0">
1168                            <div class="pb-6 pt-2 text-gray-600 leading-relaxed">
1169                                Absolutely not. OverPhish runs <strong>100% locally</strong> and never phones home
1170                                except
1171                                for blocklist updates.
1172                            </div>
1173                        </div>
1174                    </div>
1175                </div>
1176            </div>
1177        </section>
1178    </main>
1179
1180    <!-- Footer -->
1181    <footer class="border-t border-gray-200 bg-linear-to-br from-zinc-500 to-zinc-800">
1182        <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
1183            <div class="h-full flex flex-col items-start gap-12 pt-16 pb-6 lg:flex-row lg:items-center lg:py-16">
1184
1185                <!-- Left column: Brand + social + privacy/made-with -->
1186                <div class="w-full flex flex-col">
1187
1188                    <!-- Social links (styled like target nav but with icons) -->
1189                    <nav class="flex gap-6" aria-label="Social media links">
1190                        <a href="https://github.com/overphish"
1191                            class="relative -mx-3 -my-2 rounded-lg px-3 py-2 text-white transition-colors delay-150 hover:text-sky-500 hover:delay-0"
1192                            target="_blank" rel="noopener" aria-label="GitHub">
1193                            <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
1194                                class="bi bi-github" viewBox="0 0 16 16">
1195                                <path
1196                                    d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8">
1197                                </path>
1198                            </svg>
1199                        </a>
1200                        <a href="https://x.com/overphish"
1201                            class="relative -mx-3 -my-2 rounded-lg px-3 py-2 text-white transition-colors delay-150 hover:text-sky-500 hover:delay-0"
1202                            target="_blank" rel="noopener" aria-label="Twitter / X">
1203                            <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
1204                                class="bi bi-twitter-x" viewBox="0 0 16 16">
1205                                <path
1206                                    d="M12.6.75h2.454l-5.36 6.142L16 15.25h-4.937l-3.867-5.07-4.425 5.07H.316l5.733-6.57L0 .75h5.063l3.495 4.633L12.601.75Zm-.86 13.028h1.36L4.323 2.145H2.865z">
1207                                </path>
1208                            </svg>
1209                        </a>
1210                    </nav>
1211
1212                    <hr class="mt-8 border-zinc-500" />
1213
1214                    <!-- Privacy + Made-with (moved here to stay visible and clean) -->
1215                    <div class="mt-8 sm:flex-row justify-start text-sm text-white">
1216                        <a href="/privacy-policy/" class="hover:text-sky-500 transition"
1217                            rel="privacy-policy">Privacy&nbsp;Policy</a>
1218                    </div>
1219                </div>
1220
1221                <!-- Right column: Decorative framed logo (replaces the QR/app section) -->
1222                <div
1223                    class="flex flex-col group relative flex items-center self-stretch p-4 transition-colors bg-sky-50 hover:bg-sky-100 shadow-lg/90 sm:self-auto rounded-xl sm:rounded-2xl lg:mx-0 lg:self-auto lg:p-6">
1224                    <div class="text-center">
1225                        <p class="text-base font-semibold">OverPhish</p>
1226                    </div>
1227                    <div class="relative flex h-24 w-24 flex-none items-center justify-center">
1228                        <!-- OverPhish logo (larger, centered inside frame) -->
1229                        <img src="https://overphish.app/logo.png" alt="OverPhish logo" loading="lazy" width="100"
1230                            height="100" class="h-20 w-20 object-contain">
1231                    </div>
1232                    <div class="text-center">
1233                        <p class="mt-1 text-sm text-gray-500">Privacy-first Phishing Protection</p>
1234                    </div>
1235                </div>
1236            </div>
1237
1238            <!-- Bottom bar: Newsletter + copyright (exactly like target) -->
1239            <div
1240                class="flex flex-col items-center border-t border-zinc-300 pt-8 pb-12 md:flex-row-reverse md:justify-between md:pt-6">
1241                <div class="made-with items-center text-sm text-zinc-400">
1242                    Made with
1243                    <svg xmlns="http://www.w3.org/2000/svg" class="bi bi-balloon-heart mx-1 inline-block heart-balloon"
1244                        width="24" height="24" fill="currentColor" viewBox="0 0 16 16">
1245                        <path fill-rule="evenodd"
1246                            d="m8 2.42-.717-.737c-1.13-1.161-3.243-.777-4.01.72-.35.685-.451 1.707.236 3.062C4.16 6.753 5.52 8.32 8 10.042c2.479-1.723 3.839-3.29 4.491-4.577.687-1.355.587-2.377.236-3.061-.767-1.498-2.88-1.882-4.01-.721zm-.49 8.5c-10.78-7.44-3-13.155.359-10.063q.068.062.132.129.065-.067.132-.129c3.36-3.092 11.137 2.624.357 10.063l.235.468a.25.25 0 1 1-.448.224l-.008-.017c.008.11.02.202.037.29.054.27.161.488.419 1.003.288.578.235 1.15.076 1.629-.157.469-.422.867-.588 1.115l-.004.007a.25.25 0 1 1-.416-.278c.168-.252.4-.6.533-1.003.133-.396.163-.824-.049-1.246l-.013-.028c-.24-.48-.38-.758-.448-1.102a3 3 0 0 1-.052-.45l-.04.08a.25.25 0 1 1-.447-.224l.235-.468ZM6.013 2.06c-.649-.18-1.483.083-1.85.798-.131.258-.245.689-.08 1.335.063.244.414.198.487-.043.21-.697.627-1.447 1.359-1.692.217-.073.304-.337.084-.398">
1247                        </path>
1248                    </svg>
1249                    by the
1250                    <a href="https://unityper.com/" target="_blank" rel="noopener noreferrer nofollow"
1251                        class="mx-1 font-semibold text-sky-400 hover:text-sky-300"
1252                        title="Professional web design and development services.">
1253                        Unityper Agency
1254                    </a>
1255                    for a safer internet.
1256                </div>
1257                <p class="mt-6 text-sm text-zinc-400 md:mt-0">
1258                    © 2025 - 2026 <strong>OverPhish Team</strong>. All rights reserved.
1259                </p>
1260            </div>
1261        </div>
1262    </footer>
1263    
1263<script>
1264        document.querySelectorAll('.accordion-trigger').forEach(trigger => {
1265            trigger.addEventListener('click', () => {
1266                const item = trigger.parentElement;
1267                const panel = trigger.nextElementSibling;
1268                const inner = panel.firstElementChild;
1269                const isOpen = item.classList.toggle('open');
1270                if (isOpen) {
1271                    panel.style.maxHeight = inner.offsetHeight + 48 + 'px';
1272                } else {
1273                    panel.style.maxHeight = '0';
1274                }
1275                document.querySelectorAll('.accordion-item').forEach(other => {
1276                    if (other !== item) {
1277                        other.classList.remove('open');
1278                        other.querySelector('.accordion-panel').style.maxHeight = '0';
1279                    }
1280                });
1281            });
1282        });
1283    </script>
vendor: 1 bytes, line 1283
1283
1284<script>(function(){function c(){var b=a.contentDocument||(a.contentWindow&&a.contentWindow.document);if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'a43fd9857e1537b9',t:'MTc5MDkwMzY2MA=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
1284<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"23e5c6aa630548de8e617113d3fec774","r":1,"spa":2}' crossorigin="anonymous"></script>
1284
1285</body>
1286
1287</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.