..

components/unsorted/night-all-AtAgVQfS.html

@@ -0,0 +1,87 @@
+<div><section class="relative overflow-hidden">
+    <div class="container px-4 mx-auto">
+      <div class="flex items-center justify-between pt-6 -m-2">
+        <div class="w-auto p-2">
+          <div class="flex flex-wrap items-center">
+            <div class="w-auto">
+              <a class="relative z-10 inline-block" href="#">
+                <img src="nightsable-assets/logos/logo.svg" alt="">
+              </a>
+            </div>
+          </div>
+        </div>
+        <div class="w-auto p-2">
+          <div class="flex flex-wrap items-center">
+            <div class="w-auto hidden lg:block">
+              <ul class="flex items-center mr-12">
+                <li class="mr-12 text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">Home</a></li>
+                <li class="mr-12 text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">About us</a></li>
+                <li class="mr-12 text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">Wallet</a></li>
+                <li class="text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">Blog</a></li>
+              </ul>
+            </div>
+            <div class="w-auto hidden lg:block">
+              <div class="inline-block"><a class="inline-block px-8 py-4 text-white hover:text-black tracking-tighter hover:bg-green-400 border-2 border-white focus:border-green-400 focus:border-opacity-40 hover:border-green-400 focus:ring-4 focus:ring-green-400 focus:ring-opacity-40 rounded-full transition duration-300" href="#">Get in touch</a></div>
+            </div>
+            <div class="w-auto lg:hidden">
+              <a class="relative z-10 inline-block" href="#">
+                <svg class="navbar-burger text-green-500" width="51" height="51" viewbox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
+                  <rect width="56" height="56" rx="28" fill="currentColor"></rect>
+                  <path d="M37 32H19M37 24H19" stroke="black" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
+                </svg>
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="hidden navbar-menu fixed top-0 left-0 bottom-0 w-4/6 sm:max-w-xs z-50">
+      <div class="navbar-backdrop fixed inset-0 bg-gray-800 opacity-80"></div>
+      <nav class="relative z-10 px-9 pt-8 h-full overflow-y-auto">
+        <div class="flex flex-wrap justify-between h-full">
+          <div class="w-full">
+            <div class="flex items-center justify-between -m-2">
+              <div class="w-auto p-2">
+                <a class="inline-block" href="#">
+                  <img src="nightsable-assets/logos/logo.svg" alt="">
+                </a>
+              </div>
+              <div class="w-auto p-2">
+                <a class="navbar-burger inline-block text-white" href="#">
+                  <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M6 18L18 6M6 6L18 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+                  </svg>
+                </a>
+              </div>
+            </div>
+          </div>
+          <div class="flex flex-col justify-center py-16 w-full">
+            <ul>
+              <li class="mb-8 text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">Home</a></li>
+              <li class="mb-8 text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">About us</a></li>
+              <li class="mb-8 text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">Wallet</a></li>
+              <li class="text-white font-medium hover:text-opacity-90 tracking-tighter"><a href="#">Blog</a></li>
+            </ul>
+          </div>
+          <div class="flex flex-col justify-end w-full pb-8"><a class="inline-block px-8 py-4 text-center text-white hover:text-black tracking-tighter hover:bg-green-400 border-2 border-white focus:border-green-400 focus:border-opacity-40 hover:border-green-400 focus:ring-4 focus:ring-green-400 focus:ring-opacity-40 rounded-full transition duration-300" href="#">Get in touch</a></div>
+        </div>
+      </nav>
+    </div>
+    <div class="relative pt-20 lg:pt-28">
+      <div class="relative z-10 container px-4 mx-auto">
+        <div class="relative mb-24 text-center md:max-w-4xl mx-auto">
+          <img class="absolute top-44 -left-36" src="nightsable-assets/images/headers/star2.svg" alt="">
+          <img class="absolute top-10 -right-36" src="nightsable-assets/images/headers/star2.svg" alt="">
+          <span class="inline-block mb-2.5 text-sm text-green-400 font-medium tracking-tighter">Nightsable Card</span>
+          <h1 class="mb-10 text-7xl lg:text-8xl xl:text-10xl text-white tracking-tighter">Making credit history with nightcard</h1>
+          <a class="inline-block px-8 py-4 tracking-tighter bg-green-400 hover:bg-green-500 text-black focus:ring-4 focus:ring-green-500 focus:ring-opacity-40 rounded-full transition duration-300" href="#">Start now</a>
+        </div>
+        <div class="relative max-w-max mx-auto">
+          <img src="nightsable-assets/images/headers/card-half.png" alt="">
+          <img class="absolute top-7 -right-64" src="nightsable-assets/images/headers/star.svg" alt="">
+        </div>
+      </div>
+    </div>
+    <img class="absolute top-0 left-48" src="nightsable-assets/images/headers/layer-blur.svg" alt="">
+    <img class="absolute bottom-0 right-0" src="nightsable-assets/images/headers/lines2.svg" alt="">
+  </section> </div>

