npm - @westpac/ui - Versions diffs - 0.2.0 → 0.3.0 - Mend

@westpac/ui 0.2.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (696) hide show

package/dist/css/westpac-ui.min.css CHANGED Viewed

@@ -387,6 +387,9 @@ video {
   --colors-text-80: 70, 73, 81;
   --colors-text-90: 47, 50, 59;
   --colors-text: 24, 27, 37;
+  --colors-pictogram-dark: 31, 28, 79;
+  --colors-pictogram-duo-highlight: 218, 23, 16;
+  --colors-pictogram-duo-outline: 31, 28, 79;
   --fontFamily-brand-0: Westpac;
   --fontFamily-brand-1: -apple-system;
   --fontFamily-brand-2: BlinkMacSystemFont;
@@ -551,6 +554,9 @@ video {
   --colors-text-80: 77, 53, 113;
   --colors-text-90: 54, 27, 96;
   --colors-text: 32, 2, 78;
+  --colors-pictogram-dark: 83, 72, 145;
+  --colors-pictogram-duo-highlight: 160, 148, 252;
+  --colors-pictogram-duo-outline: 83, 72, 145;
 }.theme-bsa, [data-theme="bsa"] {
   --fontFamily-brand-0: Aller;
   --fontFamily-brand-1: -apple-system;
@@ -705,6 +711,9 @@ video {
   --colors-text-80: 92, 92, 92;
   --colors-text-90: 71, 71, 71;
   --colors-text: 51, 51, 51;
+  --colors-pictogram-dark: 0, 47, 108;
+  --colors-pictogram-duo-highlight: 0, 173, 189;
+  --colors-pictogram-duo-outline: 0, 47, 108;
 }.theme-btfg, [data-theme="btfg"] {
   --fontFamily-brand-0: Georgia, "Times New Roman", Times, serif;
   --fontFamily-brand-1: -apple-system;
@@ -859,6 +868,9 @@ video {
   --colors-text-80: 92, 92, 92;
   --colors-text-90: 71, 71, 71;
   --colors-text: 51, 51, 51;
+  --colors-pictogram-dark: 37, 116, 169;
+  --colors-pictogram-duo-highlight: 158, 0, 93;
+  --colors-pictogram-duo-outline: 37, 116, 169;
 }.theme-rams, [data-theme="rams"] {
   --fontFamily-brand-0: Source Sans Pro;
   --fontFamily-brand-1: -apple-system;
@@ -1013,6 +1025,9 @@ video {
   --colors-text-80: 92, 92, 92;
   --colors-text-90: 71, 71, 71;
   --colors-text: 51, 51, 51;
+  --colors-pictogram-dark: 4, 125, 188;
+  --colors-pictogram-duo-highlight: 120, 195, 57;
+  --colors-pictogram-duo-outline: 4, 125, 188;
 }.theme-stg, [data-theme="stg"] {
   --fontFamily-brand-0: Dragon Bold;
   --fontFamily-brand-1: -apple-system;
@@ -1167,6 +1182,9 @@ video {
   --colors-text-80: 51, 109, 92;
   --colors-text-90: 26, 90, 71;
   --colors-text: 0, 72, 51;
+  --colors-pictogram-dark: 0, 72, 51;
+  --colors-pictogram-duo-highlight: 120, 190, 32;
+  --colors-pictogram-duo-outline: 0, 72, 51;
 }.theme-wbc, [data-theme="wbc"] {
   --fontFamily-brand-0: Westpac;
   --fontFamily-brand-1: -apple-system;
@@ -1321,6 +1339,9 @@ video {
   --colors-text-80: 70, 73, 81;
   --colors-text-90: 47, 50, 59;
   --colors-text: 24, 27, 37;
+  --colors-pictogram-dark: 31, 28, 79;
+  --colors-pictogram-duo-highlight: 218, 23, 16;
+  --colors-pictogram-duo-outline: 31, 28, 79;
 }.theme-wbg, [data-theme="wbg"] {
   --fontFamily-brand-0: Montserrat;
   --fontFamily-brand-1: -apple-system;
@@ -1475,6 +1496,9 @@ video {
   --colors-text-80: 51, 51, 51;
   --colors-text-90: 26, 26, 26;
   --colors-text: 0, 0, 0;
+  --colors-pictogram-dark: 0, 0, 0;
+  --colors-pictogram-duo-highlight: 145, 151, 154;
+  --colors-pictogram-duo-outline: 0, 0, 0;
 }*, ::before, ::after {
   --tw-border-spacing-x: 0;
   --tw-border-spacing-y: 0;
@@ -1720,6 +1744,8 @@ video {
   pointer-events: none;
 }.static {
   position: static;
+}.fixed {
+  position: fixed;
 }.absolute {
   position: absolute;
 }.relative {
@@ -1730,12 +1756,71 @@ video {
   right: 0.1875rem;
 }.top-\[0\.1875rem\] {
   top: 0.1875rem;
+}.isolate {
+  isolation: isolate;
 }.z-10 {
   z-index: 10;
+}.col-span-1 {
+  grid-column: span 1 / span 1;
+}.col-span-10 {
+  grid-column: span 10 / span 10;
+}.col-span-11 {
+  grid-column: span 11 / span 11;
+}.col-span-12 {
+  grid-column: span 12 / span 12;
+}.col-span-2 {
+  grid-column: span 2 / span 2;
+}.col-span-3 {
+  grid-column: span 3 / span 3;
+}.col-span-4 {
+  grid-column: span 4 / span 4;
+}.col-span-5 {
+  grid-column: span 5 / span 5;
+}.col-span-6 {
+  grid-column: span 6 / span 6;
+}.col-span-7 {
+  grid-column: span 7 / span 7;
+}.col-span-8 {
+  grid-column: span 8 / span 8;
+}.col-span-9 {
+  grid-column: span 9 / span 9;
+}.col-start-1 {
+  grid-column-start: 1;
+}.col-start-10 {
+  grid-column-start: 10;
+}.col-start-11 {
+  grid-column-start: 11;
+}.col-start-12 {
+  grid-column-start: 12;
+}.col-start-2 {
+  grid-column-start: 2;
+}.col-start-3 {
+  grid-column-start: 3;
+}.col-start-4 {
+  grid-column-start: 4;
+}.col-start-5 {
+  grid-column-start: 5;
+}.col-start-6 {
+  grid-column-start: 6;
+}.col-start-7 {
+  grid-column-start: 7;
+}.col-start-8 {
+  grid-column-start: 8;
+}.col-start-9 {
+  grid-column-start: 9;
 }.float-left {
   float: left;
 }.m-0 {
   margin: 0;
+}.mx-\[0\.75rem\] {
+  margin-left: 0.75rem;
+  margin-right: 0.75rem;
+}.mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}.my-0 {
+  margin-top: 0;
+  margin-bottom: 0;
 }.mb-1 {
   margin-bottom: 0.375rem;
 }.mb-2 {
@@ -1744,6 +1829,8 @@ video {
   margin-bottom: 1.5rem;
 }.mb-\[-1px\] {
   margin-bottom: -1px;
+}.ml-1 {
+  margin-left: 0.375rem;
 }.ml-\[0\.4em\] {
   margin-left: 0.4em;
 }.mr-1 {
@@ -1756,22 +1843,34 @@ video {
   margin-right: -1px;
 }.mr-\[0\.4em\] {
   margin-right: 0.4em;
+}.mt-10 {
+  margin-top: 3.75rem;
+}.mt-2 {
+  margin-top: 0.75rem;
 }.mt-\[-1px\] {
   margin-top: -1px;
 }.box-border {
   box-sizing: border-box;
+}.box-content {
+  box-sizing: content-box;
 }.block {
   display: block;
 }.inline-block {
   display: inline-block;
+}.inline {
+  display: inline;
 }.flex {
   display: flex;
 }.inline-flex {
   display: inline-flex;
+}.table {
+  display: table;
 }.grid {
   display: grid;
 }.hidden {
   display: none;
+}.h-13 {
+  height: 4.875rem;
 }.h-15 {
   height: 5.625rem;
 }.h-2 {
@@ -1786,12 +1885,76 @@ video {
   height: 2.25rem;
 }.h-8 {
   height: 3rem;
+}.h-\[0\.625rem\] {
+  height: 0.625rem;
+}.h-\[1\.5rem\] {
+  height: 1.5rem;
+}.h-\[1\.75rem\] {
+  height: 1.75rem;
+}.h-\[2\.125rem\] {
+  height: 2.125rem;
+}.h-\[2\.5rem\] {
+  height: 2.5rem;
+}.h-\[2\.875rem\] {
+  height: 2.875rem;
+}.h-\[200px\] {
+  height: 200px;
+}.h-\[26px\] {
+  height: 26px;
+}.h-\[28px\] {
+  height: 28px;
+}.h-\[32px\] {
+  height: 32px;
+}.h-\[37px\] {
+  height: 37px;
+}.h-\[38px\] {
+  height: 38px;
+}.h-\[39px\] {
+  height: 39px;
+}.h-\[41px\] {
+  height: 41px;
+}.h-\[42px\] {
+  height: 42px;
+}.h-\[44px\] {
+  height: 44px;
+}.h-\[48px\] {
+  height: 48px;
+}.h-\[50px\] {
+  height: 50px;
+}.h-\[51px\] {
+  height: 51px;
+}.h-\[54px\] {
+  height: 54px;
+}.h-\[58px\] {
+  height: 58px;
+}.h-\[62px\] {
+  height: 62px;
+}.h-\[64px\] {
+  height: 64px;
+}.h-\[65px\] {
+  height: 65px;
+}.h-\[70px\] {
+  height: 70px;
+}.h-\[88px\] {
+  height: 88px;
+}.h-auto {
+  height: auto;
+}.h-full {
+  height: 100%;
 }.min-h-\[3\.375rem\] {
   min-height: 3.375rem;
 }.min-h-\[4\.125rem\] {
   min-height: 4.125rem;
 }.min-h-\[4\.5rem\] {
   min-height: 4.5rem;
+}.w-10 {
+  width: 3.75rem;
+}.w-12 {
+  width: 4.5rem;
+}.w-13 {
+  width: 4.875rem;
+}.w-14 {
+  width: 5.25rem;
 }.w-2 {
   width: 0.75rem;
 }.w-23 {
@@ -1806,15 +1969,57 @@ video {
   width: 2.25rem;
 }.w-8 {
   width: 3rem;
+}.w-\[116px\] {
+  width: 116px;
+}.w-\[122px\] {
+  width: 122px;
+}.w-\[150px\] {
+  width: 150px;
+}.w-\[160px\] {
+  width: 160px;
+}.w-\[170px\] {
+  width: 170px;
+}.w-\[180px\] {
+  width: 180px;
+}.w-\[200px\] {
+  width: 200px;
+}.w-\[213px\] {
+  width: 213px;
+}.w-\[233px\] {
+  width: 233px;
+}.w-\[26px\] {
+  width: 26px;
+}.w-\[32px\] {
+  width: 32px;
+}.w-\[54px\] {
+  width: 54px;
+}.w-\[60px\] {
+  width: 60px;
+}.w-\[64px\] {
+  width: 64px;
+}.w-\[67px\] {
+  width: 67px;
+}.w-\[69px\] {
+  width: 69px;
+}.w-\[80px\] {
+  width: 80px;
+}.w-\[90px\] {
+  width: 90px;
+}.w-\[99px\] {
+  width: 99px;
 }.w-fit {
   width: -moz-fit-content;
   width: fit-content;
 }.w-full {
   width: 100%;
+}.max-w-container {
+  max-width: 1320px;
 }.flex-1 {
   flex: 1 1 0%;
 }.flex-none {
   flex: none;
+}.shrink-0 {
+  flex-shrink: 0;
 }.-rotate-90 {
   --tw-rotate: -90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1833,6 +2038,16 @@ video {
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
+}.grid-flow-row {
+  grid-auto-flow: row;
+}.auto-rows-\[minmax\(32px\2c auto\)\] {
+  grid-auto-rows: minmax(32px,auto);
+}.grid-cols-4 {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+}.grid-cols-5 {
+  grid-template-columns: repeat(5, minmax(0, 1fr));
+}.grid-cols-\[repeat\(12\2c _1fr\)\] {
+  grid-template-columns: repeat(12, 1fr);
 }.flex-row {
   flex-direction: row;
 }.flex-col {
@@ -1841,6 +2056,10 @@ video {
   flex-wrap: wrap;
 }.items-center {
   align-items: center;
+}.items-baseline {
+  align-items: baseline;
+}.justify-end {
+  justify-content: flex-end;
 }.justify-center {
   justify-content: center;
 }.justify-between {
@@ -1849,8 +2068,20 @@ video {
   gap: 0.375rem;
 }.gap-2 {
   gap: 0.75rem;
+}.gap-5 {
+  gap: 1.875rem;
 }.gap-\[2px\] {
   gap: 2px;
+}.space-x-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.75rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
+}.space-y-1 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
+}.self-center {
+  align-self: center;
 }.overflow-hidden {
   overflow: hidden;
 }.overflow-visible {
@@ -1863,6 +2094,18 @@ video {
   white-space: pre-wrap;
 }.rounded {
   border-radius: 0.25rem;
+}.rounded-\[0\.625rem\] {
+  border-radius: 0.625rem;
+}.rounded-\[1\.5rem\] {
+  border-radius: 1.5rem;
+}.rounded-\[1\.75rem\] {
+  border-radius: 1.75rem;
+}.rounded-\[2\.125rem\] {
+  border-radius: 2.125rem;
+}.rounded-\[2\.5rem\] {
+  border-radius: 2.5rem;
+}.rounded-\[2\.875rem\] {
+  border-radius: 2.875rem;
 }.rounded-full {
   border-radius: 9999px;
 }.rounded-none {
@@ -1879,6 +2122,9 @@ video {
   border-top-right-radius: 0.1875rem;
 }.border {
   border-width: 1px;
+}.border-x-0 {
+  border-left-width: 0px;
+  border-right-width: 0px;
 }.border-y {
   border-top-width: 1px;
   border-bottom-width: 1px;
@@ -1888,16 +2134,24 @@ video {
   border-bottom-width: 0px;
 }.border-b-4 {
   border-bottom-width: 4px;
+}.border-b-\[1px\] {
+  border-bottom-width: 1px;
+}.border-b-\[3px\] {
+  border-bottom-width: 3px;
 }.border-l-4 {
   border-left-width: 4px;
 }.border-l-5 {
   border-left-width: 0.3125rem;
+}.border-l-\[6px\] {
+  border-left-width: 6px;
 }.border-r {
   border-right-width: 1px;
 }.border-r-0 {
   border-right-width: 0px;
 }.border-t {
   border-top-width: 1px;
+}.border-t-0 {
+  border-top-width: 0px;
 }.border-dashed {
   border-style: dashed;
 }.border-border {
@@ -1936,6 +2190,10 @@ video {
 }.border-warning-50 {
   --tw-border-opacity: 1;
   border-color: rgb(226 157 128 / var(--tw-border-opacity));
+}.border-x-border {
+  --tw-border-opacity: 1;
+  border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  border-right-color: rgba(var(--colors-border), var(--tw-border-opacity));
 }.border-b-border {
   --tw-border-opacity: 1;
   border-bottom-color: rgba(var(--colors-border), var(--tw-border-opacity));
@@ -1963,6 +2221,9 @@ video {
 }.border-r-border {
   --tw-border-opacity: 1;
   border-right-color: rgba(var(--colors-border), var(--tw-border-opacity));
+}.border-t-border {
+  --tw-border-opacity: 1;
+  border-top-color: rgba(var(--colors-border), var(--tw-border-opacity));
 }.bg-\[transparent\] {
   background-color: transparent;
 }.bg-background {
@@ -2026,6 +2287,14 @@ video {
   background-position: right 1.125rem center;
 }.bg-no-repeat {
   background-repeat: no-repeat;
+}.fill-pictogram-dark {
+  fill: rgb(var(--colors-pictogram-dark));
+}.fill-pictogram-duo-highlight {
+  fill: rgb(var(--colors-pictogram-duo-highlight));
+}.fill-pictogram-duo-outline {
+  fill: rgb(var(--colors-pictogram-duo-outline));
+}.fill-white {
+  fill: #FFF;
 }.p-0 {
   padding: 0;
 }.p-1 {
@@ -2036,6 +2305,10 @@ video {
   padding: 1.125rem;
 }.p-4 {
   padding: 1.5rem;
+}.p-5 {
+  padding: 1.875rem;
+}.p-\[0\.0625rem\] {
+  padding: 0.0625rem;
 }.px-0 {
   padding-left: 0;
   padding-right: 0;
@@ -2086,6 +2359,8 @@ video {
   padding-bottom: 0.625rem;
 }.pl-1 {
   padding-left: 0.375rem;
+}.pr-1 {
+  padding-right: 0.375rem;
 }.pr-6 {
   padding-right: 2.25rem;
 }.pr-\[calc\(0\.5rem\+14px\+0\.5625rem\)\] {
@@ -2100,10 +2375,16 @@ video {
   padding-top: 0.1875rem;
 }.pt-\[0\.5625rem\] {
   padding-top: 0.5625rem;
+}.text-left {
+  text-align: left;
 }.text-center {
   text-align: center;
+}.text-right {
+  text-align: right;
 }.align-middle {
   vertical-align: middle;
+}.align-bottom {
+  vertical-align: bottom;
 }.text-\[0\.75rem\] {
   font-size: 0.75rem;
 }.text-\[0\.8125rem\] {
@@ -2122,12 +2403,16 @@ video {
   line-height: 1rem;
 }.font-bold {
   font-weight: 700;
+}.font-light {
+  font-weight: 300;
 }.uppercase {
   text-transform: uppercase;
 }.leading-\[1\.5\] {
   line-height: 1.5;
 }.leading-none {
   line-height: 1;
+}.leading-tight {
+  line-height: 1.2;
 }.text-background {
   --tw-text-opacity: 1;
   color: rgba(var(--colors-background), var(--tw-text-opacity));
@@ -2219,6 +2504,10 @@ video {
   transition-property: background;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
+}.transition-\[width\] {
+  transition-property: width;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
 }.transition-colors {
   transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -2227,6 +2516,10 @@ video {
   transition-property: transform;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
+}.duration-\[\.3s\] {
+  transition-duration: .3s;
+}.duration-\[\.6s\] {
+  transition-duration: .6s;
 }.focus-outline {
   outline-style: solid;
   outline-width: 2px;
@@ -2529,18 +2822,51 @@ video {
 }.after\:absolute::after {
   content: var(--tw-content);
   position: absolute;
+}.after\:left-0::after {
+  content: var(--tw-content);
+  left: 0;
 }.after\:left-1\/2::after {
   content: var(--tw-content);
   left: 50%;
+}.after\:left-full::after {
+  content: var(--tw-content);
+  left: 100%;
+}.after\:top-0::after {
+  content: var(--tw-content);
+  top: 0;
 }.after\:top-1\/2::after {
   content: var(--tw-content);
   top: 50%;
 }.after\:block::after {
   content: var(--tw-content);
   display: block;
+}.after\:h-\[1\.75rem\]::after {
+  content: var(--tw-content);
+  height: 1.75rem;
+}.after\:h-\[2\.125rem\]::after {
+  content: var(--tw-content);
+  height: 2.125rem;
+}.after\:h-\[2\.5rem\]::after {
+  content: var(--tw-content);
+  height: 2.5rem;
+}.after\:h-\[2\.875rem\]::after {
+  content: var(--tw-content);
+  height: 2.875rem;
 }.after\:h-full::after {
   content: var(--tw-content);
   height: 100%;
+}.after\:w-\[1\.75rem\]::after {
+  content: var(--tw-content);
+  width: 1.75rem;
+}.after\:w-\[2\.125rem\]::after {
+  content: var(--tw-content);
+  width: 2.125rem;
+}.after\:w-\[2\.5rem\]::after {
+  content: var(--tw-content);
+  width: 2.5rem;
+}.after\:w-\[2\.875rem\]::after {
+  content: var(--tw-content);
+  width: 2.875rem;
 }.after\:w-\[2px\]::after {
   content: var(--tw-content);
   width: 2px;
@@ -2548,6 +2874,10 @@ video {
   content: var(--tw-content);
   --tw-translate-x: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}.after\:-translate-x-full::after {
+  content: var(--tw-content);
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }.after\:-translate-y-1\/2::after {
   content: var(--tw-content);
   --tw-translate-y: -50%;
@@ -2556,21 +2886,47 @@ video {
   content: var(--tw-content);
   --tw-rotate: 90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}.after\:rounded-\[50\%\]::after {
+  content: var(--tw-content);
+  border-radius: 50%;
 }.after\:bg-muted::after {
   content: var(--tw-content);
   --tw-bg-opacity: 1;
   background-color: rgba(var(--colors-muted), var(--tw-bg-opacity));
+}.after\:bg-white::after {
+  content: var(--tw-content);
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}.after\:shadow-switch::after {
+  content: var(--tw-content);
+  --tw-shadow: 0.1875rem 0 0.375rem 0 rgba(0,0,0,0.53);
+  --tw-shadow-colored: 0.1875rem 0 0.375rem 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}.after\:transition-all::after {
+  content: var(--tw-content);
+  transition-property: all;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
 }.after\:transition-transform::after {
   content: var(--tw-content);
   transition-property: transform;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
+}.after\:duration-\[\.3s\]::after {
+  content: var(--tw-content);
+  transition-duration: .3s;
 }.last\:border-b-0:last-child {
   border-bottom-width: 0px;
 }.last\:border-r-0:last-child {
   border-right-width: 0px;
+}.even\:bg-background:nth-child(even) {
+  --tw-bg-opacity: 1;
+  background-color: rgba(var(--colors-background), var(--tw-bg-opacity));
 }.hover\:cursor-pointer:hover {
   cursor: pointer;
+}.hover\:bg-background:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(var(--colors-background), var(--tw-bg-opacity));
 }.hover\:bg-hero-70:hover {
   --tw-bg-opacity: 1;
   background-color: rgba(var(--colors-hero-70), var(--tw-bg-opacity));
@@ -2588,6 +2944,8 @@ video {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }.hover\:underline:hover {
   text-decoration-line: underline;
+}.hover\:no-underline:hover {
+  text-decoration-line: none;
 }.hover\:opacity-\[0\.8\]:hover {
   opacity: 0.8;
 }.focus\:not-sr-only:focus {
@@ -2654,12 +3012,62 @@ video {
   border-bottom-right-radius: 0.25rem;
 }.group\/buttons:not(:first-child) .group-\[\:not\(\:first-child\)\]\/buttons\:border-l-0 {
   border-left-width: 0px;
-}@media (min-width: 576px) {.xsl\:relative {
+}@media (min-width: 576px) {.xsl\:pointer-events-none {
+    pointer-events: none;
+  }.xsl\:relative {
     position: relative;
   }.xsl\:sticky {
     position: sticky;
   }.xsl\:top-\[0\.125rem\] {
     top: 0.125rem;
+  }.xsl\:col-span-1 {
+    grid-column: span 1 / span 1;
+  }.xsl\:col-span-10 {
+    grid-column: span 10 / span 10;
+  }.xsl\:col-span-11 {
+    grid-column: span 11 / span 11;
+  }.xsl\:col-span-12 {
+    grid-column: span 12 / span 12;
+  }.xsl\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }.xsl\:col-span-3 {
+    grid-column: span 3 / span 3;
+  }.xsl\:col-span-4 {
+    grid-column: span 4 / span 4;
+  }.xsl\:col-span-5 {
+    grid-column: span 5 / span 5;
+  }.xsl\:col-span-6 {
+    grid-column: span 6 / span 6;
+  }.xsl\:col-span-7 {
+    grid-column: span 7 / span 7;
+  }.xsl\:col-span-8 {
+    grid-column: span 8 / span 8;
+  }.xsl\:col-span-9 {
+    grid-column: span 9 / span 9;
+  }.xsl\:col-start-1 {
+    grid-column-start: 1;
+  }.xsl\:col-start-10 {
+    grid-column-start: 10;
+  }.xsl\:col-start-11 {
+    grid-column-start: 11;
+  }.xsl\:col-start-12 {
+    grid-column-start: 12;
+  }.xsl\:col-start-2 {
+    grid-column-start: 2;
+  }.xsl\:col-start-3 {
+    grid-column-start: 3;
+  }.xsl\:col-start-4 {
+    grid-column-start: 4;
+  }.xsl\:col-start-5 {
+    grid-column-start: 5;
+  }.xsl\:col-start-6 {
+    grid-column-start: 6;
+  }.xsl\:col-start-7 {
+    grid-column-start: 7;
+  }.xsl\:col-start-8 {
+    grid-column-start: 8;
+  }.xsl\:col-start-9 {
+    grid-column-start: 9;
   }.xsl\:mb-1 {
     margin-bottom: 0.375rem;
   }.xsl\:mb-2 {
@@ -2688,12 +3096,30 @@ video {
     height: 2.25rem;
   }.xsl\:h-8 {
     height: 3rem;
+  }.xsl\:h-\[0\.625rem\] {
+    height: 0.625rem;
+  }.xsl\:h-\[1\.5rem\] {
+    height: 1.5rem;
+  }.xsl\:h-\[1\.75rem\] {
+    height: 1.75rem;
+  }.xsl\:h-\[2\.125rem\] {
+    height: 2.125rem;
+  }.xsl\:h-\[2\.5rem\] {
+    height: 2.5rem;
+  }.xsl\:h-\[2\.875rem\] {
+    height: 2.875rem;
   }.xsl\:min-h-\[3\.375rem\] {
     min-height: 3.375rem;
   }.xsl\:min-h-\[4\.125rem\] {
     min-height: 4.125rem;
   }.xsl\:min-h-\[4\.5rem\] {
     min-height: 4.5rem;
+  }.xsl\:w-10 {
+    width: 3.75rem;
+  }.xsl\:w-12 {
+    width: 4.5rem;
+  }.xsl\:w-14 {
+    width: 5.25rem;
   }.xsl\:w-2 {
     width: 0.75rem;
   }.xsl\:w-3 {
@@ -2719,14 +3145,34 @@ video {
     flex-direction: column;
   }.xsl\:flex-wrap {
     flex-wrap: wrap;
+  }.xsl\:items-center {
+    align-items: center;
+  }.xsl\:items-baseline {
+    align-items: baseline;
   }.xsl\:justify-between {
     justify-content: space-between;
+  }.xsl\:gap-4 {
+    gap: 1.5rem;
   }.xsl\:gap-\[2px\] {
     gap: 2px;
+  }.xsl\:self-center {
+    align-self: center;
   }.xsl\:overflow-hidden {
     overflow: hidden;
   }.xsl\:rounded {
     border-radius: 0.25rem;
+  }.xsl\:rounded-\[0\.625rem\] {
+    border-radius: 0.625rem;
+  }.xsl\:rounded-\[1\.5rem\] {
+    border-radius: 1.5rem;
+  }.xsl\:rounded-\[1\.75rem\] {
+    border-radius: 1.75rem;
+  }.xsl\:rounded-\[2\.125rem\] {
+    border-radius: 2.125rem;
+  }.xsl\:rounded-\[2\.5rem\] {
+    border-radius: 2.5rem;
+  }.xsl\:rounded-\[2\.875rem\] {
+    border-radius: 2.875rem;
   }.xsl\:rounded-full {
     border-radius: 9999px;
   }.xsl\:rounded-sm {
@@ -2738,8 +3184,14 @@ video {
   }.xsl\:border-y {
     border-top-width: 1px;
     border-bottom-width: 1px;
+  }.xsl\:border-b-\[3px\] {
+    border-bottom-width: 3px;
   }.xsl\:border-l-5 {
     border-left-width: 0.3125rem;
+  }.xsl\:border-l-\[6px\] {
+    border-left-width: 6px;
+  }.xsl\:border-r-0 {
+    border-right-width: 0px;
   }.xsl\:border-t {
     border-top-width: 1px;
   }.xsl\:border-border {
@@ -2757,9 +3209,22 @@ video {
   }.xsl\:border-primary {
     --tw-border-opacity: 1;
     border-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.xsl\:border-x-border {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+    border-right-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.xsl\:border-b-primary {
+    --tw-border-opacity: 1;
+    border-bottom-color: rgba(var(--colors-primary), var(--tw-border-opacity));
   }.xsl\:border-l-border {
     --tw-border-opacity: 1;
     border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.xsl\:border-l-primary {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.xsl\:border-t-border {
+    --tw-border-opacity: 1;
+    border-top-color: rgba(var(--colors-border), var(--tw-border-opacity));
   }.xsl\:bg-\[transparent\] {
     background-color: transparent;
   }.xsl\:bg-border-20 {
@@ -2803,6 +3268,9 @@ video {
   }.xsl\:px-3 {
     padding-left: 1.125rem;
     padding-right: 1.125rem;
+  }.xsl\:px-5 {
+    padding-left: 1.875rem;
+    padding-right: 1.875rem;
   }.xsl\:px-\[0\.4375rem\] {
     padding-left: 0.4375rem;
     padding-right: 0.4375rem;
@@ -2899,6 +3367,8 @@ video {
     color: rgb(255 255 255 / var(--tw-text-opacity));
   }.xsl\:underline {
     text-decoration-line: underline;
+  }.xsl\:opacity-50 {
+    opacity: 0.5;
   }.xsl\:shadow-md {
     --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
     --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@@ -2972,15 +3442,42 @@ video {
   }.xsl\:after\:left-1\/2::after {
     content: var(--tw-content);
     left: 50%;
+  }.xsl\:after\:left-full::after {
+    content: var(--tw-content);
+    left: 100%;
   }.xsl\:after\:top-1\/2::after {
     content: var(--tw-content);
     top: 50%;
   }.xsl\:after\:block::after {
     content: var(--tw-content);
     display: block;
+  }.xsl\:after\:h-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    height: 1.75rem;
+  }.xsl\:after\:h-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    height: 2.125rem;
+  }.xsl\:after\:h-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    height: 2.5rem;
+  }.xsl\:after\:h-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    height: 2.875rem;
   }.xsl\:after\:h-full::after {
     content: var(--tw-content);
     height: 100%;
+  }.xsl\:after\:w-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    width: 1.75rem;
+  }.xsl\:after\:w-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    width: 2.125rem;
+  }.xsl\:after\:w-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    width: 2.5rem;
+  }.xsl\:after\:w-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    width: 2.875rem;
   }.xsl\:after\:w-\[2px\]::after {
     content: var(--tw-content);
     width: 2px;
@@ -2988,6 +3485,10 @@ video {
     content: var(--tw-content);
     --tw-translate-x: -50%;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }.xsl\:after\:-translate-x-full::after {
+    content: var(--tw-content);
+    --tw-translate-x: -100%;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }.xsl\:after\:-translate-y-1\/2::after {
     content: var(--tw-content);
     --tw-translate-y: -50%;
@@ -3001,6 +3502,9 @@ video {
     transition-property: transform;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-duration: 150ms;
+  }.xsl\:even\:bg-background:nth-child(even) {
+    --tw-bg-opacity: 1;
+    background-color: rgba(var(--colors-background), var(--tw-bg-opacity));
   }.xsl\:hover\:cursor-pointer:hover {
     cursor: pointer;
   }.xsl\:hover\:bg-hero-70:hover {
@@ -3024,11 +3528,64 @@ video {
   }.xsl\:active\:bg-white:active {
     --tw-bg-opacity: 1;
     background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  }@media (min-width: 768px) {.xsl\:sm\:max-w-xsl {
+      max-width: 576px;
+    }
   }
-}@media (min-width: 768px) {.sm\:relative {
+}@media (min-width: 768px) {.sm\:pointer-events-none {
+    pointer-events: none;
+  }.sm\:relative {
     position: relative;
   }.sm\:sticky {
     position: sticky;
+  }.sm\:col-span-1 {
+    grid-column: span 1 / span 1;
+  }.sm\:col-span-10 {
+    grid-column: span 10 / span 10;
+  }.sm\:col-span-11 {
+    grid-column: span 11 / span 11;
+  }.sm\:col-span-12 {
+    grid-column: span 12 / span 12;
+  }.sm\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }.sm\:col-span-3 {
+    grid-column: span 3 / span 3;
+  }.sm\:col-span-4 {
+    grid-column: span 4 / span 4;
+  }.sm\:col-span-5 {
+    grid-column: span 5 / span 5;
+  }.sm\:col-span-6 {
+    grid-column: span 6 / span 6;
+  }.sm\:col-span-7 {
+    grid-column: span 7 / span 7;
+  }.sm\:col-span-8 {
+    grid-column: span 8 / span 8;
+  }.sm\:col-span-9 {
+    grid-column: span 9 / span 9;
+  }.sm\:col-start-1 {
+    grid-column-start: 1;
+  }.sm\:col-start-10 {
+    grid-column-start: 10;
+  }.sm\:col-start-11 {
+    grid-column-start: 11;
+  }.sm\:col-start-12 {
+    grid-column-start: 12;
+  }.sm\:col-start-2 {
+    grid-column-start: 2;
+  }.sm\:col-start-3 {
+    grid-column-start: 3;
+  }.sm\:col-start-4 {
+    grid-column-start: 4;
+  }.sm\:col-start-5 {
+    grid-column-start: 5;
+  }.sm\:col-start-6 {
+    grid-column-start: 6;
+  }.sm\:col-start-7 {
+    grid-column-start: 7;
+  }.sm\:col-start-8 {
+    grid-column-start: 8;
+  }.sm\:col-start-9 {
+    grid-column-start: 9;
   }.sm\:mb-1 {
     margin-bottom: 0.375rem;
   }.sm\:mb-2 {
@@ -3055,12 +3612,30 @@ video {
     height: 2.25rem;
   }.sm\:h-8 {
     height: 3rem;
+  }.sm\:h-\[0\.625rem\] {
+    height: 0.625rem;
+  }.sm\:h-\[1\.5rem\] {
+    height: 1.5rem;
+  }.sm\:h-\[1\.75rem\] {
+    height: 1.75rem;
+  }.sm\:h-\[2\.125rem\] {
+    height: 2.125rem;
+  }.sm\:h-\[2\.5rem\] {
+    height: 2.5rem;
+  }.sm\:h-\[2\.875rem\] {
+    height: 2.875rem;
   }.sm\:min-h-\[3\.375rem\] {
     min-height: 3.375rem;
   }.sm\:min-h-\[4\.125rem\] {
     min-height: 4.125rem;
   }.sm\:min-h-\[4\.5rem\] {
     min-height: 4.5rem;
+  }.sm\:w-10 {
+    width: 3.75rem;
+  }.sm\:w-12 {
+    width: 4.5rem;
+  }.sm\:w-14 {
+    width: 5.25rem;
   }.sm\:w-2 {
     width: 0.75rem;
   }.sm\:w-3 {
@@ -3075,6 +3650,11 @@ video {
     width: 3rem;
   }.sm\:w-full {
     width: 100%;
+  }.sm\:max-w-xsl {
+    max-width: 576px;
+  }@media (min-width: 768px) {.sm\:sm\:max-w-xsl {
+      max-width: 576px;
+    }
   }.sm\:flex-1 {
     flex: 1 1 0%;
   }.sm\:-rotate-90 {
@@ -3086,14 +3666,32 @@ video {
     flex-direction: column;
   }.sm\:flex-wrap {
     flex-wrap: wrap;
+  }.sm\:items-center {
+    align-items: center;
+  }.sm\:items-baseline {
+    align-items: baseline;
   }.sm\:justify-between {
     justify-content: space-between;
   }.sm\:gap-\[2px\] {
     gap: 2px;
+  }.sm\:self-center {
+    align-self: center;
   }.sm\:overflow-hidden {
     overflow: hidden;
   }.sm\:rounded {
     border-radius: 0.25rem;
+  }.sm\:rounded-\[0\.625rem\] {
+    border-radius: 0.625rem;
+  }.sm\:rounded-\[1\.5rem\] {
+    border-radius: 1.5rem;
+  }.sm\:rounded-\[1\.75rem\] {
+    border-radius: 1.75rem;
+  }.sm\:rounded-\[2\.125rem\] {
+    border-radius: 2.125rem;
+  }.sm\:rounded-\[2\.5rem\] {
+    border-radius: 2.5rem;
+  }.sm\:rounded-\[2\.875rem\] {
+    border-radius: 2.875rem;
   }.sm\:rounded-full {
     border-radius: 9999px;
   }.sm\:rounded-sm {
@@ -3105,8 +3703,14 @@ video {
   }.sm\:border-y {
     border-top-width: 1px;
     border-bottom-width: 1px;
+  }.sm\:border-b-\[3px\] {
+    border-bottom-width: 3px;
   }.sm\:border-l-5 {
     border-left-width: 0.3125rem;
+  }.sm\:border-l-\[6px\] {
+    border-left-width: 6px;
+  }.sm\:border-r-0 {
+    border-right-width: 0px;
   }.sm\:border-t {
     border-top-width: 1px;
   }.sm\:border-border {
@@ -3124,9 +3728,22 @@ video {
   }.sm\:border-primary {
     --tw-border-opacity: 1;
     border-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.sm\:border-x-border {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+    border-right-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.sm\:border-b-primary {
+    --tw-border-opacity: 1;
+    border-bottom-color: rgba(var(--colors-primary), var(--tw-border-opacity));
   }.sm\:border-l-border {
     --tw-border-opacity: 1;
     border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.sm\:border-l-primary {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.sm\:border-t-border {
+    --tw-border-opacity: 1;
+    border-top-color: rgba(var(--colors-border), var(--tw-border-opacity));
   }.sm\:bg-\[transparent\] {
     background-color: transparent;
   }.sm\:bg-border-20 {
@@ -3172,6 +3789,9 @@ video {
   }.sm\:px-3 {
     padding-left: 1.125rem;
     padding-right: 1.125rem;
+  }.sm\:px-6 {
+    padding-left: 2.25rem;
+    padding-right: 2.25rem;
   }.sm\:px-\[0\.4375rem\] {
     padding-left: 0.4375rem;
     padding-right: 0.4375rem;
@@ -3268,6 +3888,8 @@ video {
     color: rgb(255 255 255 / var(--tw-text-opacity));
   }.sm\:underline {
     text-decoration-line: underline;
+  }.sm\:opacity-50 {
+    opacity: 0.5;
   }.sm\:shadow-md {
     --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
     --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@@ -3341,15 +3963,42 @@ video {
   }.sm\:after\:left-1\/2::after {
     content: var(--tw-content);
     left: 50%;
+  }.sm\:after\:left-full::after {
+    content: var(--tw-content);
+    left: 100%;
   }.sm\:after\:top-1\/2::after {
     content: var(--tw-content);
     top: 50%;
   }.sm\:after\:block::after {
     content: var(--tw-content);
     display: block;
+  }.sm\:after\:h-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    height: 1.75rem;
+  }.sm\:after\:h-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    height: 2.125rem;
+  }.sm\:after\:h-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    height: 2.5rem;
+  }.sm\:after\:h-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    height: 2.875rem;
   }.sm\:after\:h-full::after {
     content: var(--tw-content);
     height: 100%;
+  }.sm\:after\:w-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    width: 1.75rem;
+  }.sm\:after\:w-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    width: 2.125rem;
+  }.sm\:after\:w-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    width: 2.5rem;
+  }.sm\:after\:w-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    width: 2.875rem;
   }.sm\:after\:w-\[2px\]::after {
     content: var(--tw-content);
     width: 2px;
@@ -3357,6 +4006,10 @@ video {
     content: var(--tw-content);
     --tw-translate-x: -50%;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }.sm\:after\:-translate-x-full::after {
+    content: var(--tw-content);
+    --tw-translate-x: -100%;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }.sm\:after\:-translate-y-1\/2::after {
     content: var(--tw-content);
     --tw-translate-y: -50%;
@@ -3370,6 +4023,9 @@ video {
     transition-property: transform;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-duration: 150ms;
+  }.sm\:even\:bg-background:nth-child(even) {
+    --tw-bg-opacity: 1;
+    background-color: rgba(var(--colors-background), var(--tw-bg-opacity));
   }.sm\:hover\:cursor-pointer:hover {
     cursor: pointer;
   }.sm\:hover\:bg-hero-70:hover {
@@ -3394,10 +4050,71 @@ video {
     --tw-bg-opacity: 1;
     background-color: rgb(255 255 255 / var(--tw-bg-opacity));
   }
-}@media (min-width: 992px) {.md\:relative {
+}@media (min-width: 576px) {@media (min-width: 992px) {.xsl\:md\:max-w-md {
+      max-width: 992px;
+    }
+  }
+}@media (min-width: 768px) {@media (min-width: 992px) {.sm\:md\:max-w-md {
+      max-width: 992px;
+    }
+  }
+}@media (min-width: 992px) {@media (min-width: 768px) {.md\:sm\:max-w-xsl {
+      max-width: 576px;
+    }
+  }.md\:pointer-events-none {
+    pointer-events: none;
+  }.md\:relative {
     position: relative;
   }.md\:sticky {
     position: sticky;
+  }.md\:col-span-1 {
+    grid-column: span 1 / span 1;
+  }.md\:col-span-10 {
+    grid-column: span 10 / span 10;
+  }.md\:col-span-11 {
+    grid-column: span 11 / span 11;
+  }.md\:col-span-12 {
+    grid-column: span 12 / span 12;
+  }.md\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }.md\:col-span-3 {
+    grid-column: span 3 / span 3;
+  }.md\:col-span-4 {
+    grid-column: span 4 / span 4;
+  }.md\:col-span-5 {
+    grid-column: span 5 / span 5;
+  }.md\:col-span-6 {
+    grid-column: span 6 / span 6;
+  }.md\:col-span-7 {
+    grid-column: span 7 / span 7;
+  }.md\:col-span-8 {
+    grid-column: span 8 / span 8;
+  }.md\:col-span-9 {
+    grid-column: span 9 / span 9;
+  }.md\:col-start-1 {
+    grid-column-start: 1;
+  }.md\:col-start-10 {
+    grid-column-start: 10;
+  }.md\:col-start-11 {
+    grid-column-start: 11;
+  }.md\:col-start-12 {
+    grid-column-start: 12;
+  }.md\:col-start-2 {
+    grid-column-start: 2;
+  }.md\:col-start-3 {
+    grid-column-start: 3;
+  }.md\:col-start-4 {
+    grid-column-start: 4;
+  }.md\:col-start-5 {
+    grid-column-start: 5;
+  }.md\:col-start-6 {
+    grid-column-start: 6;
+  }.md\:col-start-7 {
+    grid-column-start: 7;
+  }.md\:col-start-8 {
+    grid-column-start: 8;
+  }.md\:col-start-9 {
+    grid-column-start: 9;
   }.md\:mb-1 {
     margin-bottom: 0.375rem;
   }.md\:mb-2 {
@@ -3424,12 +4141,30 @@ video {
     height: 2.25rem;
   }.md\:h-8 {
     height: 3rem;
+  }.md\:h-\[0\.625rem\] {
+    height: 0.625rem;
+  }.md\:h-\[1\.5rem\] {
+    height: 1.5rem;
+  }.md\:h-\[1\.75rem\] {
+    height: 1.75rem;
+  }.md\:h-\[2\.125rem\] {
+    height: 2.125rem;
+  }.md\:h-\[2\.5rem\] {
+    height: 2.5rem;
+  }.md\:h-\[2\.875rem\] {
+    height: 2.875rem;
   }.md\:min-h-\[3\.375rem\] {
     min-height: 3.375rem;
   }.md\:min-h-\[4\.125rem\] {
     min-height: 4.125rem;
   }.md\:min-h-\[4\.5rem\] {
     min-height: 4.5rem;
+  }.md\:w-10 {
+    width: 3.75rem;
+  }.md\:w-12 {
+    width: 4.5rem;
+  }.md\:w-14 {
+    width: 5.25rem;
   }.md\:w-2 {
     width: 0.75rem;
   }.md\:w-3 {
@@ -3444,6 +4179,11 @@ video {
     width: 3rem;
   }.md\:w-full {
     width: 100%;
+  }.md\:max-w-md {
+    max-width: 992px;
+  }@media (min-width: 992px) {.md\:md\:max-w-md {
+      max-width: 992px;
+    }
   }.md\:flex-1 {
     flex: 1 1 0%;
   }.md\:-rotate-90 {
@@ -3455,14 +4195,32 @@ video {
     flex-direction: column;
   }.md\:flex-wrap {
     flex-wrap: wrap;
+  }.md\:items-center {
+    align-items: center;
+  }.md\:items-baseline {
+    align-items: baseline;
   }.md\:justify-between {
     justify-content: space-between;
   }.md\:gap-\[2px\] {
     gap: 2px;
+  }.md\:self-center {
+    align-self: center;
   }.md\:overflow-hidden {
     overflow: hidden;
   }.md\:rounded {
     border-radius: 0.25rem;
+  }.md\:rounded-\[0\.625rem\] {
+    border-radius: 0.625rem;
+  }.md\:rounded-\[1\.5rem\] {
+    border-radius: 1.5rem;
+  }.md\:rounded-\[1\.75rem\] {
+    border-radius: 1.75rem;
+  }.md\:rounded-\[2\.125rem\] {
+    border-radius: 2.125rem;
+  }.md\:rounded-\[2\.5rem\] {
+    border-radius: 2.5rem;
+  }.md\:rounded-\[2\.875rem\] {
+    border-radius: 2.875rem;
   }.md\:rounded-full {
     border-radius: 9999px;
   }.md\:rounded-sm {
@@ -3474,8 +4232,14 @@ video {
   }.md\:border-y {
     border-top-width: 1px;
     border-bottom-width: 1px;
+  }.md\:border-b-\[3px\] {
+    border-bottom-width: 3px;
   }.md\:border-l-5 {
     border-left-width: 0.3125rem;
+  }.md\:border-l-\[6px\] {
+    border-left-width: 6px;
+  }.md\:border-r-0 {
+    border-right-width: 0px;
   }.md\:border-t {
     border-top-width: 1px;
   }.md\:border-border {
@@ -3493,9 +4257,22 @@ video {
   }.md\:border-primary {
     --tw-border-opacity: 1;
     border-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.md\:border-x-border {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+    border-right-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.md\:border-b-primary {
+    --tw-border-opacity: 1;
+    border-bottom-color: rgba(var(--colors-primary), var(--tw-border-opacity));
   }.md\:border-l-border {
     --tw-border-opacity: 1;
     border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.md\:border-l-primary {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.md\:border-t-border {
+    --tw-border-opacity: 1;
+    border-top-color: rgba(var(--colors-border), var(--tw-border-opacity));
   }.md\:bg-\[transparent\] {
     background-color: transparent;
   }.md\:bg-border-20 {
@@ -3539,6 +4316,9 @@ video {
   }.md\:px-3 {
     padding-left: 1.125rem;
     padding-right: 1.125rem;
+  }.md\:px-8 {
+    padding-left: 3rem;
+    padding-right: 3rem;
   }.md\:px-\[0\.4375rem\] {
     padding-left: 0.4375rem;
     padding-right: 0.4375rem;
@@ -3635,6 +4415,8 @@ video {
     color: rgb(255 255 255 / var(--tw-text-opacity));
   }.md\:underline {
     text-decoration-line: underline;
+  }.md\:opacity-50 {
+    opacity: 0.5;
   }.md\:shadow-md {
     --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
     --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@@ -3708,15 +4490,42 @@ video {
   }.md\:after\:left-1\/2::after {
     content: var(--tw-content);
     left: 50%;
+  }.md\:after\:left-full::after {
+    content: var(--tw-content);
+    left: 100%;
   }.md\:after\:top-1\/2::after {
     content: var(--tw-content);
     top: 50%;
   }.md\:after\:block::after {
     content: var(--tw-content);
     display: block;
+  }.md\:after\:h-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    height: 1.75rem;
+  }.md\:after\:h-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    height: 2.125rem;
+  }.md\:after\:h-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    height: 2.5rem;
+  }.md\:after\:h-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    height: 2.875rem;
   }.md\:after\:h-full::after {
     content: var(--tw-content);
     height: 100%;
+  }.md\:after\:w-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    width: 1.75rem;
+  }.md\:after\:w-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    width: 2.125rem;
+  }.md\:after\:w-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    width: 2.5rem;
+  }.md\:after\:w-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    width: 2.875rem;
   }.md\:after\:w-\[2px\]::after {
     content: var(--tw-content);
     width: 2px;
@@ -3724,6 +4533,10 @@ video {
     content: var(--tw-content);
     --tw-translate-x: -50%;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }.md\:after\:-translate-x-full::after {
+    content: var(--tw-content);
+    --tw-translate-x: -100%;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }.md\:after\:-translate-y-1\/2::after {
     content: var(--tw-content);
     --tw-translate-y: -50%;
@@ -3737,6 +4550,9 @@ video {
     transition-property: transform;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-duration: 150ms;
+  }.md\:even\:bg-background:nth-child(even) {
+    --tw-bg-opacity: 1;
+    background-color: rgba(var(--colors-background), var(--tw-bg-opacity));
   }.md\:hover\:cursor-pointer:hover {
     cursor: pointer;
   }.md\:hover\:bg-hero-70:hover {
@@ -3761,10 +4577,78 @@ video {
     --tw-bg-opacity: 1;
     background-color: rgb(255 255 255 / var(--tw-bg-opacity));
   }
-}@media (min-width: 1200px) {.lg\:relative {
+}@media (min-width: 576px) {@media (min-width: 1200px) {.xsl\:lg\:max-w-lg {
+      max-width: 1200px;
+    }
+  }
+}@media (min-width: 768px) {@media (min-width: 1200px) {.sm\:lg\:max-w-lg {
+      max-width: 1200px;
+    }
+  }
+}@media (min-width: 992px) {@media (min-width: 1200px) {.md\:lg\:max-w-lg {
+      max-width: 1200px;
+    }
+  }
+}@media (min-width: 1200px) {@media (min-width: 992px) {.lg\:md\:max-w-md {
+      max-width: 992px;
+    }
+  }@media (min-width: 768px) {.lg\:sm\:max-w-xsl {
+      max-width: 576px;
+    }
+  }.lg\:pointer-events-none {
+    pointer-events: none;
+  }.lg\:relative {
     position: relative;
   }.lg\:sticky {
     position: sticky;
+  }.lg\:col-span-1 {
+    grid-column: span 1 / span 1;
+  }.lg\:col-span-10 {
+    grid-column: span 10 / span 10;
+  }.lg\:col-span-11 {
+    grid-column: span 11 / span 11;
+  }.lg\:col-span-12 {
+    grid-column: span 12 / span 12;
+  }.lg\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }.lg\:col-span-3 {
+    grid-column: span 3 / span 3;
+  }.lg\:col-span-4 {
+    grid-column: span 4 / span 4;
+  }.lg\:col-span-5 {
+    grid-column: span 5 / span 5;
+  }.lg\:col-span-6 {
+    grid-column: span 6 / span 6;
+  }.lg\:col-span-7 {
+    grid-column: span 7 / span 7;
+  }.lg\:col-span-8 {
+    grid-column: span 8 / span 8;
+  }.lg\:col-span-9 {
+    grid-column: span 9 / span 9;
+  }.lg\:col-start-1 {
+    grid-column-start: 1;
+  }.lg\:col-start-10 {
+    grid-column-start: 10;
+  }.lg\:col-start-11 {
+    grid-column-start: 11;
+  }.lg\:col-start-12 {
+    grid-column-start: 12;
+  }.lg\:col-start-2 {
+    grid-column-start: 2;
+  }.lg\:col-start-3 {
+    grid-column-start: 3;
+  }.lg\:col-start-4 {
+    grid-column-start: 4;
+  }.lg\:col-start-5 {
+    grid-column-start: 5;
+  }.lg\:col-start-6 {
+    grid-column-start: 6;
+  }.lg\:col-start-7 {
+    grid-column-start: 7;
+  }.lg\:col-start-8 {
+    grid-column-start: 8;
+  }.lg\:col-start-9 {
+    grid-column-start: 9;
   }.lg\:mb-1 {
     margin-bottom: 0.375rem;
   }.lg\:mb-2 {
@@ -3791,12 +4675,30 @@ video {
     height: 2.25rem;
   }.lg\:h-8 {
     height: 3rem;
+  }.lg\:h-\[0\.625rem\] {
+    height: 0.625rem;
+  }.lg\:h-\[1\.5rem\] {
+    height: 1.5rem;
+  }.lg\:h-\[1\.75rem\] {
+    height: 1.75rem;
+  }.lg\:h-\[2\.125rem\] {
+    height: 2.125rem;
+  }.lg\:h-\[2\.5rem\] {
+    height: 2.5rem;
+  }.lg\:h-\[2\.875rem\] {
+    height: 2.875rem;
   }.lg\:min-h-\[3\.375rem\] {
     min-height: 3.375rem;
   }.lg\:min-h-\[4\.125rem\] {
     min-height: 4.125rem;
   }.lg\:min-h-\[4\.5rem\] {
     min-height: 4.5rem;
+  }.lg\:w-10 {
+    width: 3.75rem;
+  }.lg\:w-12 {
+    width: 4.5rem;
+  }.lg\:w-14 {
+    width: 5.25rem;
   }.lg\:w-2 {
     width: 0.75rem;
   }.lg\:w-3 {
@@ -3811,6 +4713,11 @@ video {
     width: 3rem;
   }.lg\:w-full {
     width: 100%;
+  }@media (min-width: 1200px) {.lg\:lg\:max-w-lg {
+      max-width: 1200px;
+    }
+  }.lg\:max-w-lg {
+    max-width: 1200px;
   }.lg\:flex-1 {
     flex: 1 1 0%;
   }.lg\:-rotate-90 {
@@ -3822,14 +4729,32 @@ video {
     flex-direction: column;
   }.lg\:flex-wrap {
     flex-wrap: wrap;
+  }.lg\:items-center {
+    align-items: center;
+  }.lg\:items-baseline {
+    align-items: baseline;
   }.lg\:justify-between {
     justify-content: space-between;
   }.lg\:gap-\[2px\] {
     gap: 2px;
+  }.lg\:self-center {
+    align-self: center;
   }.lg\:overflow-hidden {
     overflow: hidden;
   }.lg\:rounded {
     border-radius: 0.25rem;
+  }.lg\:rounded-\[0\.625rem\] {
+    border-radius: 0.625rem;
+  }.lg\:rounded-\[1\.5rem\] {
+    border-radius: 1.5rem;
+  }.lg\:rounded-\[1\.75rem\] {
+    border-radius: 1.75rem;
+  }.lg\:rounded-\[2\.125rem\] {
+    border-radius: 2.125rem;
+  }.lg\:rounded-\[2\.5rem\] {
+    border-radius: 2.5rem;
+  }.lg\:rounded-\[2\.875rem\] {
+    border-radius: 2.875rem;
   }.lg\:rounded-full {
     border-radius: 9999px;
   }.lg\:rounded-sm {
@@ -3841,8 +4766,14 @@ video {
   }.lg\:border-y {
     border-top-width: 1px;
     border-bottom-width: 1px;
+  }.lg\:border-b-\[3px\] {
+    border-bottom-width: 3px;
   }.lg\:border-l-5 {
     border-left-width: 0.3125rem;
+  }.lg\:border-l-\[6px\] {
+    border-left-width: 6px;
+  }.lg\:border-r-0 {
+    border-right-width: 0px;
   }.lg\:border-t {
     border-top-width: 1px;
   }.lg\:border-border {
@@ -3860,9 +4791,22 @@ video {
   }.lg\:border-primary {
     --tw-border-opacity: 1;
     border-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.lg\:border-x-border {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+    border-right-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.lg\:border-b-primary {
+    --tw-border-opacity: 1;
+    border-bottom-color: rgba(var(--colors-primary), var(--tw-border-opacity));
   }.lg\:border-l-border {
     --tw-border-opacity: 1;
     border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.lg\:border-l-primary {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.lg\:border-t-border {
+    --tw-border-opacity: 1;
+    border-top-color: rgba(var(--colors-border), var(--tw-border-opacity));
   }.lg\:bg-\[transparent\] {
     background-color: transparent;
   }.lg\:bg-border-20 {
@@ -3900,6 +4844,9 @@ video {
   }.lg\:px-1 {
     padding-left: 0.375rem;
     padding-right: 0.375rem;
+  }.lg\:px-10 {
+    padding-left: 3.75rem;
+    padding-right: 3.75rem;
   }.lg\:px-2 {
     padding-left: 0.75rem;
     padding-right: 0.75rem;
@@ -4002,6 +4949,8 @@ video {
     color: rgb(255 255 255 / var(--tw-text-opacity));
   }.lg\:underline {
     text-decoration-line: underline;
+  }.lg\:opacity-50 {
+    opacity: 0.5;
   }.lg\:shadow-md {
     --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
     --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@@ -4075,15 +5024,42 @@ video {
   }.lg\:after\:left-1\/2::after {
     content: var(--tw-content);
     left: 50%;
+  }.lg\:after\:left-full::after {
+    content: var(--tw-content);
+    left: 100%;
   }.lg\:after\:top-1\/2::after {
     content: var(--tw-content);
     top: 50%;
   }.lg\:after\:block::after {
     content: var(--tw-content);
     display: block;
+  }.lg\:after\:h-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    height: 1.75rem;
+  }.lg\:after\:h-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    height: 2.125rem;
+  }.lg\:after\:h-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    height: 2.5rem;
+  }.lg\:after\:h-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    height: 2.875rem;
   }.lg\:after\:h-full::after {
     content: var(--tw-content);
     height: 100%;
+  }.lg\:after\:w-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    width: 1.75rem;
+  }.lg\:after\:w-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    width: 2.125rem;
+  }.lg\:after\:w-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    width: 2.5rem;
+  }.lg\:after\:w-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    width: 2.875rem;
   }.lg\:after\:w-\[2px\]::after {
     content: var(--tw-content);
     width: 2px;
@@ -4091,6 +5067,10 @@ video {
     content: var(--tw-content);
     --tw-translate-x: -50%;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }.lg\:after\:-translate-x-full::after {
+    content: var(--tw-content);
+    --tw-translate-x: -100%;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }.lg\:after\:-translate-y-1\/2::after {
     content: var(--tw-content);
     --tw-translate-y: -50%;
@@ -4104,6 +5084,9 @@ video {
     transition-property: transform;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-duration: 150ms;
+  }.lg\:even\:bg-background:nth-child(even) {
+    --tw-bg-opacity: 1;
+    background-color: rgba(var(--colors-background), var(--tw-bg-opacity));
   }.lg\:hover\:cursor-pointer:hover {
     cursor: pointer;
   }.lg\:hover\:bg-hero-70:hover {
@@ -4128,10 +5111,69 @@ video {
     --tw-bg-opacity: 1;
     background-color: rgb(255 255 255 / var(--tw-bg-opacity));
   }
-}@media (min-width: 1900px) {.xl\:relative {
+}@media (min-width: 1900px) {@media (min-width: 1200px) {.xl\:lg\:max-w-lg {
+      max-width: 1200px;
+    }
+  }@media (min-width: 992px) {.xl\:md\:max-w-md {
+      max-width: 992px;
+    }
+  }@media (min-width: 768px) {.xl\:sm\:max-w-xsl {
+      max-width: 576px;
+    }
+  }.xl\:pointer-events-none {
+    pointer-events: none;
+  }.xl\:relative {
     position: relative;
   }.xl\:sticky {
     position: sticky;
+  }.xl\:col-span-1 {
+    grid-column: span 1 / span 1;
+  }.xl\:col-span-10 {
+    grid-column: span 10 / span 10;
+  }.xl\:col-span-11 {
+    grid-column: span 11 / span 11;
+  }.xl\:col-span-12 {
+    grid-column: span 12 / span 12;
+  }.xl\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }.xl\:col-span-3 {
+    grid-column: span 3 / span 3;
+  }.xl\:col-span-4 {
+    grid-column: span 4 / span 4;
+  }.xl\:col-span-5 {
+    grid-column: span 5 / span 5;
+  }.xl\:col-span-6 {
+    grid-column: span 6 / span 6;
+  }.xl\:col-span-7 {
+    grid-column: span 7 / span 7;
+  }.xl\:col-span-8 {
+    grid-column: span 8 / span 8;
+  }.xl\:col-span-9 {
+    grid-column: span 9 / span 9;
+  }.xl\:col-start-1 {
+    grid-column-start: 1;
+  }.xl\:col-start-10 {
+    grid-column-start: 10;
+  }.xl\:col-start-11 {
+    grid-column-start: 11;
+  }.xl\:col-start-12 {
+    grid-column-start: 12;
+  }.xl\:col-start-2 {
+    grid-column-start: 2;
+  }.xl\:col-start-3 {
+    grid-column-start: 3;
+  }.xl\:col-start-4 {
+    grid-column-start: 4;
+  }.xl\:col-start-5 {
+    grid-column-start: 5;
+  }.xl\:col-start-6 {
+    grid-column-start: 6;
+  }.xl\:col-start-7 {
+    grid-column-start: 7;
+  }.xl\:col-start-8 {
+    grid-column-start: 8;
+  }.xl\:col-start-9 {
+    grid-column-start: 9;
   }.xl\:mb-1 {
     margin-bottom: 0.375rem;
   }.xl\:mb-2 {
@@ -4158,12 +5200,30 @@ video {
     height: 2.25rem;
   }.xl\:h-8 {
     height: 3rem;
+  }.xl\:h-\[0\.625rem\] {
+    height: 0.625rem;
+  }.xl\:h-\[1\.5rem\] {
+    height: 1.5rem;
+  }.xl\:h-\[1\.75rem\] {
+    height: 1.75rem;
+  }.xl\:h-\[2\.125rem\] {
+    height: 2.125rem;
+  }.xl\:h-\[2\.5rem\] {
+    height: 2.5rem;
+  }.xl\:h-\[2\.875rem\] {
+    height: 2.875rem;
   }.xl\:min-h-\[3\.375rem\] {
     min-height: 3.375rem;
   }.xl\:min-h-\[4\.125rem\] {
     min-height: 4.125rem;
   }.xl\:min-h-\[4\.5rem\] {
     min-height: 4.5rem;
+  }.xl\:w-10 {
+    width: 3.75rem;
+  }.xl\:w-12 {
+    width: 4.5rem;
+  }.xl\:w-14 {
+    width: 5.25rem;
   }.xl\:w-2 {
     width: 0.75rem;
   }.xl\:w-3 {
@@ -4189,14 +5249,32 @@ video {
     flex-direction: column;
   }.xl\:flex-wrap {
     flex-wrap: wrap;
+  }.xl\:items-center {
+    align-items: center;
+  }.xl\:items-baseline {
+    align-items: baseline;
   }.xl\:justify-between {
     justify-content: space-between;
   }.xl\:gap-\[2px\] {
     gap: 2px;
+  }.xl\:self-center {
+    align-self: center;
   }.xl\:overflow-hidden {
     overflow: hidden;
   }.xl\:rounded {
     border-radius: 0.25rem;
+  }.xl\:rounded-\[0\.625rem\] {
+    border-radius: 0.625rem;
+  }.xl\:rounded-\[1\.5rem\] {
+    border-radius: 1.5rem;
+  }.xl\:rounded-\[1\.75rem\] {
+    border-radius: 1.75rem;
+  }.xl\:rounded-\[2\.125rem\] {
+    border-radius: 2.125rem;
+  }.xl\:rounded-\[2\.5rem\] {
+    border-radius: 2.5rem;
+  }.xl\:rounded-\[2\.875rem\] {
+    border-radius: 2.875rem;
   }.xl\:rounded-full {
     border-radius: 9999px;
   }.xl\:rounded-sm {
@@ -4208,8 +5286,14 @@ video {
   }.xl\:border-y {
     border-top-width: 1px;
     border-bottom-width: 1px;
+  }.xl\:border-b-\[3px\] {
+    border-bottom-width: 3px;
   }.xl\:border-l-5 {
     border-left-width: 0.3125rem;
+  }.xl\:border-l-\[6px\] {
+    border-left-width: 6px;
+  }.xl\:border-r-0 {
+    border-right-width: 0px;
   }.xl\:border-t {
     border-top-width: 1px;
   }.xl\:border-border {
@@ -4227,9 +5311,22 @@ video {
   }.xl\:border-primary {
     --tw-border-opacity: 1;
     border-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.xl\:border-x-border {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+    border-right-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.xl\:border-b-primary {
+    --tw-border-opacity: 1;
+    border-bottom-color: rgba(var(--colors-primary), var(--tw-border-opacity));
   }.xl\:border-l-border {
     --tw-border-opacity: 1;
     border-left-color: rgba(var(--colors-border), var(--tw-border-opacity));
+  }.xl\:border-l-primary {
+    --tw-border-opacity: 1;
+    border-left-color: rgba(var(--colors-primary), var(--tw-border-opacity));
+  }.xl\:border-t-border {
+    --tw-border-opacity: 1;
+    border-top-color: rgba(var(--colors-border), var(--tw-border-opacity));
   }.xl\:bg-\[transparent\] {
     background-color: transparent;
   }.xl\:bg-border-20 {
@@ -4369,6 +5466,8 @@ video {
     color: rgb(255 255 255 / var(--tw-text-opacity));
   }.xl\:underline {
     text-decoration-line: underline;
+  }.xl\:opacity-50 {
+    opacity: 0.5;
   }.xl\:shadow-md {
     --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
     --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@@ -4442,15 +5541,42 @@ video {
   }.xl\:after\:left-1\/2::after {
     content: var(--tw-content);
     left: 50%;
+  }.xl\:after\:left-full::after {
+    content: var(--tw-content);
+    left: 100%;
   }.xl\:after\:top-1\/2::after {
     content: var(--tw-content);
     top: 50%;
   }.xl\:after\:block::after {
     content: var(--tw-content);
     display: block;
+  }.xl\:after\:h-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    height: 1.75rem;
+  }.xl\:after\:h-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    height: 2.125rem;
+  }.xl\:after\:h-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    height: 2.5rem;
+  }.xl\:after\:h-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    height: 2.875rem;
   }.xl\:after\:h-full::after {
     content: var(--tw-content);
     height: 100%;
+  }.xl\:after\:w-\[1\.75rem\]::after {
+    content: var(--tw-content);
+    width: 1.75rem;
+  }.xl\:after\:w-\[2\.125rem\]::after {
+    content: var(--tw-content);
+    width: 2.125rem;
+  }.xl\:after\:w-\[2\.5rem\]::after {
+    content: var(--tw-content);
+    width: 2.5rem;
+  }.xl\:after\:w-\[2\.875rem\]::after {
+    content: var(--tw-content);
+    width: 2.875rem;
   }.xl\:after\:w-\[2px\]::after {
     content: var(--tw-content);
     width: 2px;
@@ -4458,6 +5584,10 @@ video {
     content: var(--tw-content);
     --tw-translate-x: -50%;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }.xl\:after\:-translate-x-full::after {
+    content: var(--tw-content);
+    --tw-translate-x: -100%;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }.xl\:after\:-translate-y-1\/2::after {
     content: var(--tw-content);
     --tw-translate-y: -50%;
@@ -4471,6 +5601,9 @@ video {
     transition-property: transform;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     transition-duration: 150ms;
+  }.xl\:even\:bg-background:nth-child(even) {
+    --tw-bg-opacity: 1;
+    background-color: rgba(var(--colors-background), var(--tw-bg-opacity));
   }.xl\:hover\:cursor-pointer:hover {
     cursor: pointer;
   }.xl\:hover\:bg-hero-70:hover {