@innovastudio/contentbuilder 1.5.198 → 1.5.200

package/public/contentbuilder/content.css

@@ -126,6 +126,10 @@
   box-sizing: border-box;
 }
 
+.row {
+  position: relative;
+}
+
 .column {
   position: relative;
   box-sizing: border-box;
@@ -210,6 +214,13 @@
     float: right;
   }
 }
+/* nested */
+.column .row {
+  gap: 2rem;
+  margin: 0 -1rem;
+  /* Compensate for parent column padding */
+}
+
 .is-row-overlay {
   position: absolute;
   top: 0;
@@ -230,7 +241,17 @@
   flex-shrink: initial;
 }
 
+@media (max-width: 970px) {
+  .is-container .row {
+    flex-wrap: wrap;
+  }
+}
 /* Responsive Utility */
+@media (max-width: 970px) {
+  .row[style*=gap] {
+    gap: 0 !important;
+  }
+}
 @media all and (max-width: 760px) {
   .is-container .flow-reverse {
     display: flex;
@@ -1386,11 +1407,14 @@
 /* -------- UTILITY -------- */
 .is-container {
   /* reset */
-  /* border */
+  /* Border Width */
+  /* Individual sides */
+  /* Border Style */
+  /* Border Colors */
+  /* Hover Border Colors */
+  /* Border Radius */
   /* Text Formatting */
-  /* colors */
   /* text colors */
-  /* width */
   /* space between */
   /* Overide Bootstrap */
 }
@@ -1401,23 +1425,68 @@
   border-style: solid;
   border-color: #e5e7eb;
 }
-.is-container .border-solid {
-  border-style: solid;
-}
-.is-container .border-none {
-  border-style: none;
-}
 .is-container .border {
   border-width: 1px;
 }
 .is-container .border-0 {
-  border-width: 0px;
+  border-width: 0;
 }
 .is-container .border-2 {
   border-width: 2px;
 }
-.is-container .border-gray-900 {
-  border-color: #111827;
+.is-container .border-4 {
+  border-width: 4px;
+}
+.is-container .border-8 {
+  border-width: 8px;
+}
+.is-container .border-t {
+  border-top-width: 1px;
+}
+.is-container .border-r {
+  border-right-width: 1px;
+}
+.is-container .border-b {
+  border-bottom-width: 1px;
+}
+.is-container .border-l {
+  border-left-width: 1px;
+}
+.is-container .border-t-0 {
+  border-top-width: 0;
+}
+.is-container .border-r-0 {
+  border-right-width: 0;
+}
+.is-container .border-b-0 {
+  border-bottom-width: 0;
+}
+.is-container .border-l-0 {
+  border-left-width: 0;
+}
+.is-container .border-t-2 {
+  border-top-width: 2px;
+}
+.is-container .border-r-2 {
+  border-right-width: 2px;
+}
+.is-container .border-b-2 {
+  border-bottom-width: 2px;
+}
+.is-container .border-l-2 {
+  border-left-width: 2px;
+}
+.is-container .border-solid {
+  border-style: solid;
+}
+.is-container .border-dashed {
+  border-style: dashed;
+}
+.is-container .border-dotted {
+  border-style: dotted;
+}
+.is-container .border-none {
+  border-style: none;
 }
 .is-container .border-transparent {
   border-color: transparent;
@@ -1425,12 +1494,84 @@
 .is-container .border-current {
   border-color: currentColor;
 }
+.is-container .border-white {
+  border-color: #ffffff;
+}
+.is-container .border-black {
+  border-color: #000000;
+}
+.is-container .border-gray-50 {
+  border-color: #f9fafb;
+}
+.is-container .border-gray-100 {
+  border-color: #f3f4f6;
+}
+.is-container .border-gray-200 {
+  border-color: #e5e7eb;
+}
+.is-container .border-gray-300 {
+  border-color: #d1d5db;
+}
+.is-container .border-gray-400 {
+  border-color: #9ca3af;
+}
+.is-container .border-gray-500 {
+  border-color: #6b7280;
+}
+.is-container .border-gray-600 {
+  border-color: #4b5563;
+}
+.is-container .border-gray-700 {
+  border-color: #374151;
+}
+.is-container .border-gray-800 {
+  border-color: #1f2937;
+}
+.is-container .border-gray-900 {
+  border-color: #111827;
+}
 .is-container .hover\:border-transparent:hover {
   border-color: transparent !important;
 }
 .is-container .hover\:border-current:hover {
   border-color: currentColor !important;
 }
+.is-container .hover\:border-white:hover {
+  border-color: #ffffff;
+}
+.is-container .hover\:border-black:hover {
+  border-color: #000000;
+}
+.is-container .hover\:border-gray-50:hover {
+  border-color: #f9fafb;
+}
+.is-container .hover\:border-gray-100:hover {
+  border-color: #f3f4f6;
+}
+.is-container .hover\:border-gray-200:hover {
+  border-color: #e5e7eb;
+}
+.is-container .hover\:border-gray-300:hover {
+  border-color: #d1d5db;
+}
+.is-container .hover\:border-gray-400:hover {
+  border-color: #9ca3af;
+}
+.is-container .hover\:border-gray-500:hover {
+  border-color: #6b7280;
+}
+.is-container .hover\:border-gray-600:hover {
+  border-color: #4b5563;
+}
+.is-container .hover\:border-gray-700:hover {
+  border-color: #374151;
+}
+.is-container .hover\:border-gray-800:hover {
+  border-color: #1f2937;
+}
+.is-container .hover\:border-gray-900:hover {
+  border-color: #111827;
+}
 .is-container .rounded-none {
   border-radius: 0px;
 }
@@ -1521,6 +1662,21 @@
 .is-container .normal-case {
   text-transform: none !important;
 }
+.is-container .underline-offset-0 {
+  text-underline-offset: 0px;
+}
+.is-container .underline-offset-1 {
+  text-underline-offset: 1px;
+}
+.is-container .underline-offset-2 {
+  text-underline-offset: 2px;
+}
+.is-container .underline-offset-4 {
+  text-underline-offset: 4px;
+}
+.is-container .underline-offset-8 {
+  text-underline-offset: 8px;
+}
 .is-container .text-left {
   text-align: left;
 }
@@ -1709,100 +1865,6 @@
 .is-container .leading-30 {
   line-height: 3 !important;
 }
-.is-container .bg-transparent {
-  background-color: transparent;
-}
-.is-container .bg-current {
-  background-color: currentColor;
-}
-.is-container .bg-black {
-  --tw-bg-opacity: 1;
-  background-color: rgb(0 0 0/var(--tw-bg-opacity));
-}
-.is-container .bg-white {
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-50 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(249 250 251/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-100 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(243 244 246/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-200 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(229 231 235/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-300 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(209 213 219/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-400 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(156 163 175/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(107 114 128/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-600 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(75 85 99/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-700 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(55 65 81/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-800 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(31 41 55/var(--tw-bg-opacity));
-}
-.is-container .bg-gray-900 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(17 24 39/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-50:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(249 250 251/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-100:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(243 244 246/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-200:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(229 231 235/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-300:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(209 213 219/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-400:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(156 163 175/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-500:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(107 114 128/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-600:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(75 85 99/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-700:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(55 65 81/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-800:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(31 41 55/var(--tw-bg-opacity));
-}
-.is-container .hover\:bg-gray-900:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(17 24 39/var(--tw-bg-opacity));
-}
 .is-container .text-transparent {
   color: transparent;
 }
@@ -1810,242 +1872,100 @@
   color: currentColor;
 }
 .is-container .text-black {
-  --tw-text-opacity: 1;
-  color: rgb(0 0 0/var(--tw-text-opacity));
+  color: black;
 }
 .is-container .text-white {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255/var(--tw-text-opacity));
+  color: white;
 }
 .is-container .text-gray-50 {
-  --tw-text-opacity: 1;
-  color: rgb(249 250 251/var(--tw-text-opacity));
+  color: #f9fafb;
 }
 .is-container .text-gray-100 {
-  --tw-text-opacity: 1;
-  color: rgb(243 244 246/var(--tw-text-opacity));
+  color: #f3f4f6;
 }
 .is-container .text-gray-200 {
-  --tw-text-opacity: 1;
-  color: rgb(229 231 235/var(--tw-text-opacity));
+  color: #e5e7eb;
 }
 .is-container .text-gray-300 {
-  --tw-text-opacity: 1;
-  color: rgb(209 213 219/var(--tw-text-opacity));
+  color: #d1d5db;
 }
 .is-container .text-gray-400 {
-  --tw-text-opacity: 1;
-  color: rgb(156 163 175/var(--tw-text-opacity));
+  color: #9ca3af;
 }
 .is-container .text-gray-500 {
-  --tw-text-opacity: 1;
-  color: rgb(107 114 128/var(--tw-text-opacity));
+  color: #6b7280;
 }
 .is-container .text-gray-600 {
-  --tw-text-opacity: 1;
-  color: rgb(75 85 99/var(--tw-text-opacity));
+  color: #4b5563;
 }
 .is-container .text-gray-700 {
-  --tw-text-opacity: 1;
-  color: rgb(55 65 81/var(--tw-text-opacity));
+  color: #374151;
 }
 .is-container .text-gray-800 {
-  --tw-text-opacity: 1;
-  color: rgb(31 41 55/var(--tw-text-opacity));
+  color: #1f2937;
 }
 .is-container .text-gray-900 {
-  --tw-text-opacity: 1;
-  color: rgb(17 24 39/var(--tw-text-opacity));
-}
-.is-container .hover\:text-white:hover {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255/var(--tw-text-opacity)) !important;
-}
-.is-container .hover\:text-black:hover {
-  --tw-text-opacity: 1;
-  color: rgb(0 0 0/var(--tw-text-opacity)) !important;
-}
-.is-container .hover\:text-current:hover {
-  color: currentColor !important;
-}
-.is-container .w-full {
-  width: 100%;
-}
-.is-container .w-screen {
-  width: 100vw;
-}
-.is-container .w-1\/2 {
-  width: 50%;
-}
-.is-container .w-1\/3 {
-  width: 33.333333%;
-}
-.is-container .w-2\/3 {
-  width: 66.666667%;
-}
-.is-container .w-1\/4 {
-  width: 25%;
-}
-.is-container .w-2\/4 {
-  width: 50%;
-}
-.is-container .w-3\/4 {
-  width: 75%;
-}
-.is-container .w-1\/5 {
-  width: 20%;
-}
-.is-container .w-2\/5 {
-  width: 40%;
-}
-.is-container .w-3\/5 {
-  width: 60%;
-}
-.is-container .w-4\/5 {
-  width: 80%;
+  color: #111827;
 }
-.is-container .w-1\/6 {
-  width: 16.666667%;
-}
-.is-container .w-2\/6 {
-  width: 33.333333%;
-}
-.is-container .w-3\/6 {
-  width: 50%;
-}
-.is-container .w-4\/6 {
-  width: 66.666667%;
-}
-.is-container .w-5\/6 {
-  width: 83.333333%;
-}
-.is-container .w-1\/12 {
-  width: 8.333333%;
-}
-.is-container .w-2\/12 {
-  width: 16.666667%;
-}
-.is-container .w-3\/12 {
-  width: 25%;
-}
-.is-container .w-4\/12 {
-  width: 33.333333%;
-}
-.is-container .w-5\/12 {
-  width: 41.666667%;
-}
-.is-container .w-6\/12 {
-  width: 50%;
-}
-.is-container .w-7\/12 {
-  width: 58.333333%;
-}
-.is-container .w-8\/12 {
-  width: 66.666667%;
-}
-.is-container .w-9\/12 {
-  width: 75%;
-}
-.is-container .w-10\/12 {
-  width: 83.333333%;
-}
-.is-container .w-11\/12 {
-  width: 91.666667%;
+.is-container .text-gray-950 {
+  color: #030712;
 }
 .is-container .space-x-0 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(0px * var(--tw-space-x-reverse));
-  margin-left: calc(0px * (1 - var(--tw-space-x-reverse)));
+  margin-left: 0rem;
 }
 .is-container .space-x-1 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
-  margin-left: calc(0.25rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 0.25rem;
 }
 .is-container .space-x-2 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
-  margin-left: calc(0.5rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 0.5rem;
 }
 .is-container .space-x-3 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(0.75rem * var(--tw-space-x-reverse));
-  margin-left: calc(0.75rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 0.75rem;
 }
 .is-container .space-x-4 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(1rem * var(--tw-space-x-reverse));
-  margin-left: calc(1rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 1rem;
 }
 .is-container .space-x-5 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(1.25rem * var(--tw-space-x-reverse));
-  margin-left: calc(1.25rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 1.25rem;
 }
 .is-container .space-x-6 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(1.5rem * var(--tw-space-x-reverse));
-  margin-left: calc(1.5rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 1.5rem;
 }
 .is-container .space-x-7 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(1.75rem * var(--tw-space-x-reverse));
-  margin-left: calc(1.75rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 1.75rem;
 }
 .is-container .space-x-8 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(2rem * var(--tw-space-x-reverse));
-  margin-left: calc(2rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 2rem;
 }
 .is-container .space-x-10 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(2.5rem * var(--tw-space-x-reverse));
-  margin-left: calc(2.5rem * (1 - var(--tw-space-x-reverse)));
+  margin-left: 2.5rem;
 }
 .is-container .space-y-0 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(0px * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(0px * var(--tw-space-y-reverse));
+  margin-top: 0rem;
 }
 .is-container .space-y-1 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(0.25rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
+  margin-top: 0.25rem;
 }
 .is-container .space-y-2 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(0.5rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
+  margin-top: 0.5rem;
 }
 .is-container .space-y-3 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(0.75rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
+  margin-top: 0.75rem;
 }
 .is-container .space-y-4 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(1rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
+  margin-top: 1rem;
 }
 .is-container .space-y-5 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(1.25rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
+  margin-top: 1.25rem;
 }
 .is-container .space-y-6 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(1.5rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
+  margin-top: 1.5rem;
 }
 .is-container .space-y-8 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(2rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
+  margin-top: 2rem;
 }
 .is-container .space-y-10 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(2.5rem * (1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(2.5rem * var(--tw-space-y-reverse));
+  margin-top: 2.5rem;
 }
 .is-container a[role=button].px-0 {
   padding-left: 0px !important;
@@ -3770,108 +3690,808 @@
   align-items: stretch;
 }
 
-/* height */
-.h-auto {
-  height: auto;
+/* width */
+.w-full {
+  width: 100%;
 }
 
-.h-full {
-  height: 100%;
+.w-screen {
+  width: 100vw;
 }
 
-.h-screen {
-  height: 100vw;
+.w-1\/2 {
+  width: 50%;
 }
 
-/* others */
-.whitespace-nowrap {
-  white-space: nowrap;
+.w-1\/3 {
+  width: 33.333333%;
 }
 
-.text-base {
-  font-size: 1rem;
-  line-height: 1.5rem;
+.w-2\/3 {
+  width: 66.666667%;
 }
 
-.transition-all {
-  transition-property: all;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
+.w-1\/4 {
+  width: 25%;
 }
 
-.cursor-pointer {
-  cursor: pointer;
+.w-2\/4 {
+  width: 50%;
 }
 
-.relative {
-  position: relative;
+.w-3\/4 {
+  width: 75%;
 }
 
-.grow {
-  flex-grow: 1;
+.w-1\/5 {
+  width: 20%;
 }
 
-/* --- BACKWARD COMPATIBILITY --- */
-/* Snippets: text */
-.is-title1-96 {
-  margin-top: 20px;
-  margin-bottom: 20px;
+.w-2\/5 {
+  width: 40%;
 }
 
-.is-title1-80 {
-  margin-top: 15px;
-  margin-bottom: 15px;
+.w-3\/5 {
+  width: 60%;
 }
 
-.is-title1-64 {
-  margin-top: 15px;
-  margin-bottom: 15px;
+.w-4\/5 {
+  width: 80%;
 }
 
-.is-title1-48 {
-  margin-top: 15px;
-  margin-bottom: 15px;
+.w-1\/6 {
+  width: 16.666667%;
 }
 
-.is-title1-32 {
-  margin-top: 15px;
-  margin-bottom: 15px;
+.w-2\/6 {
+  width: 33.333333%;
 }
 
-.is-title2-96 {
-  margin-top: 25px;
-  margin-bottom: 20px;
+.w-3\/6 {
+  width: 50%;
 }
 
-.is-title2-80 {
-  margin-top: 20px;
-  margin-bottom: 15px;
+.w-4\/6 {
+  width: 66.666667%;
 }
 
-.is-title2-64 {
-  margin-top: 20px;
-  margin-bottom: 15px;
+.w-5\/6 {
+  width: 83.333333%;
 }
 
-.is-title2-48 {
-  margin-top: 15px;
-  margin-bottom: 15px;
+.w-1\/12 {
+  width: 8.333333%;
 }
 
-.is-title2-32 {
-  margin-top: 10px;
-  margin-bottom: 15px;
+.w-2\/12 {
+  width: 16.666667%;
 }
 
-.is-title3-96 {
-  margin-top: 30px;
-  margin-bottom: 35px;
-  padding: 20px 0;
-  border-top: #000 2px solid;
-  border-bottom: #000 2px solid;
+.w-3\/12 {
+  width: 25%;
 }
 
-.is-title3-80 {
+.w-4\/12 {
+  width: 33.333333%;
+}
+
+.w-5\/12 {
+  width: 41.666667%;
+}
+
+.w-6\/12 {
+  width: 50%;
+}
+
+.w-7\/12 {
+  width: 58.333333%;
+}
+
+.w-8\/12 {
+  width: 66.666667%;
+}
+
+.w-9\/12 {
+  width: 75%;
+}
+
+.w-10\/12 {
+  width: 83.333333%;
+}
+
+.w-11\/12 {
+  width: 91.666667%;
+}
+
+.w-2 {
+  width: 0.5rem;
+}
+
+/* height */
+.h-auto {
+  height: auto;
+}
+
+.h-full {
+  height: 100%;
+}
+
+.h-screen {
+  height: 100vw;
+}
+
+.h-2 {
+  height: 0.5rem;
+}
+
+/* others */
+.whitespace-nowrap {
+  white-space: nowrap;
+}
+
+.text-base {
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+
+.relative {
+  position: relative;
+}
+
+.grow {
+  flex-grow: 1;
+}
+
+.object-cover {
+  object-fit: cover;
+}
+
+/* Basic image helper */
+/* colors */
+.bg-transparent {
+  background-color: transparent;
+}
+
+.bg-current {
+  background-color: currentColor;
+}
+
+.bg-black {
+  background-color: black;
+}
+
+.bg-white {
+  background-color: white;
+}
+
+.bg-gray-50 {
+  background-color: #f9fafb;
+}
+
+.bg-gray-100 {
+  background-color: #f3f4f6;
+}
+
+.bg-gray-200 {
+  background-color: #e5e7eb;
+}
+
+.bg-gray-300 {
+  background-color: #d1d5db;
+}
+
+.bg-gray-400 {
+  background-color: #9ca3af;
+}
+
+.bg-gray-500 {
+  background-color: #6b7280;
+}
+
+.bg-gray-600 {
+  background-color: #4b5563;
+}
+
+.bg-gray-700 {
+  background-color: #374151;
+}
+
+.bg-gray-800 {
+  background-color: #1f2937;
+}
+
+.bg-gray-900 {
+  background-color: #111827;
+}
+
+/* ============================================
+    CSS Variables - Default Values
+    ============================================ */
+* {
+  --anim-translate-x: 0;
+  --anim-translate-y: 0;
+  --anim-rotate: 0;
+  --anim-skew-x: 0;
+  --anim-skew-y: 0;
+  --anim-scale-x: 1;
+  --anim-scale-y: 1;
+}
+
+.transition-none {
+  transition-property: none;
+}
+
+.transition {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-timing-function: ease;
+  transition-duration: 400ms;
+}
+
+.transition-colors {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-timing-function: ease;
+  transition-duration: 400ms;
+}
+
+.transition-opacity {
+  transition-property: opacity;
+  transition-timing-function: ease;
+  transition-duration: 400ms;
+}
+
+.transition-shadow {
+  transition-property: box-shadow;
+  transition-timing-function: ease;
+  transition-duration: 400ms;
+}
+
+.transition-transform {
+  transition-property: transform;
+  transition-timing-function: ease;
+  transition-duration: 400ms;
+}
+
+.transition-all {
+  transition-property: all;
+  transition-timing-function: ease;
+  transition-duration: 400ms;
+}
+
+/* Durations */
+.duration-75 {
+  transition-duration: 75ms;
+}
+
+.duration-100 {
+  transition-duration: 100ms;
+}
+
+.duration-150 {
+  transition-duration: 150ms;
+}
+
+.duration-200 {
+  transition-duration: 200ms;
+}
+
+.duration-300 {
+  transition-duration: 300ms;
+}
+
+.duration-400 {
+  transition-duration: 400ms;
+}
+
+.duration-500 {
+  transition-duration: 500ms;
+}
+
+.duration-600 {
+  transition-duration: 600ms;
+}
+
+.duration-700 {
+  transition-duration: 700ms;
+}
+
+.duration-800 {
+  transition-duration: 800ms;
+}
+
+.duration-900 {
+  transition-duration: 900ms;
+}
+
+.duration-1000 {
+  transition-duration: 1000ms;
+}
+
+.duration-1200 {
+  transition-duration: 1200ms;
+}
+
+.duration-1500 {
+  transition-duration: 1500ms;
+}
+
+/* Timing functions (ease utilities) */
+.ease-linear {
+  transition-timing-function: linear;
+}
+
+.ease-out {
+  transition-timing-function: cubic-bezier(0, 0, 0.58, 1);
+}
+
+.ease-in {
+  transition-timing-function: cubic-bezier(0.32, 0, 1, 1);
+}
+
+.ease-in-out {
+  transition-timing-function: cubic-bezier(0.32, 0, 0.58, 1);
+}
+
+/* Delays */
+.delay-75 {
+  transition-delay: 75ms;
+}
+
+.delay-100 {
+  transition-delay: 100ms;
+}
+
+.delay-150 {
+  transition-delay: 150ms;
+}
+
+.delay-200 {
+  transition-delay: 200ms;
+}
+
+.delay-300 {
+  transition-delay: 300ms;
+}
+
+.delay-500 {
+  transition-delay: 500ms;
+}
+
+/* Hover Transforms */
+.hover\:scale-105:hover {
+  transform: translate(var(--anim-translate-x), var(--anim-translate-y)) rotate(var(--anim-rotate)) skewX(var(--anim-skew-x)) skewY(var(--anim-skew-y)) scaleX(var(--anim-scale-x)) scaleY(var(--anim-scale-y));
+  --anim-scale-x: 1.05;
+  --anim-scale-y: 1.05;
+}
+
+.hover\:-translate-y-1:hover {
+  transform: translate(var(--anim-translate-x), var(--anim-translate-y)) rotate(var(--anim-rotate)) skewX(var(--anim-skew-x)) skewY(var(--anim-skew-y)) scaleX(var(--anim-scale-x)) scaleY(var(--anim-scale-y));
+  --anim-translate-y: -0.25rem;
+  /* -4px */
+}
+
+.hover\:-translate-y-2:hover {
+  transform: translate(var(--anim-translate-x), var(--anim-translate-y)) rotate(var(--anim-rotate)) skewX(var(--anim-skew-x)) skewY(var(--anim-skew-y)) scaleX(var(--anim-scale-x)) scaleY(var(--anim-scale-y));
+  --anim-translate-y: -0.5rem;
+  /* -8px */
+}
+
+.hover\:translate-x-1:hover {
+  transform: translate(var(--anim-translate-x), var(--anim-translate-y)) rotate(var(--anim-rotate)) skewX(var(--anim-skew-x)) skewY(var(--anim-skew-y)) scaleX(var(--anim-scale-x)) scaleY(var(--anim-scale-y));
+  --anim-translate-x: 0.25rem;
+  /* 4px */
+}
+
+.hover\:translate-x-2:hover {
+  transform: translate(var(--anim-translate-x), var(--anim-translate-y)) rotate(var(--anim-rotate)) skewX(var(--anim-skew-x)) skewY(var(--anim-skew-y)) scaleX(var(--anim-scale-x)) scaleY(var(--anim-scale-y));
+  --anim-translate-x: 0.5rem;
+  /* 8px */
+}
+
+/* Hover Shadows */
+.hover\:shadow-sm:hover {
+  box-shadow: 0 2px 8px -2px rgba(0, 0, 0, 0.06);
+}
+
+.hover\:shadow:hover {
+  box-shadow: 0 4px 12px -3px rgba(0, 0, 0, 0.07);
+}
+
+.hover\:shadow-md:hover {
+  box-shadow: 0 8px 20px -5px rgba(0, 0, 0, 0.07);
+}
+
+.hover\:shadow-lg:hover {
+  box-shadow: 0 12px 30px -8px rgba(0, 0, 0, 0.08);
+}
+
+.hover\:shadow-xl:hover {
+  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.08);
+}
+
+.hover\:shadow-2xl:hover {
+  box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.09);
+}
+
+/* Hover Background Colors */
+.hover\:bg-white:hover {
+  background-color: #ffffff;
+}
+
+.hover\:bg-black:hover {
+  background-color: #000000;
+}
+
+.hover\:bg-gray-50:hover {
+  background-color: #f9fafb;
+}
+
+.hover\:bg-gray-100:hover {
+  background-color: #f3f4f6;
+}
+
+.hover\:bg-gray-200:hover {
+  background-color: #e5e7eb;
+}
+
+.hover\:bg-gray-300:hover {
+  background-color: #d1d5db;
+}
+
+.hover\:bg-gray-400:hover {
+  background-color: #9ca3af;
+}
+
+.hover\:bg-gray-500:hover {
+  background-color: #6b7280;
+}
+
+.hover\:bg-gray-600:hover {
+  background-color: #4b5563;
+}
+
+.hover\:bg-gray-700:hover {
+  background-color: #374151;
+}
+
+.hover\:bg-gray-800:hover {
+  background-color: #1f2937;
+}
+
+.hover\:bg-gray-900:hover {
+  background-color: #111827;
+}
+
+.hover\:bg-transparent:hover {
+  background-color: transparent;
+}
+
+/* Hover Text Color */
+.hover\:text-white:hover {
+  color: white !important;
+}
+
+.hover\:text-black:hover {
+  color: black !important;
+}
+
+.hover\:text-current:hover {
+  color: currentColor !important;
+}
+
+.hover\:text-gray-50:hover {
+  color: #f9fafb;
+}
+
+.hover\:text-gray-100:hover {
+  color: #f3f4f6;
+}
+
+.hover\:text-gray-200:hover {
+  color: #e5e7eb;
+}
+
+.hover\:text-gray-300:hover {
+  color: #d1d5db;
+}
+
+.hover\:text-gray-400:hover {
+  color: #9ca3af;
+}
+
+.hover\:text-gray-500:hover {
+  color: #6b7280;
+}
+
+.hover\:text-gray-600:hover {
+  color: #4b5563;
+}
+
+.hover\:text-gray-700:hover {
+  color: #374151;
+}
+
+.hover\:text-gray-800:hover {
+  color: #1f2937;
+}
+
+.hover\:text-gray-900:hover {
+  color: #111827;
+}
+
+.hover\:text-gray-950:hover {
+  color: #030712;
+}
+
+/* Hover Opacity */
+.hover\:opacity-0:hover {
+  opacity: 0 !important;
+}
+
+.hover\:opacity-5:hover {
+  opacity: 0.05 !important;
+}
+
+.hover\:opacity-10:hover {
+  opacity: 0.1 !important;
+}
+
+.hover\:opacity-20:hover {
+  opacity: 0.2 !important;
+}
+
+.hover\:opacity-25:hover {
+  opacity: 0.25 !important;
+}
+
+.hover\:opacity-30:hover {
+  opacity: 0.3 !important;
+}
+
+.hover\:opacity-40:hover {
+  opacity: 0.4 !important;
+}
+
+.hover\:opacity-50:hover {
+  opacity: 0.5 !important;
+}
+
+.hover\:opacity-60:hover {
+  opacity: 0.6 !important;
+}
+
+.hover\:opacity-70:hover {
+  opacity: 0.7 !important;
+}
+
+.hover\:opacity-75:hover {
+  opacity: 0.75 !important;
+}
+
+.hover\:opacity-80:hover {
+  opacity: 0.8 !important;
+}
+
+.hover\:opacity-90:hover {
+  opacity: 0.9 !important;
+}
+
+.hover\:opacity-95:hover {
+  opacity: 0.95 !important;
+}
+
+.hover\:opacity-100:hover {
+  opacity: 1 !important;
+}
+
+/* Overflow */
+.overflow-hidden {
+  overflow: hidden;
+}
+
+.overflow-visible {
+  overflow: visible;
+}
+
+.overflow-scroll {
+  overflow: scroll;
+}
+
+.overflow-auto {
+  overflow: auto;
+}
+
+/* Built in keyframes and animation classes matching Tailwind defaults */
+/* spin */
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+.animate-spin {
+  animation: spin 1s linear infinite;
+}
+
+/* ping */
+@keyframes ping {
+  75%, 100% {
+    transform: scale(2);
+    opacity: 0;
+  }
+}
+.animate-ping {
+  animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
+}
+
+/* pulse */
+@keyframes pulse {
+  0%, 100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.5;
+  }
+}
+.animate-pulse {
+  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+}
+
+/* bounce */
+@keyframes bounce {
+  0%, 100% {
+    transform: translateY(-25%);
+    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
+  }
+  50% {
+    transform: translateY(0);
+    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+  }
+}
+.animate-bounce {
+  animation: bounce 1s infinite;
+}
+
+/* Gap (Flexbox & Grid) */
+.gap-0 {
+  gap: 0;
+}
+
+.gap-px {
+  gap: 1px;
+}
+
+.gap-0\.5 {
+  gap: 0.125rem;
+  /* 2px */
+}
+
+.gap-1 {
+  gap: 0.25rem;
+  /* 4px */
+}
+
+.gap-1\.5 {
+  gap: 0.375rem;
+  /* 6px */
+}
+
+.gap-2 {
+  gap: 0.5rem;
+  /* 8px */
+}
+
+.gap-2\.5 {
+  gap: 0.625rem;
+  /* 10px */
+}
+
+.gap-3 {
+  gap: 0.75rem;
+  /* 12px */
+}
+
+.gap-3\.5 {
+  gap: 0.875rem;
+  /* 14px */
+}
+
+.gap-4 {
+  gap: 1rem;
+  /* 16px */
+}
+
+.gap-5 {
+  gap: 1.25rem;
+  /* 20px */
+}
+
+.gap-6 {
+  gap: 1.5rem;
+  /* 24px */
+}
+
+.gap-7 {
+  gap: 1.75rem;
+  /* 28px */
+}
+
+.gap-8 {
+  gap: 2rem;
+  /* 32px */
+}
+
+.gap-9 {
+  gap: 2.25rem;
+  /* 36px */
+}
+
+/* --- BACKWARD COMPATIBILITY --- */
+/* Snippets: text */
+.is-title1-96 {
+  margin-top: 20px;
+  margin-bottom: 20px;
+}
+
+.is-title1-80 {
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+.is-title1-64 {
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+.is-title1-48 {
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+.is-title1-32 {
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+.is-title2-96 {
+  margin-top: 25px;
+  margin-bottom: 20px;
+}
+
+.is-title2-80 {
+  margin-top: 20px;
+  margin-bottom: 15px;
+}
+
+.is-title2-64 {
+  margin-top: 20px;
+  margin-bottom: 15px;
+}
+
+.is-title2-48 {
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+
+.is-title2-32 {
+  margin-top: 10px;
+  margin-bottom: 15px;
+}
+
+.is-title3-96 {
+  margin-top: 30px;
+  margin-bottom: 35px;
+  padding: 20px 0;
+  border-top: #000 2px solid;
+  border-bottom: #000 2px solid;
+}
+
+.is-title3-80 {
   margin-top: 25px;
   margin-bottom: 33px;
   padding: 20px 0;
@@ -6873,6 +7493,86 @@ a.is-btn-ghost2 {
   height: 100%;
 }
 
+.is-container.size-16 p {
+  font-size: 16px;
+}
+
+.is-container.size-17 p {
+  font-size: 17px;
+}
+
+.is-container.size-18 p {
+  font-size: 18px;
+}
+
+.is-container.size-19 p {
+  font-size: 19px;
+}
+
+.is-container.size-20 p {
+  font-size: 20px;
+}
+
+.is-container.size-21 p {
+  font-size: 21px;
+}
+
+@media all and (max-width: 1800px) {
+  .is-container.size-16.v2:not(.v3) p {
+    font-size: 0.99vw;
+    font-size: clamp(16px, 0.99vw, 0.99vw);
+  }
+
+  .is-container.size-17.v2:not(.v3) p {
+    font-size: 1.05vw;
+    font-size: clamp(17px, 1.05vw, 1.05vw);
+  }
+
+  .is-container.size-18.v2:not(.v3) p {
+    font-size: 1.11vw;
+    font-size: clamp(18px, 1.11vw, 1.11vw);
+  }
+
+  .is-container.size-19.v2:not(.v3) p {
+    font-size: 1.17vw;
+    font-size: clamp(19px, 1.17vw, 1.17vw);
+  }
+
+  .is-container.size-20.v2:not(.v3) p {
+    font-size: 1.23vw;
+    font-size: clamp(20px, 1.23vw, 1.23vw);
+  }
+
+  .is-container.size-21.v2:not(.v3) p {
+    font-size: 1.29vw;
+    font-size: clamp(21px, 1.29vw, 1.29vw);
+  }
+}
+@media all and (min-width: 1921px) {
+  .is-container.size-16.v2:not(.v3) p {
+    font-size: 0.83vw;
+  }
+
+  .is-container.size-17.v2:not(.v3) p {
+    font-size: 0.89vw;
+  }
+
+  .is-container.size-18.v2:not(.v3) p {
+    font-size: 0.94vw;
+  }
+
+  .is-container.size-19.v2:not(.v3) p {
+    font-size: 0.99vw;
+  }
+
+  .is-container.size-20.v2:not(.v3) p {
+    font-size: 1.04vw;
+  }
+
+  .is-container.size-21.v2:not(.v3) p {
+    font-size: 1.09vw;
+  }
+}
 /* --------------------------------- */
 /* leading */
 .is-container.leading-none p, .is-container.leading-none td, .is-container.leading-none li, .is-container.leading-none label {