components/unsorted/night-all-AwjGgaoW.html

@@ -0,0 +1,18 @@
+<div> <section class="relative py-24 overflow-hidden">
+    <div class="container px-4 mx-auto">
+      <div class="flex flex-wrap -m-8">
+        <div class="w-full md:w-1/2 p-8">
+          <div class="relative z-10 md:max-w-md">
+            <span class="inline-block mb-4 text-sm text-green-400 font-medium tracking-tighter">Nightsable Card</span>
+            <h2 class="mb-6 text-7xl text-white tracking-tighter-xl">Making credit history with nightcard</h2>
+            <p class="mb-10 text-white text-opacity-60 md:max-w-xs">Nightsable is a strategic branding agency focused on brand creation, rebrands, and brand</p>
+            <a class="inline-block px-8 py-4 tracking-tighter bg-green-400 hover:bg-green-500 text-black focus:ring-4 focus:ring-green-500 focus:ring-opacity-40 rounded-full transition duration-300" href="#">Start now</a>
+          </div>
+        </div>
+        <div class="w-full md:w-1/2 p-8">
+          <img class="md:mr-0" src="nightsable-assets/images/features/card.png" alt="">
+        </div>
+      </div>
+    </div>
+    <img class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2" src="nightsable-assets/images/features/bg-blur.png" alt="">
+  </section></div>

components/unsorted/night-all-ByaXjVvl.html

@@ -0,0 +1,145 @@
+<div><section class="py-24 overflow-hidden">
+    <div class="container px-4 mx-auto">
+      <div class="mb-20 md:max-w-2xl text-center mx-auto">
+        <span class="inline-block mb-4 text-sm text-green-400 font-medium tracking-tighter">Nightsable Card</span>
+        <h2 class="mb-8 text-7xl lg:text-8xl text-white tracking-7xl lg:tracking-8xl">Compare our plans</h2>
+        <p class="mb-12 text-white max-w-sm mx-auto">Nightsable is a strategic branding agency focused on brand creation, rebrands, and brand</p>
+        <div class="relative p-1 max-w-max mx-auto bg-gradient-radial-dark-light rounded-full">
+          <input class="custom-switch-2 opacity-0 absolute top-0 left-0 z-10 w-full h-full" type="checkbox">
+          <div class="flex flex-wrap items-center">
+            <div class="w-full sm:w-auto"><a class="custom-switch-btn-1 block py-5 px-9 text-center bg-white text-black focus:ring-4 focus:ring-white focus:ring-opacity-40 font-medium rounded-full" href="#">Monthly billing</a></div>
+            <div class="flex-1">
+              <a class="custom-switch-btn-2 flex flex-wrap items-center justify-center py-3.5 px-9 text-center rounded-full" href="#">
+                <p class="mr-2.5 text-gray-300 font-medium">Annual billing</p>
+                <span class="px-3 py-1.5 text-sm font-medium text-center text-green-400 uppercase border border-green-400 rounded-full">Save 20%</span>
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="flex flex-wrap items-center -m-4">
+        <div class="w-full md:w-1/2 lg:w-1/3 p-4">
+          <div class="px-8 pt-12 pb-12 h-full bg-gradient-radial-dark overflow-hidden rounded-5xl">
+            <p class="mb-2 text-lg text-white font-light">Basic</p>
+            <p class="mb-6 text-gray-300">During this phase the design is developed to meet the required technical standards to</p>
+            <p class="mb-7 text-white font-medium text-5xl">
+              <span>$10</span>
+              <span class="text-base font-medium text-gray-300">/ month</span>
+            </p>
+            <a class="mb-7 block px-14 py-4 text-white hover:text-black text-center font-medium tracking-2xl border-2 border-white hover:border-green-400 hover:bg-green-400 focus:ring-4 focus:ring-green-400 focus:ring-opacity-40 rounded-full transition duration-300" href="#">Start now</a>
+            <p class="mb-4 text-xs text-gray-300 font-light uppercase">What's includes</p>
+            <ul>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Core engagement survey</p>
+              </li>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Topic-based assessments</p>
+              </li>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Custom topic-based assessments</p>
+              </li>
+              <li class="flex items-center">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Filterable heatmap & analytics</p>
+              </li>
+            </ul>
+          </div>
+        </div>
+        <div class="w-full md:w-1/2 lg:w-1/3 p-4">
+          <div class="relative pt-12 pb-20 px-8 h-full bg-gradient-radial-light overflow-hidden rounded-5xl">
+            <img class="absolute top-0 left-0 w-full" src="nightsable-assets/images/pricing/shadow-yellow.png" alt="">
+            <p class="mb-2 text-lg text-white font-light">Business</p>
+            <p class="mb-6 text-gray-300">During this phase the design is developed to meet the required technical standards to</p>
+            <div class="flex flex-wrap items-center -m-3 mb-3">
+              <div class="w-auto p-3">
+                <p class="text-white font-medium text-5xl">
+                  <span>$25</span>
+                  <span class="text-base font-medium text-gray-300">/ month</span>
+                </p>
+              </div>
+              <div class="w-auto p-3">
+                <span class="px-3 py-1 text-sm text-green-400 font-medium border border-green-400 rounded-full">-20%</span>
+              </div>
+            </div>
+            <a class="mb-9 block px-14 py-4 text-center font-medium tracking-2xl border-2 border-green-400 bg-green-400 hover:bg-green-500 text-black focus:ring-4 focus:ring-green-500 focus:ring-opacity-40 rounded-full transition duration-300" href="#">Start now</a>
+            <p class="mb-4 text-xs text-gray-300 font-light uppercase">What's includes</p>
+            <ul>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Core engagement survey</p>
+              </li>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Topic-based assessments</p>
+              </li>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Custom topic-based assessments</p>
+              </li>
+              <li class="flex items-center">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Filterable heatmap & analytics</p>
+              </li>
+            </ul>
+          </div>
+        </div>
+        <div class="w-full lg:w-1/3 p-4">
+          <div class="px-8 pt-12 pb-12 h-full bg-gradient-radial-dark overflow-hidden rounded-5xl">
+            <p class="mb-2 text-lg text-white font-light">Premium</p>
+            <p class="mb-6 text-gray-300">During this phase the design is developed to meet the required technical standards to</p>
+            <p class="mb-7 text-white font-medium text-5xl">
+              <span>$10</span>
+              <span class="text-base font-medium text-gray-300">/ month</span>
+            </p>
+            <a class="mb-7 block px-14 py-4 text-white hover:text-black text-center font-medium tracking-2xl border-2 border-white hover:border-green-400 hover:bg-green-400 focus:ring-4 focus:ring-green-400 focus:ring-opacity-40 rounded-full transition duration-300" href="#">Start now</a>
+            <p class="mb-4 text-xs text-gray-300 font-light uppercase">What's includes</p>
+            <ul>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Core engagement survey</p>
+              </li>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Topic-based assessments</p>
+              </li>
+              <li class="flex items-center mb-4">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Custom topic-based assessments</p>
+              </li>
+              <li class="flex items-center">
+                <div class="flex items-center justify-center w-5 h-5 mr-4 border border-green-400 rounded-full">
+                  <img src="nightsable-assets/images/modals/check.svg" alt="">
+                </div>
+                <p class="text-white">Filterable heatmap & analytics</p>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section> </div>

components/unsorted/night-all-CbrnflEu.html

@@ -0,0 +1,37 @@
+<div><section class="py-20 overflow-hidden">
+    <div class="container px-4 mx-auto">
+      <div class="text-center mb-20">
+        <span class="inline-block mb-4 text-sm text-green-400 font-medium tracking-tighter">NightsableCard</span>
+        <h2 class="mb-6 text-7xl lg:text-8xl text-white tracking-8xl md:max-w-md mx-auto">Protecting you and your money</h2>
+        <p class="text-gray-300 md:max-w-md mx-auto">Nightsable is a strategic branding agency focused on brand creation, rebrands, and brand</p>
+      </div>
+      <div class="flex flex-wrap">
+        <div class="w-full md:w-1/2 p-5">
+          <div class="p-12 lg:p-16 border border-gray-900 rounded-5xl">
+            <h2 class="mb-6 text-5xl text-white tracking-5xl">Safeguarded with leading banks</h2>
+            <p class="mb-24 lg:mb-56 text-lg text-white text-opacity-60">For most currencies, there are no limits to the transfer amount. Certain currencies might have limits set by our payments partners. You will always see the limit in the Revolut app before making the transfer.</p>
+            <a class="group inline-flex items-center" href="#">
+              <span class="mr-3.5 text-white font-medium underline">Learn more</span>
+              <svg class="transform group-hover:rotate-90 transition duration-300" width="13" height="12" viewbox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M11.5 0.75L1 11.25" stroke="white" stroke-width="1.43182" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
+                <path d="M11.5 10.3781V0.75H1.87187" stroke="white" stroke-width="1.43182" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
+              </svg>
+            </a>
+          </div>
+        </div>
+        <div class="w-full md:w-1/2 p-5">
+          <div class="p-12 lg:p-16 border border-gray-900 rounded-5xl">
+            <h2 class="mb-6 text-5xl text-white tracking-5xl">Safeguarded with leading banks</h2>
+            <p class="mb-24 lg:mb-56 text-lg text-white text-opacity-60">For most currencies, there are no limits to the transfer amount. Certain currencies might have limits set by our payments partners. You will always see the limit in the Revolut app before making the transfer.</p>
+            <a class="group inline-flex items-center" href="#">
+              <span class="mr-3.5 text-white font-medium underline">Learn more</span>
+              <svg class="transform group-hover:rotate-90 transition duration-300" width="13" height="12" viewbox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M11.5 0.75L1 11.25" stroke="white" stroke-width="1.43182" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
+                <path d="M11.5 10.3781V0.75H1.87187" stroke="white" stroke-width="1.43182" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section> </div>