@import url(https://fonts.googleapis.com/css2?family=Prompt:wght@300;400;500;600;700;800;900&display=swap);
:root {
  --font-prompt: "Prompt";
}
html {
  font-family: "Prompt";
} /*
! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com
*/ /*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/
*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}
::before,
::after {
  --tw-content: "";
} /*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/
html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
  tab-size: 4; /* 3 */
  font-family:
    "Prompt", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
    "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
} /*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/
body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
} /*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/
hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
} /*
Add the correct text decoration in Chrome, Edge, and Safari.
*/
abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
} /*
Remove the default font size and weight for headings.
*/
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
} /*
Reset links to optimize for opt-in styling instead of opt-out.
*/
a {
  color: inherit;
  text-decoration: inherit;
} /*
Add the correct font weight in Edge and Safari.
*/
b,
strong {
  font-weight: bolder;
} /*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp,
pre {
  font-family:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
} /*
Add the correct font size in all browsers.
*/
small {
  font-size: 80%;
} /*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
} /*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/
table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
} /*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
} /*
Remove the inheritance of text transform in Edge and Firefox.
*/
button,
select {
  text-transform: none;
} /*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
} /*
Use the modern Firefox focus style for all focusable elements.
*/
:-moz-focusring {
  outline: auto;
} /*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/
:-moz-ui-invalid {
  box-shadow: none;
} /*
Add the correct vertical alignment in Chrome and Firefox.
*/
progress {
  vertical-align: baseline;
} /*
Correct the cursor style of increment and decrement buttons in Safari.
*/
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
} /*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/
[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
} /*
Remove the inner padding in Chrome and Safari on macOS.
*/
::-webkit-search-decoration {
  -webkit-appearance: none;
} /*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
} /*
Add the correct display in Chrome and Safari.
*/
summary {
  display: list-item;
} /*
Removes the default spacing and border for appropriate elements.
*/
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}
fieldset {
  margin: 0;
  padding: 0;
}
legend {
  padding: 0;
}
ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
} /*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
} /*
Prevent resizing textareas horizontally by default.
*/
textarea {
  resize: vertical;
} /*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/
input::-moz-placeholder,
textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}
input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
} /*
Set the default cursor for buttons.
*/
button,
[role="button"] {
  cursor: pointer;
} /*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
} /*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
} /*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/
img,
video {
  max-width: 100%;
  height: auto;
} /* Make elements with the HTML hidden attribute stay hidden by default */
[hidden] {
  display: none;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.heading-1,
.heading-2,
.heading-3,
.heading-4,
.heading-5,
.heading-6 {
  font-family: Prompt;
  font-weight: 400;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.heading-1,
h1,
.h1 {
  display: block;
  font-size: calc(1.75rem + 1.5vw);
  line-height: 120%;
}
@media (min-width: 1200px) {
  .heading-1,
  h1,
  .h1 {
    font-size: 3rem;
  }
}
.heading-2,
h2,
.h2 {
  display: block;
  font-size: calc(1.5rem + 1.25vw);
  line-height: 120%;
}
@media (min-width: 1200px) {
  .heading-2,
  h2,
  .h2 {
    font-size: 2.5rem;
  }
}
.heading-3,
h3,
.h3 {
  display: block;
  font-size: calc(1.25rem + 1vw);
  line-height: 120%;
}
@media (min-width: 1200px) {
  .heading-3,
  h3,
  .h3 {
    font-size: 2rem;
  }
}
.heading-4,
h4,
.h4 {
  display: block;
  font-size: calc(1.25rem + 0.75vw);
  line-height: 130%;
}
@media (min-width: 1200px) {
  .heading-4,
  h4,
  .h4 {
    font-size: 1.5rem;
  }
}
.heading-5,
h5,
.h5 {
  display: block;
  line-height: 130%;
  color: clac(1.25rem+0.5vw);
}
@media (min-width: 1200px) {
  .heading-5,
  h5,
  .h5 {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.heading-6,
h6,
.h6 {
  display: block;
  font-size: 1rem;
  line-height: 1.5rem;
  line-height: 130%;
}
a,
span {
  display: block;
}
.text-lead-medium {
  font-size: 24px;
  font-weight: 500;
}
code.btn-group:not(.prose code) .btn:first-child {
  border-top-left-radius: 9999px;
  border-bottom-left-radius: 9999px;
}
code.btn-group:not(.prose code) .btn:last-child {
  border-top-right-radius: 9999px;
  border-bottom-right-radius: 9999px;
}
code:not(.prose code) {
  border-radius: 0.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(241 245 249 / var(--tw-bg-opacity));
  padding: 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  letter-spacing: 0.025em;
  --tw-text-opacity: 1;
  color: rgb(100 116 139 / var(--tw-text-opacity));
}
@media (prefers-color-scheme: dark) {
  code:not(.prose code) {
    --tw-bg-opacity: 1;
    background-color: rgb(71 85 105 / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(203 213 225 / var(--tw-text-opacity));
  }
}
*,
::before,
::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}
::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}
.\!container {
  width: 100% !important;
}
.container {
  width: 100%;
}
@media (min-width: 400px) {
  .\!container {
    max-width: 400px !important;
  }
  .container {
    max-width: 400px;
  }
}
@media (min-width: 576px) {
  .\!container {
    max-width: 576px !important;
  }
  .container {
    max-width: 576px;
  }
}
@media (min-width: 768px) {
  .\!container {
    max-width: 768px !important;
  }
  .container {
    max-width: 768px;
  }
}
@media (min-width: 992px) {
  .\!container {
    max-width: 992px !important;
  }
  .container {
    max-width: 992px;
  }
}
@media (min-width: 1200px) {
  .\!container {
    max-width: 1200px !important;
  }
  .container {
    max-width: 1200px;
  }
}
@media (min-width: 1400px) {
  .\!container {
    max-width: 1400px !important;
  }
  .container {
    max-width: 1400px;
  }
}
@media (min-width: 1500px) {
  .\!container {
    max-width: 1500px !important;
  }
  .container {
    max-width: 1500px;
  }
}
@media (min-width: 1600px) {
  .\!container {
    max-width: 1600px !important;
  }
  .container {
    max-width: 1600px;
  }
}
@media (min-width: 1800px) {
  .\!container {
    max-width: 1800px !important;
  }
  .container {
    max-width: 1800px;
  }
}
.transition-1 {
  transition: all 0.5s ease-in-out;
}
.display-100 {
  display: block;
  font-size: 3rem;
  line-height: 1;
  font-weight: 600;
  line-height: 120%;
}
@media (min-width: 576px) {
  .display-100 {
    font-size: 3.75rem;
    line-height: 1;
  }
}
@media (min-width: 768px) {
  .display-100 {
    font-size: 4.5rem;
    line-height: 1;
  }
}
@media (min-width: 992px) {
  .display-100 {
    font-size: 6rem;
    line-height: 1;
  }
}
@media (min-width: 1600px) {
  .display-100 {
    font-size: 100px;
  }
}
.display-120 {
  display: block;
  font-size: 3rem;
  line-height: 1;
  font-weight: 700;
  line-height: 120%;
}
@media (min-width: 576px) {
  .display-120 {
    font-size: 3.75rem;
    line-height: 1;
  }
}
@media (min-width: 768px) {
  .display-120 {
    font-size: 4.5rem;
    line-height: 1;
  }
}
@media (min-width: 992px) {
  .display-120 {
    font-size: 6rem;
    line-height: 1;
  }
}
@media (min-width: 1600px) {
  .display-120 {
    font-size: 120px;
  }
}
.display-140 {
  display: block;
  font-size: 3.75rem;
  line-height: 1;
  font-weight: 700;
  line-height: 120%;
}
@media (min-width: 576px) {
  .display-140 {
    font-size: 4.5rem;
    line-height: 1;
  }
}
@media (min-width: 768px) {
  .display-140 {
    font-size: 6rem;
    line-height: 1;
  }
}
@media (min-width: 992px) {
  .display-140 {
    font-size: 8rem;
    line-height: 1;
  }
}
@media (min-width: 1600px) {
  .display-140 {
    font-size: 140px;
  }
}
.display-lg {
  display: block;
  font-size: 2.25rem;
  line-height: 2.5rem;
  font-weight: 600;
  line-height: 120%;
}
@media (min-width: 576px) {
  .display-lg {
    font-size: 3rem;
    line-height: 1;
  }
}
@media (min-width: 768px) {
  .display-lg {
    font-size: 100px;
  }
}
@media (min-width: 992px) {
  .display-lg {
    font-size: 140px;
  }
}
@media (min-width: 1600px) {
  .display-lg {
    font-size: 160px;
  }
}
.display-4 {
  display: block;
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 600;
}
@media (min-width: 576px) {
  .display-4 {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}
@media (min-width: 768px) {
  .display-4 {
    font-size: 3rem;
    line-height: 1;
  }
}
@media (min-width: 992px) {
  .display-4 {
    font-size: 3.5625rem;
    line-height: 120%;
  }
}
.text-lead-medium {
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 500;
}
@media (min-width: 576px) {
  .text-lead-medium {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.text-xl-medium {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
}
@media (min-width: 576px) {
  .text-xl-medium {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.text-l-medium {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
}
@media (min-width: 576px) {
  .text-l-medium {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}
.text-l-regular {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 400;
}
@media (min-width: 576px) {
  .text-l-regular {
    font-size: 1.15rem;
    /* font-size: 1.125rem; */
    line-height: 1.75rem;
  }
}
.text-m-semi-bold {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
}
@media (min-width: 576px) {
  .text-m-semi-bold {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
.text-m-medium {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
}
@media (min-width: 576px) {
  .text-m-medium {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
.text-m-regular {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
}
@media (min-width: 576px) {
  .text-m-regular {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
.text-s-medium {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
}
.text-s-regular {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
}
.text-xs-medium {
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
}
.span,
.a {
  display: inline-block;
}
.label {
  display: block;
  font-family: Prompt;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.label-md {
  font-size: 1rem;
  line-height: 1.5rem;
}
.label-lg {
  font-size: 1rem;
  line-height: 1.5rem;
}
@media (min-width: 576px) {
  .label-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}
.label-xl {
  font-size: 1rem;
  line-height: 1.5rem;
}
@media (min-width: 576px) {
  .label-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.section-py {
  padding-top: 60px;
  padding-bottom: 60px;
}
.section-py-2 {
  padding-top: 30px;
  padding-bottom: 30px;
}
.section-py-3 {
  padding-top: 20px;
  padding-bottom: 20px;
}
@media (min-width: 576px) {
  .section-py {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .section-py-2 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
  .section-py-3 {
    padding-top: 1.7rem;
    padding-bottom: 1.7rem;
  }
}
@media (min-width: 768px) {
  .section-py {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .section-py-2 {
    padding-top: 45px;
    padding-bottom: 45px;
  }
  .section-py-3 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}
@media (min-width: 992px) {
  .section-py {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .section-py-2 {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .section-py-3 {
    padding-top: 33px;
    padding-bottom: 33px;
  }
}
.section-base-1 {
  padding-top: 1rem;
}
.section-pt-first {
  padding-top: 52px;
}
@media (min-width: 576px) {
  .section-pt-first {
    padding-top: 54px;
  }
}
@media (min-width: 768px) {
  .section-pt-first {
    padding-top: 56px;
  }
}
@media (min-width: 992px) {
  .section-pt-first {
    padding-top: 56px;
  }
}
.section-pt {
  padding-top: 60px;
}
@media (min-width: 576px) {
  .section-pt {
    padding-top: 5rem;
  }
}
@media (min-width: 768px) {
  .section-pt {
    padding-top: 90px;
  }
}
@media (min-width: 992px) {
  .section-pt {
    padding-top: 100px;
  }
}
.section-pb {
  padding-bottom: 60px;
}
@media (min-width: 576px) {
  .section-pb {
    padding-bottom: 5rem;
  }
}
@media (min-width: 768px) {
  .section-pb {
    padding-bottom: 90px;
  }
}
@media (min-width: 992px) {
  .section-pb {
    padding-bottom: 100px;
  }
}
.my-16p {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .my-16p {
    margin-top: 0.875rem;
    margin-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .my-16p {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
}
.mb-16p {
  margin-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .mb-16p {
    margin-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .mb-16p {
    margin-bottom: 1rem;
  }
}
.mt-16p {
  margin-top: 0.75rem;
}
@media (min-width: 576px) {
  .mt-16p {
    margin-top: 0.875rem;
  }
}
@media (min-width: 768px) {
  .mt-16p {
    margin-top: 1rem;
  }
}
.mx-20p {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
@media (min-width: 576px) {
  .mx-20p {
    margin-left: 0.875rem;
    margin-right: 0.875rem;
  }
}
@media (min-width: 768px) {
  .mx-20p {
    margin-left: 1rem;
    margin-right: 1rem;
  }
}
@media (min-width: 992px) {
  .mx-20p {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
  }
}
.my-20p {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .my-20p {
    margin-top: 0.875rem;
    margin-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .my-20p {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .my-20p {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
  }
}
.mb-20p {
  margin-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .mb-20p {
    margin-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .mb-20p {
    margin-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .mb-20p {
    margin-bottom: 1.25rem;
  }
}
.mt-20p {
  margin-top: 0.75rem;
}
@media (min-width: 576px) {
  .mt-20p {
    margin-top: 0.875rem;
  }
}
@media (min-width: 768px) {
  .mt-20p {
    margin-top: 1rem;
  }
}
@media (min-width: 992px) {
  .mt-20p {
    margin-top: 1.25rem;
  }
}
.mx-24p {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
@media (min-width: 768px) {
  .mx-24p {
    margin-left: 1rem;
    margin-right: 1rem;
  }
}
@media (min-width: 992px) {
  .mx-24p {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .mx-24p {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }
}
.my-24p {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
@media (min-width: 768px) {
  .my-24p {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .my-24p {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .my-24p {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
}
.mb-24p {
  margin-bottom: 0.75rem;
}
@media (min-width: 768px) {
  .mb-24p {
    margin-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .mb-24p {
    margin-bottom: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .mb-24p {
    margin-bottom: 1.5rem;
  }
}
.mt-24p {
  margin-top: 0.75rem;
}
@media (min-width: 768px) {
  .mt-24p {
    margin-top: 1rem;
  }
}
@media (min-width: 992px) {
  .mt-24p {
    margin-top: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .mt-24p {
    margin-top: 1.5rem;
  }
}
.mb-28p {
  margin-bottom: 1rem;
}
@media (min-width: 576px) {
  .mb-28p {
    margin-bottom: 1.25rem;
  }
}
@media (min-width: 768px) {
  .mb-28p {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 992px) {
  .mb-28p {
    margin-bottom: 1.75rem;
  }
}
.mb-30p {
  margin-bottom: 1rem;
}
@media (min-width: 576px) {
  .mb-30p {
    margin-bottom: 1.25rem;
  }
}
@media (min-width: 768px) {
  .mb-30p {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 992px) {
  .mb-30p {
    margin-bottom: 30px;
  }
}
.mt-30p {
  margin-top: 1rem;
}
@media (min-width: 576px) {
  .mt-30p {
    margin-top: 1.25rem;
  }
}
@media (min-width: 768px) {
  .mt-30p {
    margin-top: 1.5rem;
  }
}
@media (min-width: 992px) {
  .mt-30p {
    margin-top: 30px;
  }
}
.my-32p {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
@media (min-width: 576px) {
  .my-32p {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
  }
}
@media (min-width: 768px) {
  .my-32p {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 992px) {
  .my-32p {
    margin-top: 1.75rem;
    margin-bottom: 1.75rem;
  }
}
@media (min-width: 1200px) {
  .my-32p {
    margin-top: 2rem;
    margin-bottom: 2rem;
  }
}
.mb-32p {
  margin-bottom: 1rem;
}
@media (min-width: 576px) {
  .mb-32p {
    margin-bottom: 1.25rem;
  }
}
@media (min-width: 768px) {
  .mb-32p {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 992px) {
  .mb-32p {
    margin-bottom: 1.75rem;
  }
}
@media (min-width: 1200px) {
  .mb-32p {
    margin-bottom: 2rem;
  }
}
.mb-40p {
  margin-bottom: 1.25rem;
}
@media (min-width: 576px) {
  .mb-40p {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  .mb-40p {
    margin-bottom: 2rem;
  }
}
@media (min-width: 992px) {
  .mb-40p {
    margin-bottom: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .mb-40p {
    margin-bottom: 2.5rem;
  }
}
.mt-40p {
  margin-top: 1.25rem;
}
@media (min-width: 576px) {
  .mt-40p {
    margin-top: 1.5rem;
  }
}
@media (min-width: 768px) {
  .mt-40p {
    margin-top: 2rem;
  }
}
@media (min-width: 992px) {
  .mt-40p {
    margin-top: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .mt-40p {
    margin-top: 2.5rem;
  }
}
.mb-48p {
  margin-bottom: 1.25rem;
}
@media (min-width: 576px) {
  .mb-48p {
    margin-bottom: 1.75rem;
  }
}
@media (min-width: 768px) {
  .mb-48p {
    margin-bottom: 2rem;
  }
}
@media (min-width: 992px) {
  .mb-48p {
    margin-bottom: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .mb-48p {
    margin-bottom: 3rem;
  }
}
.mt-48p {
  margin-top: 1.25rem;
}
@media (min-width: 576px) {
  .mt-48p {
    margin-top: 1.75rem;
  }
}
@media (min-width: 768px) {
  .mt-48p {
    margin-top: 2rem;
  }
}
@media (min-width: 992px) {
  .mt-48p {
    margin-top: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .mt-48p {
    margin-top: 3rem;
  }
}
.mb-60p {
  margin-bottom: 2rem;
}
@media (min-width: 768px) {
  .mb-60p {
    margin-bottom: 2.5rem;
  }
}
@media (min-width: 992px) {
  .mb-60p {
    margin-bottom: 3rem;
  }
}
@media (min-width: 1200px) {
  .mb-60p {
    margin-bottom: 3.5rem;
  }
}
@media (min-width: 1600px) {
  .mb-60p {
    margin-bottom: 60px;
  }
}
.mt-60p {
  margin-top: 2rem;
}
@media (min-width: 768px) {
  .mt-60p {
    margin-top: 2.5rem;
  }
}
@media (min-width: 992px) {
  .mt-60p {
    margin-top: 3rem;
  }
}
@media (min-width: 1200px) {
  .mt-60p {
    margin-top: 3.5rem;
  }
}
@media (min-width: 1600px) {
  .mt-60p {
    margin-top: 60px;
  }
}
.mx-80p {
  margin-left: 2rem;
  margin-right: 2rem;
}
@media (min-width: 576px) {
  .mx-80p {
    margin-left: 2.25rem;
    margin-right: 2.25rem;
  }
}
@media (min-width: 768px) {
  .mx-80p {
    margin-left: 2.5rem;
    margin-right: 2.5rem;
  }
}
@media (min-width: 992px) {
  .mx-80p {
    margin-left: 60px;
    margin-right: 60px;
  }
}
@media (min-width: 1200px) {
  .mx-80p {
    margin-left: 72px;
    margin-right: 72px;
  }
}
@media (min-width: 1400px) {
  .mx-80p {
    margin-left: 5rem;
    margin-right: 5rem;
  }
}

.pb-10p {
  padding-bottom: 0.5rem
}

@media (min-width: 576px) {
  .pb-10p {
    padding-bottom: 0.585rem
  }
}

@media (min-width: 768px) {
  .pb-10p {
    padding-bottom: 0.66rem
  }
}

.p-16p {
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .p-16p {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .p-16p {
    padding: 1rem;
  }
}
.px-16p {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 576px) {
  .px-16p {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
}
@media (min-width: 768px) {
  .px-16p {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
.py-16p {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .py-16p {
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .py-16p {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
.pb-16p {
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .pb-16p {
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .pb-16p {
    padding-bottom: 1rem;
  }
}
.pt-16p {
  padding-top: 0.75rem;
}
@media (min-width: 576px) {
  .pt-16p {
    padding-top: 0.875rem;
  }
}
@media (min-width: 768px) {
  .pt-16p {
    padding-top: 1rem;
  }
}
.p-20p {
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .p-20p {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .p-20p {
    padding: 1rem;
  }
}
@media (min-width: 992px) {
  .p-20p {
    padding: 1.25rem;
  }
}
.px-20p {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 576px) {
  .px-20p {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
}
@media (min-width: 768px) {
  .px-20p {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
@media (min-width: 992px) {
  .px-20p {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}
.py-20p {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .py-20p {
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .py-20p {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .py-20p {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }
}
.pb-20p {
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .pb-20p {
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .pb-20p {
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .pb-20p {
    padding-bottom: 1.25rem;
  }
}
.pt-20p {
  padding-top: 0.75rem;
}
@media (min-width: 576px) {
  .pt-20p {
    padding-top: 0.875rem;
  }
}
@media (min-width: 768px) {
  .pt-20p {
    padding-top: 1rem;
  }
}
@media (min-width: 992px) {
  .pt-20p {
    padding-top: 1.25rem;
  }
}
.p-24p {
  padding: 0.75rem;
}
@media (min-width: 768px) {
  .p-24p {
    padding: 1rem;
  }
}
@media (min-width: 992px) {
  .p-24p {
    padding: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .p-24p {
    padding: 1.5rem;
  }
}
.px-24p {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 768px) {
  .px-24p {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
@media (min-width: 992px) {
  .px-24p {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .px-24p {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
.py-24p {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
@media (min-width: 768px) {
  .py-24p {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .py-24p {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .py-24p {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
.pb-24p {
  padding-bottom: 0.75rem;
}
@media (min-width: 768px) {
  .pb-24p {
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .pb-24p {
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .pb-24p {
    padding-bottom: 1.5rem;
  }
}
.pt-24p {
  padding-top: 0.75rem;
}
@media (min-width: 768px) {
  .pt-24p {
    padding-top: 1rem;
  }
}
@media (min-width: 992px) {
  .pt-24p {
    padding-top: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .pt-24p {
    padding-top: 1.5rem;
  }
}
.p-28p {
  padding: 1rem;
}
@media (min-width: 576px) {
  .p-28p {
    padding: 1.25rem;
  }
}
@media (min-width: 768px) {
  .p-28p {
    padding: 1.5rem;
  }
}
@media (min-width: 992px) {
  .p-28p {
    padding: 1.75rem;
  }
}
.pb-28p {
  padding-bottom: 1rem;
}
@media (min-width: 576px) {
  .pb-28p {
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 768px) {
  .pb-28p {
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 992px) {
  .pb-28p {
    padding-bottom: 1.75rem;
  }
}
.p-30p {
  padding: 1rem;
}
@media (min-width: 576px) {
  .p-30p {
    padding: 1.25rem;
  }
}
@media (min-width: 768px) {
  .p-30p {
    padding: 1.5rem;
  }
}
@media (min-width: 992px) {
  .p-30p {
    padding: 30px;
  }
}
.px-30p {
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 576px) {
  .px-30p {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}
@media (min-width: 768px) {
  .px-30p {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 992px) {
  .px-30p {
    padding-left: 30px;
    padding-right: 30px;
  }
}
.py-30p {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
@media (min-width: 576px) {
  .py-30p {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 768px) {
  .py-30p {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 992px) {
  .py-30p {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}
.pb-30p {
  padding-bottom: 1rem;
}
@media (min-width: 576px) {
  .pb-30p {
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 768px) {
  .pb-30p {
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 992px) {
  .pb-30p {
    padding-bottom: 30px;
  }
}
.pt-30p {
  padding-top: 1rem;
}
@media (min-width: 576px) {
  .pt-30p {
    padding-top: 1.25rem;
  }
}
@media (min-width: 768px) {
  .pt-30p {
    padding-top: 1.5rem;
  }
}
@media (min-width: 992px) {
  .pt-30p {
    padding-top: 30px;
  }
}
.p-32p {
  padding: 1.25rem;
}
@media (min-width: 576px) {
  .p-32p {
    padding: 1.5rem;
  }
}
@media (min-width: 768px) {
  .p-32p {
    padding: 1.75rem;
  }
}
@media (min-width: 992px) {
  .p-32p {
    padding: 2rem;
  }
}
.px-32p {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 576px) {
  .px-32p {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 768px) {
  .px-32p {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}
@media (min-width: 992px) {
  .px-32p {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.py-32p {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
@media (min-width: 576px) {
  .py-32p {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  .py-32p {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
  }
}
@media (min-width: 992px) {
  .py-32p {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.pb-32p {
  padding-bottom: 1.25rem;
}
@media (min-width: 576px) {
  .pb-32p {
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  .pb-32p {
    padding-bottom: 1.75rem;
  }
}
@media (min-width: 992px) {
  .pb-32p {
    padding-bottom: 2rem;
  }
}
.pt-32p {
  padding-top: 1.25rem;
}
@media (min-width: 576px) {
  .pt-32p {
    padding-top: 1.5rem;
  }
}
@media (min-width: 768px) {
  .pt-32p {
    padding-top: 1.75rem;
  }
}
@media (min-width: 992px) {
  .pt-32p {
    padding-top: 2rem;
  }
}
.p-40p {
  padding: 1.25rem;
}
@media (min-width: 576px) {
  .p-40p {
    padding: 1.5rem;
  }
}
@media (min-width: 768px) {
  .p-40p {
    padding: 2rem;
  }
}
@media (min-width: 992px) {
  .p-40p {
    padding: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .p-40p {
    padding: 2.5rem;
  }
}
.px-40p {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 576px) {
  .px-40p {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 768px) {
  .px-40p {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 992px) {
  .px-40p {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .px-40p {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.py-40p {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
@media (min-width: 576px) {
  .py-40p {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  .py-40p {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-width: 992px) {
  .py-40p {
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .py-40p {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.pb-40p {
  padding-bottom: 1.25rem;
}
@media (min-width: 576px) {
  .pb-40p {
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  .pb-40p {
    padding-bottom: 2rem;
  }
}
@media (min-width: 992px) {
  .pb-40p {
    padding-bottom: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .pb-40p {
    padding-bottom: 2.5rem;
  }
}
.p-48p {
  padding: 1.25rem;
}
@media (min-width: 576px) {
  .p-48p {
    padding: 1.75rem;
  }
}
@media (min-width: 768px) {
  .p-48p {
    padding: 2rem;
  }
}
@media (min-width: 992px) {
  .p-48p {
    padding: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .p-48p {
    padding: 3rem;
  }
}
.pt-48p {
  padding-top: 1.25rem;
}
@media (min-width: 576px) {
  .pt-48p {
    padding-top: 1.75rem;
  }
}
@media (min-width: 768px) {
  .pt-48p {
    padding-top: 2rem;
  }
}
@media (min-width: 992px) {
  .pt-48p {
    padding-top: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .pt-48p {
    padding-top: 3rem;
  }
}
.px-60p {
  padding-left: 2rem;
  padding-right: 2rem;
}
@media (min-width: 768px) {
  .px-60p {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-width: 992px) {
  .px-60p {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}
@media (min-width: 1200px) {
  .px-60p {
    padding-left: 3.5rem;
    padding-right: 3.5rem;
  }
}
@media (min-width: 1600px) {
  .px-60p {
    padding-left: 60px;
    padding-right: 60px;
  }
}
.py-60p {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
@media (min-width: 768px) {
  .py-60p {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-width: 992px) {
  .py-60p {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}
@media (min-width: 1200px) {
  .py-60p {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }
}
@media (min-width: 1600px) {
  .py-60p {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.pb-60p {
  padding-bottom: 2rem;
}
@media (min-width: 768px) {
  .pb-60p {
    padding-bottom: 2.5rem;
  }
}
@media (min-width: 992px) {
  .pb-60p {
    padding-bottom: 3rem;
  }
}
@media (min-width: 1200px) {
  .pb-60p {
    padding-bottom: 3.5rem;
  }
}
@media (min-width: 1600px) {
  .pb-60p {
    padding-bottom: 60px;
  }
}
.pt-60p {
  padding-top: 2rem;
}
@media (min-width: 768px) {
  .pt-60p {
    padding-top: 2.5rem;
  }
}
@media (min-width: 992px) {
  .pt-60p {
    padding-top: 3rem;
  }
}
@media (min-width: 1200px) {
  .pt-60p {
    padding-top: 3.5rem;
  }
}
@media (min-width: 1600px) {
  .pt-60p {
    padding-top: 60px;
  }
}
.px-80p {
  padding-left: 2rem;
  padding-right: 2rem;
}
@media (min-width: 576px) {
  .px-80p {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
  }
}
@media (min-width: 768px) {
  .px-80p {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-width: 992px) {
  .px-80p {
    padding-left: 60px;
    padding-right: 60px;
  }
}
@media (min-width: 1200px) {
  .px-80p {
    padding-left: 72px;
    padding-right: 72px;
  }
}
@media (min-width: 1400px) {
  .px-80p {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}
.py-80p {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
@media (min-width: 576px) {
  .py-80p {
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
  }
}
@media (min-width: 768px) {
  .py-80p {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-width: 992px) {
  .py-80p {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
@media (min-width: 1200px) {
  .py-80p {
    padding-top: 72px;
    padding-bottom: 72px;
  }
}
@media (min-width: 1400px) {
  .py-80p {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
}
.size-40p {
  width: 2rem;
  height: 2rem;
}
@media (min-width: 576px) {
  .size-40p {
    width: 2.25rem;
    height: 2.25rem;
  }
}
@media (min-width: 768px) {
  .size-40p {
    width: 2.5rem;
    height: 2.5rem;
  }
}
.size-48p {
  width: 2.25rem;
  height: 2.25rem;
}
@media (min-width: 576px) {
  .size-48p {
    width: 2.5rem;
    height: 2.5rem;
  }
}
@media (min-width: 768px) {
  .size-48p {
    width: 2.75rem;
    height: 2.75rem;
  }
}
@media (min-width: 992px) {
  .size-48p {
    width: 3rem;
    height: 3rem;
  }
}
.size-60p {
  width: 2.5rem;
  height: 2.5rem;
}
@media (min-width: 768px) {
  .size-60p {
    width: 3rem;
    height: 3rem;
  }
}
@media (min-width: 992px) {
  .size-60p {
    width: 60px;
    height: 60px;
  }
}
.size-72p {
  width: 3.5rem;
  height: 3.5rem;
}
@media (min-width: 576px) {
  .size-72p {
    width: 60px;
    height: 60px;
  }
}
@media (min-width: 768px) {
  .size-72p {
    width: 4rem;
    height: 4rem;
  }
}
@media (min-width: 992px) {
  .size-72p {
    width: 72px;
    height: 72px;
  }
}
.size-80p {
  width: 3rem;
  height: 3rem;
}
@media (min-width: 576px) {
  .size-80p {
    width: 60px;
    height: 60px;
  }
}
@media (min-width: 768px) {
  .size-80p {
    width: 4rem;
    height: 4rem;
  }
}
@media (min-width: 992px) {
  .size-80p {
    width: 72px;
    height: 72px;
  }
}
@media (min-width: 1200px) {
  .size-80p {
    width: 5rem;
    height: 5rem;
  }
}
.size-100p {
  width: 60px;
  height: 60px;
}
@media (min-width: 576px) {
  .size-100p {
    width: 72px;
    height: 72px;
  }
}
@media (min-width: 768px) {
  .size-100p {
    width: 5rem;
    height: 5rem;
  }
}
@media (min-width: 992px) {
  .size-100p {
    width: 92px;
    height: 92px;
  }
}
@media (min-width: 1200px) {
  .size-100p {
    width: 100px;
    height: 100px;
  }
}
.size-120p {
  width: 60px;
  height: 60px;
}
@media (min-width: 576px) {
  .size-120p {
    width: 5rem;
    height: 5rem;
  }
}
@media (min-width: 768px) {
  .size-120p {
    width: 86px;
    height: 86px;
  }
}
@media (min-width: 992px) {
  .size-120p {
    width: 6rem;
    height: 6rem;
  }
}
@media (min-width: 1200px) {
  .size-120p {
    width: 7rem;
    height: 7rem;
  }
}
@media (min-width: 1400px) {
  .size-120p {
    width: 120px;
    height: 120px;
  }
}
.size-140p {
  width: 72px;
  height: 72px;
}
@media (min-width: 576px) {
  .size-140p {
    width: 86px;
    height: 86px;
  }
}
@media (min-width: 768px) {
  .size-140p {
    width: 6rem;
    height: 6rem;
  }
}
@media (min-width: 992px) {
  .size-140p {
    width: 7rem;
    height: 7rem;
  }
}
@media (min-width: 1200px) {
  .size-140p {
    width: 120px;
    height: 120px;
  }
}
@media (min-width: 1400px) {
  .size-140p {
    width: 140px;
    height: 140px;
  }
}
.rounded-32 {
  border-radius: 1.5rem;
}
@media (min-width: 576px) {
  .rounded-32 {
    border-radius: 26px;
  }
}
@media (min-width: 768px) {
  .rounded-32 {
    border-radius: 28px;
  }
}
@media (min-width: 992px) {
  .rounded-32 {
    border-radius: 32px;
  }
}
.rounded-24 {
  border-radius: 1rem;
}
@media (min-width: 768px) {
  .rounded-24 {
    border-radius: 20;
  }
}
@media (min-width: 992px) {
  .rounded-24 {
    border-radius: 24px;
  }
}
.rounded-20 {
  border-radius: 0.75rem;
}
@media (min-width: 768px) {
  .rounded-20 {
    border-radius: 1rem;
  }
}
@media (min-width: 992px) {
  .rounded-20 {
    border-radius: 20px;
  }
}
.rounded-16 {
  border-radius: 0.75rem;
}
@media (min-width: 576px) {
  .rounded-16 {
    border-radius: 1rem;
  }
}
.rounded-10 {
  border-radius: 0.5rem;
}
@media (min-width: 576px) {
  .rounded-10 {
    border-radius: 10px;
  }
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-c {
  display: flex;
  align-items: center;
  justify-content: center;
}
.flex-y {
  display: flex;
  align-items: center;
}
.flex-col-c {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.gap-16p {
  gap: 0.75rem;
}
@media (min-width: 576px) {
  .gap-16p {
    gap: 1rem;
  }
}
.gap-20p {
  gap: 0.75rem;
}
@media (min-width: 768px) {
  .gap-20p {
    gap: 1rem;
  }
}
@media (min-width: 992px) {
  .gap-20p {
    gap: 1.25rem;
  }
}
.gap-x-20p {
  -moz-column-gap: 0.75rem;
  column-gap: 0.75rem;
}
@media (min-width: 768px) {
  .gap-x-20p {
    -moz-column-gap: 1rem;
    column-gap: 1rem;
  }
}
@media (min-width: 992px) {
  .gap-x-20p {
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
  }
}
.gap-y-20p {
  row-gap: 0.75rem;
}
@media (min-width: 768px) {
  .gap-y-20p {
    row-gap: 1rem;
  }
}
@media (min-width: 992px) {
  .gap-y-20p {
    row-gap: 1.25rem;
  }
}
.gap-24p {
  gap: 1rem;
}
@media (min-width: 768px) {
  .gap-24p {
    gap: 1.25rem;
  }
}
@media (min-width: 992px) {
  .gap-24p {
    gap: 1.5rem;
  }
}
.gap-x-24p {
  -moz-column-gap: 1rem;
  column-gap: 1rem;
}
@media (min-width: 768px) {
  .gap-x-24p {
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
  }
}
@media (min-width: 992px) {
  .gap-x-24p {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
  }
}
.gap-y-24p {
  row-gap: 1rem;
}
@media (min-width: 768px) {
  .gap-y-24p {
    row-gap: 1.25rem;
  }
}
@media (min-width: 992px) {
  .gap-y-24p {
    row-gap: 1.5rem;
  }
}
.gap-28p {
  gap: 1.25rem;
}
@media (min-width: 768px) {
  .gap-28p {
    gap: 1.5rem;
  }
}
@media (min-width: 992px) {
  .gap-28p {
    gap: 1.75rem;
  }
}
.gap-x-28p {
  -moz-column-gap: 1.25rem;
  column-gap: 1.25rem;
}
@media (min-width: 768px) {
  .gap-x-28p {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
  }
}
@media (min-width: 992px) {
  .gap-x-28p {
    -moz-column-gap: 1.75rem;
    column-gap: 1.75rem;
  }
}
.gap-30p {
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .gap-30p {
    gap: 1.75rem;
  }
}
@media (min-width: 992px) {
  .gap-30p {
    gap: 30px;
  }
}
.gap-x-30p {
  -moz-column-gap: 1.5rem;
  column-gap: 1.5rem;
}
@media (min-width: 768px) {
  .gap-x-30p {
    -moz-column-gap: 1.75rem;
    column-gap: 1.75rem;
  }
}
@media (min-width: 992px) {
  .gap-x-30p {
    -moz-column-gap: 30px;
    column-gap: 30px;
  }
}
.gap-y-30p {
  row-gap: 1.5rem;
}
@media (min-width: 768px) {
  .gap-y-30p {
    row-gap: 1.75rem;
  }
}
@media (min-width: 992px) {
  .gap-y-30p {
    row-gap: 30px;
  }
}
.gap-32p {
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .gap-32p {
    gap: 1.75rem;
  }
}
@media (min-width: 992px) {
  .gap-32p {
    gap: 2rem;
  }
}
.gap-x-32p {
  -moz-column-gap: 1.5rem;
  column-gap: 1.5rem;
}
@media (min-width: 768px) {
  .gap-x-32p {
    -moz-column-gap: 1.75rem;
    column-gap: 1.75rem;
  }
}
@media (min-width: 992px) {
  .gap-x-32p {
    -moz-column-gap: 2rem;
    column-gap: 2rem;
  }
}
.gap-40p {
  gap: 1.5rem;
}
@media (min-width: 576px) {
  .gap-40p {
    gap: 1.75rem;
  }
}
@media (min-width: 768px) {
  .gap-40p {
    gap: 2rem;
  }
}
@media (min-width: 992px) {
  .gap-40p {
    gap: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .gap-40p {
    gap: 2.5rem;
  }
}
.gap-x-40p {
  -moz-column-gap: 1.5rem;
  column-gap: 1.5rem;
}
@media (min-width: 576px) {
  .gap-x-40p {
    -moz-column-gap: 1.75rem;
    column-gap: 1.75rem;
  }
}
@media (min-width: 768px) {
  .gap-x-40p {
    -moz-column-gap: 2rem;
    column-gap: 2rem;
  }
}
@media (min-width: 992px) {
  .gap-x-40p {
    -moz-column-gap: 2.25rem;
    column-gap: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .gap-x-40p {
    -moz-column-gap: 2.5rem;
    column-gap: 2.5rem;
  }
}
.gap-y-40p {
  row-gap: 1.5rem;
}
@media (min-width: 576px) {
  .gap-y-40p {
    row-gap: 1.75rem;
  }
}
@media (min-width: 768px) {
  .gap-y-40p {
    row-gap: 2rem;
  }
}
@media (min-width: 992px) {
  .gap-y-40p {
    row-gap: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .gap-y-40p {
    row-gap: 2.5rem;
  }
}
.gap-x-60p {
  -moz-column-gap: 2.5rem;
  column-gap: 2.5rem;
}
@media (min-width: 768px) {
  .gap-x-60p {
    -moz-column-gap: 3rem;
    column-gap: 3rem;
  }
}
@media (min-width: 992px) {
  .gap-x-60p {
    -moz-column-gap: 3.5rem;
    column-gap: 3.5rem;
  }
}
@media (min-width: 1200px) {
  .gap-x-60p {
    -moz-column-gap: 60px;
    column-gap: 60px;
  }
}
.gap-80p {
  gap: 2.5rem;
}
@media (min-width: 576px) {
  .gap-80p {
    gap: 3rem;
  }
}
@media (min-width: 768px) {
  .gap-80p {
    gap: 3.5rem;
  }
}
@media (min-width: 992px) {
  .gap-80p {
    gap: 60px;
  }
}
@media (min-width: 1200px) {
  .gap-80p {
    gap: 72px;
  }
}
@media (min-width: 1400px) {
  .gap-80p {
    gap: 5rem;
  }
}
.\!container {
  margin-left: auto;
  margin-right: auto;
}
@media not all and (min-width: 768px) {
  .\!container {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}
@media (min-width: 576px) {
  .\!container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .\!container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .\!container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .\!container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .\!container {
    max-width: 1296px;
  }
}
@media (min-width: 1600px) {
  .\!container {
    max-width: 1650px;
  }
}
.container {
  margin-left: auto;
  margin-right: auto;
}
@media not all and (min-width: 768px) {
  .container {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}
@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .container {
    max-width: 1296px;
  }
}
@media (min-width: 1600px) {
  .container {
    max-width: 1650px;
  }
}
.menu {
  transition: all 0.5s ease-in-out;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .menu {
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .menu {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
.menu {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.menu .active {
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(156 171 185 / var(--tw-border-opacity));
}
.menu .active:hover {
  --tw-border-opacity: 1;
  border-color: rgb(156 171 185 / var(--tw-border-opacity));
}
.submenu-icon {
  transition: all 0.5s ease-in-out;
  margin-left: 0.25rem;
  font-size: 1rem;
  line-height: 1.5rem;
}
.group:hover .submenu-icon {
  --tw-rotate: 180deg;
  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));
}
.submenu {
  transition: all 0.5s ease-in-out;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.submenu:hover {
  cursor: pointer;
}
@media (min-width: 576px) {
  .submenu {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
.submenu.active .submenu-btn {
  border-bottom-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(156 171 185 / var(--tw-border-opacity));
}
.submenu-link {
  transition: all 0.5s ease-in-out;
  width: 100%;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.submenu-link:hover {
  background-color: rgb(156 171 185 / var(--tw-bg-opacity));
  --tw-bg-opacity: 0.2;
}
.submenu-link a {
  display: block;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.submenu-link .active {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.mobail-menu {
  transition: all 0.5s ease-in-out;
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .mobail-menu {
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .mobail-menu {
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .mobail-menu {
    padding-bottom: 1.25rem;
  }
}
.mobail-menu {
  width: 100%;
  border-bottom-width: 1px;
  border-color: rgb(156 171 185 / 0.6);
  font-family: Prompt;
  font-size: 1.125rem;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.mobail-menu:hover {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
@media (min-width: 576px) {
  .mobail-menu {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.mobail-menu .active {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.mobail-submenu {
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .mobail-submenu {
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .mobail-submenu {
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .mobail-submenu {
    padding-bottom: 1.25rem;
  }
}
.mobail-submenu {
  position: relative;
  width: 100%;
  cursor: pointer;
  border-bottom-width: 1px;
  border-color: rgb(156 171 185 / 0.6);
}
.mobail-submenu .active {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.mobail-submenu-btn {
  transition: all 0.5s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: Prompt;
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.mobail-submenu-btn:hover {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
@media (min-width: 576px) {
  .mobail-submenu-btn {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.mobail-submenu-icon {
  transition: all 0.5s ease-in-out;
  margin-left: 0.25rem;
  font-size: 1.5rem;
  line-height: 2rem;
}
.group:hover .mobail-submenu-icon {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.tab-navbar a {
  font-family: Prompt;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
  display: block;
  line-height: 130%;
  color: clac(1.25rem+0.5vw);
}
@media (min-width: 1200px) {
  .tab-navbar a {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.tab-navbar a {
  --tw-border-spacing-y: 0.5rem;
  border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
  border-bottom-width: 2px;
  border-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.tab-navbar a.active {
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.side-navbar-one .nav-item.active {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.navbar-overly {
  transition: all 0.7s ease-in-out;
  position: absolute;
  inset: 0px;
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
}
@media not all and (min-width: 768px) {
  .navbar-overly {
    background-color: rgb(3 3 4 / 0.25);
  }
}
.breadcrumb {
  display: flex;
  list-style-type: none;
  flex-wrap: wrap;
  align-items: center;
}
.breadcrumb-item {
  display: flex;
  align-items: center;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.breadcrumb-item:last-child .breadcrumb-icon {
  display: none;
}
.breadcrumb-item:last-child .breadcrumb-current {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.breadcrumb .breadcrumb-link {
  transition: all 0.5s ease-in-out;
}
.breadcrumb .breadcrumb-link:hover {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.breadcrumb .breadcrumb-icon {
  transition: all 0.5s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 0.375rem;
  margin-right: 0.375rem;
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .breadcrumb .breadcrumb-icon {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.badge {
  transition: all 0.5s ease-in-out;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  border-radius: 0.75rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
}
@media (min-width: 576px) {
  .badge {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}
.badge .ti {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .badge .ti {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.badge-circle {
  height: 1.25rem;
  width: 1.25rem;
  border-radius: 9999px;
  padding: 0px;
}
.badge-dot {
  height: 0.5rem;
  width: 0.5rem;
  border-radius: 9999px;
  padding: 0px;
}
.badge-rounded {
  border-radius: 9999px;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.badge-xs {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  font-weight: 400;
}
.badge-compact {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-weight: 400;
}
.badge-base {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.badge-smm {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
@media (min-width: 576px) {
  .badge-smm {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
.badge-sm {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
@media (min-width: 576px) {
  .badge-sm {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
.badge-md {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 576px) {
  .badge-md {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
}
@media (min-width: 768px) {
  .badge-md {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
@media (min-width: 992px) {
  .badge-md {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}
.badge-md {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
@media (min-width: 576px) {
  .badge-md {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}
.badge-lg {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 768px) {
  .badge-lg {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
@media (min-width: 992px) {
  .badge-lg {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .badge-lg {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
.badge-lg {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
@media (min-width: 576px) {
  .badge-lg {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}
.badge-xl {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 576px) {
  .badge-xl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 768px) {
  .badge-xl {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}
@media (min-width: 992px) {
  .badge-xl {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.badge-xl {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
@media (min-width: 576px) {
  .badge-xl {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}
.badge-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  /* color: rgb(3 3 4 / var(--tw-text-opacity)); */
}
.badge-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.badge-danger {
  --tw-bg-opacity: 1;
  background-color: rgb(235 58 58 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-light {
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(254 254 254 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(14 16 18 / var(--tw-text-opacity));
}
.badge-neutral {
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-neutral-2 {
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(35 38 39 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-neutral-3 {
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-glass {
  border-radius: 12px;
  background-color: rgba(0, 0, 0, 0.5);
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-outline-primary {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(3 3 4 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-outline-shap {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(33 37 41 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-ring-accent-1 {
  width: 0.75rem;
  height: 0.75rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(52 56 57 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(237 102 197 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.badge-box-neutral-1 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(52 56 57 / var(--tw-bg-opacity));
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.avatar {
  position: relative;
  border-radius: 9999px;
}
.avatar-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(220 138 57 / var(--tw-bg-opacity));
}
.avatar .status-badge {
  position: absolute;
  bottom: -0.5rem;
  right: -0.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .avatar .status-badge {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.avatar .status-badge.online {
  --tw-text-opacity: 1;
  color: rgb(69 248 130 / var(--tw-text-opacity));
}
.avatar .status-badge.offline {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.btn {
  transition: all 0.5s ease-in-out;
  display: inline-flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 9999px;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-family: Prompt;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.btn:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.btn:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
@media (min-width: 992px) {
  .btn {
    gap: 0.75rem;
  }
}
.btn-xs {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
@media (min-width: 576px) {
  .btn-xs {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
  }
}
@media (min-width: 768px) {
  .btn-xs {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}
.btn-sm {
  font-weight: 400;
  font-size: 0.9rem;
  line-height: 1.25rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
@media (min-width: 576px) {
  .btn-sm {
    font-weight: 400;
    font-size: 0.9rem;
    line-height: 1.25rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
}
@media (min-width: 768px) {
  .btn-sm {
    font-weight: 400;
    font-size: 0.9rem;
    line-height: 1.25rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
  }
}
.btn-md {
  padding-left: 0.875rem;
  padding-right: 0.875rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
@media (min-width: 576px) {
  .btn-md {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
  }
}
@media (min-width: 768px) {
  .btn-md {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}
@media (min-width: 992px) {
  .btn-md {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
.btn-lg {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .btn-lg {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .btn-lg {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .btn-lg {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.btn-lg-2 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
@media (min-width: 576px) {
  .btn-lg-2 {
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 768px) {
  .btn-lg-2 {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
}
@media (min-width: 992px) {
  .btn-lg-2 {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.btn-xl {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
@media (min-width: 576px) {
  .btn-xl {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
}
@media (min-width: 768px) {
  .btn-xl {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .btn-xl {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 1200px) {
  .btn-xl {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.btn-group > .btn {
  border-radius: 0px;
}
.btn-group > .btn:first-child {
  border-top-left-radius: 0.125rem;
  border-bottom-left-radius: 0.125rem;
}
.btn-group > .btn:last-child {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
  border-left-width: 0px;
}
.btn-group > .btn:not(:first-child):not(:last-child) {
  border-left-width: 0px;
}
.btn-group.rounded .btn:first-child {
  border-top-left-radius: 9999px;
  border-bottom-left-radius: 9999px;
}
.btn-group.rounded .btn:last-child {
  border-top-right-radius: 9999px;
  border-bottom-right-radius: 9999px;
}
.btn-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-secondary:hover {
  background-color: rgb(69 248 130 / 0.9);
}
.btn-danger {
  --tw-bg-opacity: 1;
  background-color: rgb(235 58 58 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.btn-danger:hover {
  background-color: rgb(235 58 58 / 0.9);
}
.btn-red {
  background-color: #FF0033;
  color: #FFFFFF;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  z-index: 1;
}
.btn-red::before {
  content: "";
  width: 0;
  height: 100vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  background: #FF3355;
  transition: 0.5s ease;
  display: block;
  z-index: -1;
}
.btn-red:hover {
  color: #FFF !important;
}
.btn-red:hover::before {
  width: 150%;
}
.btn-neutral-1 {
  --tw-bg-opacity: 1;
  background-color: rgb(52 56 57 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.btn-neutral-1:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-neutral-2 {
  --tw-bg-opacity: 1;
  background-color: rgb(35 38 39 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.btn-neutral-2:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-neutral-3 {
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.btn-neutral-3:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-neutral-4 {
  --tw-bg-opacity: 1;
  background-color: rgb(3 3 4 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.btn-neutral-4:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-violet {
  background-color: #D5057F;
  color: #FFFFFF;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  z-index: 1;
}
.btn-violet::before {
  content: "";
  width: 0;
  height: 100vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  background: #45f882;
  transition: 0.5s ease;
  display: block;
  z-index: -1;
}
.btn-violet:hover {
  color: #13203b !important;
}
.btn-violet:hover::before {
  width: 150%;
}
.btn-green {
  background-color: #26c026;
  color: #FFFFFF;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  z-index: 1;
}
.btn-green::before {
  content: "";
  width: 0;
  height: 100vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  background: #39e439;
  /* background: #45f882; */
  transition: 0.5s ease;
  display: block;
  z-index: -1;
}
.btn-green:hover {
  color: #FFF !important;
  /* color: #13203b !important; */
}
.btn-green:hover::before {
  width: 150%;
}
.btn-outline-secondary {
  border-width: 1px;
  border-color: #45f88266;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.btn-outline-secondary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-socal-primary {
  transition: all 0.5s ease-in-out;
  width: 2rem;
  height: 2rem;
}
@media (min-width: 576px) {
  .btn-socal-primary {
    width: 2.25rem;
    height: 2.25rem;
  }
}
@media (min-width: 768px) {
  .btn-socal-primary {
    width: 2.5rem;
    height: 2.5rem;
  }
}
.btn-socal-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(35 38 39 / var(--tw-bg-opacity));
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .btn-socal-primary {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.btn-socal-primary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.pagination {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 0.75rem;
}
@media (min-width: 576px) {
  .pagination {
    gap: 1rem;
  }
}
@media (min-width: 768px) {
  .pagination {
    gap: 1.25rem;
  }
}
.pagination-center {
  justify-content: center;
}
.pagination-list {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
@media (min-width: 576px) {
  .pagination-list {
    gap: 1rem;
  }
}
@media (min-width: 768px) {
  .pagination-list {
    gap: 1.25rem;
  }
}
@media (min-width: 992px) {
  .pagination-list {
    gap: 1.5rem;
  }
}
.pagination-item {
  transition: all 0.5s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
}
.pagination-primary .pagination-item {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.pagination-primary .pagination-item:hover {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.pagination-primary .pagination-item.active {
  width: 2.5rem;
  height: 2.5rem;
}
@media (min-width: 768px) {
  .pagination-primary .pagination-item.active {
    width: 3rem;
    height: 3rem;
  }
}
@media (min-width: 992px) {
  .pagination-primary .pagination-item.active {
    width: 60px;
    height: 60px;
  }
}
.pagination-primary .pagination-item.active {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.pagination-secondary .pagination-item:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.pagination-secondary .pagination-item.active {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.pagination-prev,
.pagination-next {
  display: flex;
  align-items: center;
  justify-content: center;
}
.pagination-primary .pagination-prev,
.pagination-primary .pagination-next {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.pagination-secondary .pagination-prev,
.pagination-secondary .pagination-next {
  --tw-text-opacity: 1;
  color: rgb(69 248 130 / var(--tw-text-opacity));
}
.pagination-xl {
  width: 2.5rem;
  height: 2.5rem;
}
@media (min-width: 768px) {
  .pagination-xl {
    width: 3rem;
    height: 3rem;
  }
}
@media (min-width: 992px) {
  .pagination-xl {
    width: 60px;
    height: 60px;
  }
}
.pagination-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .pagination-xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.library-card {
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .library-card {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .library-card {
    padding: 1rem;
  }
}
@media (min-width: 992px) {
  .library-card {
    padding: 1.25rem;
  }
}
.library-card {
  border-radius: 1.5rem;
}
@media (min-width: 576px) {
  .library-card {
    border-radius: 26px;
  }
}
@media (min-width: 768px) {
  .library-card {
    border-radius: 28px;
  }
}
@media (min-width: 992px) {
  .library-card {
    border-radius: 32px;
  }
}
.library-card {
  position: relative;
  height: 220px;
  width: 100%;
  overflow: hidden;
}
.library-card::after {
  position: absolute;
  inset: 0px;
  background-image: linear-gradient(to top, var(--tw-gradient-stops));
  --tw-gradient-from: rgba(3, 3, 4, 0.9) -3.02% var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: rgba(3, 3, 4, 0) 99.06% var(--tw-gradient-to-position);
  content: var(--tw-content);
  opacity: 0.6;
}
@media (min-width: 576px) {
  .library-card {
    height: 260px;
  }
}
@media (min-width: 768px) {
  .library-card {
    height: 260px;
  }
}
@media (min-width: 992px) {
  .library-card {
    height: 280px;
  }
}
@media (min-width: 1200px) {
  .library-card {
    height: 300px;
  }
}
.dropdown {
  position: relative;
  display: flex;
  flex-direction: column;
}
.dropdown-toggle {
  display: inline-flex;
  cursor: pointer;
  align-items: center;
  gap: 0.5rem;
}
.dropdown-content {
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .dropdown-content {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .dropdown-content {
    padding: 1rem;
  }
}
.dropdown-content {
  border-radius: 0.5rem;
}
@media (min-width: 576px) {
  .dropdown-content {
    border-radius: 10px;
  }
}
.dropdown-content {
  position: absolute;
  top: 3rem;
  right: 0px;
  z-index: 10;
  display: grid;
  max-height: 240px;
  width: 200px;
  max-width: 24rem;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  row-gap: 0.5rem;
  overflow-y: auto;
  border-radius: 10px;
  --tw-bg-opacity: 1;
  background-color: rgb(35 38 39 / var(--tw-bg-opacity));
}
.dropdown-content::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  padding-left: 4px;
  background-color: rgba(0, 0, 0, 0);
}
.dropdown-item {
  transition: all 0.5s ease-in-out;
  display: inline-flex;
  width: 100%;
  cursor: pointer;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-radius: 0.5rem;
  padding: 0.5rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.dropdown-item:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.dropdown-item.active {
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.link-1 {
  transition: all 0.5s ease-in-out;
}
.link-1:hover {
  --tw-text-opacity: 1;
  color: rgb(69 248 130 / var(--tw-text-opacity));
}
.app-layout {
  min-height: 100vh;
}
@media (min-width: 992px) {
  .app-layout {
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 268px);
  }
}
.counter-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  font-size: 10px;
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.black-btn,
.btn-primary,
.outline-btn {
  background-color: #7328CC /* F29620 */;
  color: #FFFFFF; /* #030304 */;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  z-index: 1;
}
.black-btn::before,
.btn-primary::before,
.outline-btn::before {
  content: "";
  width: 0;
  height: 100vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  background: #a126ff;
  /* background: #45f882; */
  transition: 0.5s ease;
  display: block;
  z-index: -1;
}
.black-btn:hover,
.btn-primary:hover,
.outline-btn:hover {
  color: #FFF !important;
  /* color: #13203b !important; */
}
.black-btn:hover::before,
.btn-primary:hover::before,
.outline-btn:hover::before {
  width: 150%;
}
.overlay-1 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    270deg,
    rgba(38, 38, 38, 0.36) 0%,
    rgba(19, 19, 19, 0.36) 21.5%,
    rgba(0, 0, 0, 0.72) 62.71%
  );
}
.overlay-2 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(8, 8, 8, 0.2) 0%,
    rgba(8, 8, 8, 0.6) 45.89%,
    rgba(8, 8, 8, 0.9) 100%
  );
  background: linear-gradient(
    270deg,
    rgba(38, 38, 38, 0.36) 0%,
    rgba(19, 19, 19, 0.36) 21.5%,
    rgba(0, 0, 0, 0.72) 62.71%
  );
}
.overlay-3 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(34, 34, 34, 0.2) 0%,
    rgba(0, 0, 0, 0.2) 100%
  );
}
.overlay-6 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(0deg, #0e1012 0%, rgba(14, 16, 18, 0.24) 98.02%);
}
.overlay-7 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(54, 54, 54, 0) 0%, #0f1115 92.33%);
}
.overlay-9 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(59, 59, 59, 0.39) 0%,
    rgba(0, 0, 0, 0.73) 100%
  );
}
.overlay-10 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    270deg,
    rgba(0, 0, 0, 0.3) 0%,
    rgba(0, 0, 0, 0.7) 57.38%,
    rgba(0, 0, 0, 0.8) 100%
  );
}
.overlay-11 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.4) 0%,
    rgba(0, 0, 0, 0.8) 100%
  );
}
.overlay-50 {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(    90deg,
    rgba(0, 0, 0, 0.8) 0%,
    rgba(0, 0, 0, 0.2) 50%,
    rgba(0, 0, 0, 0.1) 100%

  );
}
.progressbar-1 {
  position: relative;
  height: 100%;
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  transition-duration: 300ms;
}
.progressbar-1::before {
  position: absolute;
  top: 50%;
  right: 0px;
  height: 1.25rem;
  width: 0.875rem;
  --tw-translate-y: -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));
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-content: "";
  content: var(--tw-content);
}
.swp-navigation-one {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.swp-navigation-one .navigation-btn-one {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
  transition: all 0.5s ease-in-out;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.swp-navigation-one .navigation-btn-one:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.swp-navigation-one .navigation-btn-one:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.swp-navigation-one .navigation-btn-one {
  width: 2.25rem;
  height: 2.25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .swp-navigation-one .navigation-btn-one {
    font-size: 1.5rem;
    line-height: 2rem;
    width: 2.5rem;
    height: 2.5rem;
  }
}
.swp-navigation-one .navigation-btn-one:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.swp-navigation-one .navigation-btn-two {
  width: 2.5rem;
  height: 2.5rem;
}
@media (min-width: 768px) {
  .swp-navigation-one .navigation-btn-two {
    width: 3rem;
    height: 3rem;
  }
}
@media (min-width: 992px) {
  .swp-navigation-one .navigation-btn-two {
    width: 60px;
    height: 60px;
  }
}
.swp-navigation-one .navigation-btn-two {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border-width: 1px;
  border-style: dashed;
  border-color: rgb(254 254 254 / 0.4);
}
.swp-navigation-one .navigation-btn-two:hover {
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.swp-navigation-one .navigation-btn-two:hover > * {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
}
.bracket {
  position: relative;
}
.bracket::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 25px;
  height: calc(55% + 4px);
  border: 2px solid #212529;
  border-left: 0px;
  border-radius: 0px 10px 10px 0px;
  right: -35px;
}
@media screen and (max-width: 400px) {
  .bracket::after {
    right: -15px;
  }
}
@media screen and (max-width: 992px) {
  .bracket::after {
    right: -20px;
    width: 20px;
  }
}
@media screen and (min-width: 1400px) {
  .bracket::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -62px;
    width: 28px;
    height: 2px;
    background-color: #212529;
  }
}
.stroked-text-1 {
  position: relative;
  display: inline-block;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #45f882;
}
.stroked-text-1::after {
  content: attr(data-text);
  position: absolute;
  top: -5px;
  left: -6px;
  z-index: -1;
  color: rgba(0, 0, 0, 0);
  -webkit-text-stroke: 1px #45f882;
  color: #000;
  transition: all 0.4s ease-out;
}
.stroked-text-1:hover::after {
  top: 5px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.visible {
  visibility: visible;
}
.invisible {
  visibility: hidden;
}
.collapse {
  visibility: collapse;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.sticky {
  position: sticky;
}
.inset-0 {
  inset: 0px;
}
.\!bottom-10 {
  bottom: 2.5rem !important;
}
.-bottom-0 {
  bottom: -0px;
}
.-bottom-3 {
  bottom: -0.75rem;
}
.-bottom-4 {
  bottom: -1rem;
}
.-bottom-5 {
  bottom: -1.25rem;
}
.-bottom-6 {
  bottom: -1.5rem;
}
.-right-3 {
  right: -0.75rem;
}
.-right-5 {
  right: -1.25rem;
}
.-top-3 {
  top: -0.75rem;
}
.-top-5 {
  top: -1.25rem;
}
.bottom-0 {
  bottom: 0px;
}
.left-0 {
  left: 0px;
}
.left-1\/2 {
  left: 50%;
}
.left-10 {
  left: 2.5rem;
}
.left-2 {
  left: 0.5rem;
}
.left-3 {
  left: 0.75rem;
}
.left-4 {
  left: 1rem;
}
.left-5 {
  left: 1.25rem;
}
.left-9 {
  left: 2.25rem;
}
.right-0 {
  right: 0px;
}
.right-3 {
  right: 0.75rem;
}
.right-4 {
  right: 1rem;
}
.right-5 {
  right: 1.25rem;
}
.top-0 {
  top: 0px;
}
.top-1\/2 {
  top: 50%;
}
.top-15 {
  top: 60px;
}
.top-2 {
  top: 0.5rem;
}
.top-3 {
  top: 0.75rem;
}
.top-4 {
  top: 1rem;
}
.top-5 {
  top: 1.25rem;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-30 {
  z-index: 30;
}
.z-50 {
  z-index: 50;
}
.z-\[1\] {
  z-index: 1;
}
.z-\[2\] {
  z-index: 2;
}
.z-\[3\] {
  z-index: 3;
}
.z-\[4\] {
  z-index: 4;
}
.z-\[5\] {
  z-index: 5;
}
.z-\[999\] {
  z-index: 999;
}
.z-\[99\] {
  z-index: 99;
}
.order-1 {
  order: 1;
}
.order-2 {
  order: 2;
}
.order-3 {
  order: 3;
}
.order-4 {
  order: 4;
}
.col-span-10 {
  grid-column: span 10 / span 10;
}
.col-span-12 {
  grid-column: span 12 / span 12;
}
.col-span-2 {
  grid-column: span 2 / span 2;
}
.col-span-4 {
  grid-column: span 4 / span 4;
}
.col-span-5 {
  grid-column: span 5 / span 5;
}
.col-span-8 {
  grid-column: span 8 / span 8;
}
.col-span-9 {
  grid-column: span 9 / span 9;
}
.mx-3 {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
.mx-5 {
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.my-2\.5 {
  margin-top: 0.625rem;
  margin-bottom: 0.625rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.-mt-10 {
  margin-top: -2.5rem;
}
.-mt-20 {
  margin-top: -5rem;
}
.-mt-56 {
  margin-top: -14rem;
}
.mb-0 {
  margin-bottom: 0px;
}
.mb-0\.5 {
  margin-bottom: 0.125rem;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-10 {
  margin-bottom: 2.5rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-2\.5 {
  margin-bottom: 0.625rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-5 {
  margin-bottom: 1.25rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-\[30px\] {
  margin-bottom: 30px;
}
.ml-1 {
  margin-left: 0.25rem;
}
.ml-3 {
  margin-left: 0.75rem;
}
.ml-5 {
  margin-left: 1.25rem;
}
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.\!flex {
  display: flex !important;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.table {
  display: table;
}
.grid {
  display: grid;
}
.inline-grid {
  display: inline-grid;
}
.hidden {
  display: none;
}
.aspect-square {
  aspect-ratio: 1 / 1;
}
.size-1 {
  width: 0.25rem;
  height: 0.25rem;
}
.size-12 {
  width: 3rem;
  height: 3rem;
}
.size-15 {
  width: 60px;
  height: 60px;
}
.size-28 {
  width: 7rem;
  height: 7rem;
}
.size-3 {
  width: 0.75rem;
  height: 0.75rem;
}
.size-5 {
  width: 1.25rem;
  height: 1.25rem;
}
.size-6 {
  width: 1.5rem;
  height: 1.5rem;
}
.size-7 {
  width: 1.75rem;
  height: 1.75rem;
}
.size-8 {
  width: 2rem;
  height: 2rem;
}
.size-\[102px\] {
  width: 102px;
  height: 102px;
}
.size-\[120px\] {
  width: 120px;
  height: 120px;
}
.size-\[280px\] {
  width: 280px;
  height: 280px;
}
.size-\[60px\] {
  width: 60px;
  height: 60px;
}
.size-\[74px\] {
  width: 74px;
  height: 74px;
}
.h-0 {
  height: 0px;
}
.h-0\.5 {
  height: 0.125rem;
}
.h-16 {
  height: 4rem;
}
.h-18 {
  height: 72px;
}
.h-1px {
  height: 1px;
}
.h-2 {
  height: 0.5rem;
}
.h-2\.5 {
  height: 0.625rem;
}
.h-24 {
  height: 6rem;
}
.h-4 {
  height: 1rem;
}
.h-5 {
  height: 1.25rem;
}
.h-6 {
  height: 1.5rem;
}
.h-\[40px\] {
  height: 40px;
}
.h-\[114px\] {
  height: 114px;
}
.h-\[140px\] {
  height: 140px;
}
.h-\[142px\] {
  height: 142px;
}
.h-\[156px\] {
  height: 156px;
}
.h-\[180px\] {
  height: 180px;
}
.h-\[200px\] {
  height: 200px;
}
.h-\[202px\] {
  height: 202px;
}
.h-\[220px\] {
  height: 220px;
}
.h-\[225px\] {
  height: 225px;
}
.h-\[240px\] {
  height: 240px;
}
.h-\[280px\] {
  height: 280px;
}
.h-\[286px\] {
  height: 286px;
}
.h-\[300px\] {
  height: 300px;
}
.h-\[320px\] {
  height: 320px;
}
.h-\[380px\] {
  height: 380px;
}
.h-\[400px\] {
  height: 400px;
}
.h-\[416px\] {
  height: 416px;
}
.h-\[420px\] {
  height: 420px;
}
.h-\[700px\] {
  height: 700px;
}
.h-\[70px\] {
  height: 70px;
}
.h-\[90px\] {
  height: 90px;
}
.h-auto {
  height: auto;
}
.h-fit {
  height: -moz-fit-content;
  height: fit-content;
}
.h-full {
  height: 100%;
}
.h-screen {
  height: 100vh;
}
.max-h-\[136px\] {
  max-height: 136px;
}
.max-h-\[288px\] {
  max-height: 288px;
}
.max-h-\[540px\] {
  max-height: 540px;
}
.max-h-screen {
  max-height: 100vh;
}
.max-h-svh {
  max-height: 100svh;
}
.min-h-\[200vh\] {
  min-height: 200vh;
}
.min-h-screen {
  min-height: 100vh;
}
.\!w-\[260px\] {
  width: 260px !important;
}
.\!w-\[276px\] {
  width: 276px !important;
}
.\!w-fit {
  width: -moz-fit-content !important;
  width: fit-content !important;
}
.w-11 {
  width: 2.75rem;
}
.w-1px {
  width: 1px;
}
.w-20 {
  width: 5rem;
}
.w-25 {
  width: 100px;
}
.w-28 {
  width: 7rem;
}
.w-3 {
  width: 0.75rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-30 {
  width: 120px;
}
.w-6 {
  width: 1.5rem;
}
.w-\[110px\] {
  width: 110px;
}
.w-\[132px\] {
  width: 132px;
}
.w-\[142px\] {
  width: 142px;
}
.w-\[144px\] {
  width: 144px;
}
.w-\[180px\] {
  width: 180px;
}
.w-\[220px\] {
  width: 220px;
}
.w-\[268px\] {
  width: 268px;
}
.w-\[280px\] {
  width: 280px;
}
.w-\[294px\] {
  width: 294px;
}
.w-\[30px\] {
  width: 30px;
}
.w-\[42px\] {
  width: 42px;
}
.w-\[67px\] {
  width: 67px;
}
.w-auto {
  width: auto;
}
.w-fit {
  width: -moz-fit-content;
  width: fit-content;
}
.w-full {
  width: 100%;
}
.w-screen {
  width: 100vw;
}
.min-w-10 {
  min-width: 2.5rem;
}
.min-w-12 {
  min-width: 3rem;
}
.min-w-25 {
  min-width: 100px;
}
.min-w-30 {
  min-width: 120px;
}
.min-w-\[144px\] {
  min-width: 144px;
}
.min-w-\[180px\] {
  min-width: 180px;
}
.min-w-\[216px\] {
  min-width: 216px;
}
.min-w-\[232px\] {
  min-width: 232px;
}
.min-w-\[240px\] {
  min-width: 240px;
}
.min-w-\[280px\] {
  min-width: 280px;
}
.min-w-\[300px\] {
  min-width: 300px;
}
.min-w-\[320px\] {
  min-width: 320px;
}
.min-w-full {
  min-width: 100%;
}
.max-w-18 {
  max-width: 72px;
}
.max-w-\[110px\] {
  max-width: 110px;
}
.max-w-\[1230px\] {
  max-width: 1230px;
}
.max-w-\[230px\] {
  max-width: 230px;
}
.max-w-\[300px\] {
  max-width: 300px;
}
.max-w-\[364px\] {
  max-width: 364px;
}
.max-w-\[390px\] {
  max-width: 390px;
}
.max-w-\[500px\] {
  max-width: 500px;
}
.max-w-\[528px\] {
  max-width: 528px;
}
.max-w-\[530px\] {
  max-width: 530px;
}
.max-w-\[566px\] {
  max-width: 566px;
}
.max-w-\[616px\] {
  max-width: 616px;
}
.max-w-\[670px\] {
  max-width: 670px;
}
.max-w-\[680px\] {
  max-width: 680px;
}
.max-w-\[754px\] {
  max-width: 754px;
}
.max-w-\[790px\] {
  max-width: 790px;
}
.max-w-\[90px\] {
  max-width: 90px;
}
.max-w-fit {
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.max-w-screen-sm {
  max-width: 576px;
}
.flex-none {
  flex: none;
}
.shrink-0 {
  flex-shrink: 0;
}
.grow {
  flex-grow: 1;
}
.-translate-x-1\/2 {
  --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));
}
.-translate-x-5 {
  --tw-translate-x: -1.25rem;
  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));
}
.-translate-x-full {
  --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));
}
.-translate-y-1\/2 {
  --tw-translate-y: -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));
}
.translate-x-full {
  --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));
}
.-rotate-180 {
  --tw-rotate: -180deg;
  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));
}
.rotate-0 {
  --tw-rotate: 0deg;
  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));
}
.rotate-180 {
  --tw-rotate: 180deg;
  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));
}
.transform {
  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));
}
.cursor-pointer {
  cursor: pointer;
}
.list-outside {
  list-style-position: outside;
}
.list-decimal {
  list-style-type: decimal;
}
.list-disc {
  list-style-type: disc;
}
.list-none {
  list-style-type: none;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-10 {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}
.grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.grid-cols-8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}
.grid-cols-9 {
  grid-template-columns: repeat(9, minmax(0, 1fr));
}
.flex-col {
  flex-direction: column;
}
.flex-wrap {
  flex-wrap: wrap;
}
.flex-wrap-reverse {
  flex-wrap: wrap-reverse;
}
.flex-nowrap {
  flex-wrap: nowrap;
}
.items-start {
  align-items: flex-start;
}
.items-end {
  align-items: flex-end;
}
.items-center {
  align-items: center;
}
.items-baseline {
  align-items: baseline;
}
.justify-normal {
  justify-content: normal;
}
.justify-start {
  justify-content: flex-start;
}
.justify-end {
  justify-content: flex-end;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.justify-around {
  justify-content: space-around;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-2\.5 {
  gap: 0.625rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-3\.5 {
  gap: 0.875rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-x-2 {
  -moz-column-gap: 0.5rem;
  column-gap: 0.5rem;
}
.gap-x-5 {
  -moz-column-gap: 1.25rem;
  column-gap: 1.25rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.gap-y-10 {
  row-gap: 2.5rem;
}
.gap-y-2 {
  row-gap: 0.5rem;
}
.gap-y-3 {
  row-gap: 0.75rem;
}
.divide-x > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-x-reverse: 0;
  border-right-width: calc(1px * var(--tw-divide-x-reverse));
  border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
}
.divide-x-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-x-reverse: 0;
  border-right-width: calc(2px * var(--tw-divide-x-reverse));
  border-left-width: calc(2px * calc(1 - var(--tw-divide-x-reverse)));
}
.divide-y > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.divide-y-\[12px\] > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(12px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(12px * var(--tw-divide-y-reverse));
}
.divide-y-\[16px\] > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(16px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(16px * var(--tw-divide-y-reverse));
}
.divide-solid > :not([hidden]) ~ :not([hidden]) {
  border-style: solid;
}
.divide-dashed > :not([hidden]) ~ :not([hidden]) {
  border-style: dashed;
}
.divide-b-neutral-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(35 38 39 / var(--tw-divide-opacity));
}
.divide-b-neutral-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(3 3 4 / var(--tw-divide-opacity));
}
.divide-shap > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(33 37 41 / var(--tw-divide-opacity));
}
.divide-shap\/70 > :not([hidden]) ~ :not([hidden]) {
  border-color: rgb(33 37 41 / 0.7);
}
.overflow-auto {
  overflow: auto;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-visible {
  overflow: visible;
}
.overflow-x-auto {
  overflow-x: auto;
}
.overflow-y-auto {
  overflow-y: auto;
}
.overflow-x-hidden {
  overflow-x: hidden;
}
.overflow-y-scroll {
  overflow-y: scroll;
}
.\!whitespace-nowrap {
  white-space: nowrap !important;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.rounded-10 {
  border-radius: 10px;
}
.rounded-12 {
  border-radius: 12px;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-4 {
  border-radius: 4px;
}
.rounded-8 {
  border-radius: 8px;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: 0.5rem;
}
.rounded-b-12 {
  border-bottom-right-radius: 12px;
  border-bottom-left-radius: 12px;
}
.rounded-t-12 {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}
.rounded-t-3xl {
  border-top-left-radius: 1.5rem;
  border-top-right-radius: 1.5rem;
}
.rounded-bl-3xl {
  border-bottom-left-radius: 1.5rem;
}
.rounded-br-3xl {
  border-bottom-right-radius: 1.5rem;
}
.border {
  border-width: 1px;
}
.border-2 {
  border-width: 2px;
}
.border-4 {
  border-width: 4px;
}
.border-y {
  border-top-width: 1px;
  border-bottom-width: 1px;
}
.border-y-2 {
  border-top-width: 2px;
  border-bottom-width: 2px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-b-2 {
  border-bottom-width: 2px;
}
.border-l-2 {
  border-left-width: 2px;
}
.border-r-4 {
  border-right-width: 4px;
}
.border-t {
  border-top-width: 1px;
}
.border-dashed {
  border-style: dashed;
}
.border-none {
  border-style: none;
}
.border-accent-1 {
  --tw-border-opacity: 1;
  border-color: rgb(237 102 197 / var(--tw-border-opacity));
}
.border-accent-5 {
  --tw-border-opacity: 1;
  border-color: rgb(142 85 234 / var(--tw-border-opacity));
}
.border-accent-7 {
  border-color: #45f88266;
}
.border-b-neutral-1 {
  --tw-border-opacity: 1;
  border-color: rgb(52 56 57 / var(--tw-border-opacity));
}
.border-b-neutral-2 {
  --tw-border-opacity: 1;
  border-color: rgb(35 38 39 / var(--tw-border-opacity));
}
.border-glass-6 {
  --tw-border-opacity: 1;
  border-color: rgb(72 72 73 / var(--tw-border-opacity));
}
.border-primary {
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
}
.border-secondary {
  --tw-border-opacity: 1;
  border-color: rgb(69 248 130 / var(--tw-border-opacity));
}
.border-secondary\/30 {
  border-color: rgb(69 248 130 / 0.3);
}
.border-shap {
  --tw-border-opacity: 1;
  border-color: rgb(33 37 41 / var(--tw-border-opacity));
}
.border-shap\/70 {
  border-color: rgb(33 37 41 / 0.7);
}
.border-transparent {
  border-color: transparent;
}
.border-w-neutral-4 {
  --tw-border-opacity: 1;
  border-color: rgb(156 171 185 / var(--tw-border-opacity));
}
.border-w-neutral-4\/10 {
  border-color: rgb(156 171 185 / 0.1);
}
.border-w-neutral-4\/20 {
  border-color: rgb(156 171 185 / 0.2);
}
.border-w-neutral-4\/60 {
  border-color: rgb(156 171 185 / 0.6);
}
.border-t-shap {
  --tw-border-opacity: 1;
  border-top-color: rgb(33 37 41 / var(--tw-border-opacity));
}
.bg-\[\#1876F2\] {
  --tw-bg-opacity: 1;
  background-color: rgb(24 118 242 / var(--tw-bg-opacity));
}
.bg-\[\#333333\] {
  --tw-bg-opacity: 1;
  background-color: rgb(51 51 51 / var(--tw-bg-opacity));
}
.bg-\[\#434DE4\] {
  --tw-bg-opacity: 1;
  background-color: rgb(67 77 228 / var(--tw-bg-opacity));
}
.bg-\[\#6E31DF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(110 49 223 / var(--tw-bg-opacity));
}
.bg-\[rgba\(242\2c 150\2c 32\2c 0\.10\)\] {
  background-color: rgba(242, 150, 32, 0.1);
}
.bg-accent-4 {
  --tw-bg-opacity: 1;
  background-color: rgb(12 140 233 / var(--tw-bg-opacity));
}
.bg-accent-4\/20 {
  background-color: rgb(12 140 233 / 0.2);
}
.bg-b-neutral-1 {
  --tw-bg-opacity: 1;
  background-color: rgb(52 56 57 / var(--tw-bg-opacity));
}
.bg-b-neutral-2 {
  --tw-bg-opacity: 1;
  background-color: rgb(35 38 39 / var(--tw-bg-opacity));
}
.bg-b-neutral-2\/20 {
  background-color: rgb(35 38 39 / 0.2);
}
.bg-b-neutral-3 {
  --tw-bg-opacity: 1;
  /* background-color: #1B002B */
  /* rgb(22 23 139 / var(--tw-bg-opacity)); */
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
}
.bg-b-neutral-4 {
  --tw-bg-opacity: 1;
  background-color: rgb(3 3 4 / var(--tw-bg-opacity));
}
.bg-b-neutral-4\/40 {
  background-color: rgb(3 3 4 / 0.4);
}
.bg-black\/20 {
  background-color: rgb(0 0 0 / 0.2);
}
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}
.bg-danger\/20 {
  background-color: rgb(235 58 58 / 0.2);
}
.bg-glass-1 {
  background-color: rgba(33, 37, 41, 0.5);
}
.bg-glass-5 {
  background-color: rgba(33, 37, 41, 0.4);
}
.bg-glass-7 {
  background-color: rgba(35, 38, 39, 0.25);
}
.bg-glass-8 {
  background-color: rgba(247, 175, 33, 0.1);
}
.bg-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
}

.bg-primary-dark-2 {
  --tw-bg-opacity: 1;
  background-color: rgb(93 4 161 / var(--tw-bg-opacity));
}

.bg-primary-dark-1 {
  --tw-bg-opacity: 1;
  background-color: rgb(24 0 36 / var(--tw-bg-opacity)); /* rgb(242 150 32 / var(--tw-bg-opacity)); */
}

.bg-primary\/20 {
  background-color: rgb(123 5 213 / 0.2);
}
.bg-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
}
.bg-secondary\/20 {
  background-color: rgb(69 248 130 / 0.2);
}
.bg-shap {
  --tw-bg-opacity: 1;
  background-color: rgb(33 37 41 / var(--tw-bg-opacity));
}
.bg-transparent {
  background-color: transparent;
}
.bg-w-neutral-1 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 254 254 / var(--tw-bg-opacity));
}
.bg-w-neutral-3 {
  --tw-bg-opacity: 1;
  background-color: rgb(232 236 239 / var(--tw-bg-opacity));
}
.bg-w-neutral-4 {
  --tw-bg-opacity: 1;
  background-color: rgb(156 171 185 / var(--tw-bg-opacity));
}
.bg-\[url\(\'\.\.\/images\/icons\/card-shape1\.svg\'\)\] {
  background-image: url(../../assets/images/card-shape1.svg);
}
.bg-\[url\(\'\.\.\/images\/photos\/breadcrumbImg\.png\'\)\] {
  background-image: url(../../assets/images/breadcrumbImg.png);
}
.bg-\[url\(\'\.\.\/images\/photos\/gameDetailsHeroBG\.png\'\)\] {
  background-image: url(../../assets/images/gameDetailsHeroBG.png);
}
.bg-\[url\(\'\.\.\/images\/photos\/heroBanner4\.webp\'\)\] {
  background-image: url(../../assets/images/heroBanner4.webp);
}
.bg-\[url\(\'\.\.\/images\/photos\/heroBanner5\.webp\'\)\] {
  background-image: url(../../assets/images/heroBanner5.webp);
}
.bg-\[url\(\'\.\.\/images\/photos\/heroBanner6\.webp\'\)\] {
  background-image: url(../../assets/images/heroBanner6.webp);
}
.bg-\[url\(\'\.\.\/images\/photos\/tournamentBanner\.webp\'\)\] {
  background-image: url(../../assets/images/tournamentBanner.webp);
}
.bg-cover {
  background-size: cover;
}
.bg-center {
  background-position: center;
}
.bg-no-repeat {
  background-repeat: no-repeat;
}
.object-contain {
  -o-object-fit: contain;
  object-fit: contain;
}
.object-cover {
  -o-object-fit: cover;
  object-fit: cover;
}
.object-top {
  -o-object-position: top;
  object-position: top;
}
.p-0 {
  padding: 0rem;
}
.p-1 {
  padding: 0.25rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-5 {
  padding: 1.25rem;
}
.\!py-3 {
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-\[18px\] {
  padding-left: 18px;
  padding-right: 18px;
}
.px-\[27px\] {
  padding-left: 27px;
  padding-right: 27px;
}
.py-0 {
  padding-top: 0rem;
  padding-bottom: 0rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.py-15 {
  padding-top: 60px;
  padding-bottom: 60px;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-20 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-3\.5 {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.pb-0 {
  padding-bottom: 0px;
}
.pb-10 {
  padding-bottom: 2.5rem;
}
.pb-15 {
  padding-bottom: 60px;
}
.pb-4 {
  padding-bottom: 1rem;
}
.pb-40 {
  padding-bottom: 10rem;
}
.pb-5 {
  padding-bottom: 1.25rem;
}
.pl-1 {
  padding-left: 0.25rem;
}
.pl-3 {
  padding-left: 0.75rem;
}
.pl-6 {
  padding-left: 1.5rem;
}
.pr-1 {
  padding-right: 0.25rem;
}
.pr-2 {
  padding-right: 0.5rem;
}
.pr-3 {
  padding-right: 0.75rem;
}
.pr-6 {
  padding-right: 1.5rem;
}
.pt-15 {
  padding-top: 60px;
}
.pt-2 {
  padding-top: 0.5rem;
}
.pt-20 {
  padding-top: 80px;
}
.pt-28 {
  padding-top: 112px;
}
.pt-30 {
  padding-top: 120px;
}
.pt-32 {
  padding-top: 8rem;
}
.pt-5 {
  padding-top: 1.25rem;
}
.pt-8 {
  padding-top: 2rem;
}
.pt-9 {
  padding-top: 2.25rem;
}
.pt-\[15px\] {
  padding-top: 15px;
}
.pt-\[30px\] {
  padding-top: 30px;
}
.pt-\[67px\] {
  padding-top: 67px;
}
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.font-prompt {
  font-family: Prompt;
}
.\!text-base {
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}
.text-7xl {
  font-size: 4.5rem;
  line-height: 1;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.font-medium {
  font-weight: 500;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.leading-\[130\%\] {
  line-height: 130%;
}
.\!text-b-neutral-4 {
  --tw-text-opacity: 1 !important;
  color: rgb(3 3 4 / var(--tw-text-opacity)) !important;
}
.\!text-w-neutral-4 {
  --tw-text-opacity: 1 !important;
  color: rgb(156 171 185 / var(--tw-text-opacity)) !important;
}
.text-accent-4 {
  --tw-text-opacity: 1;
  color: rgb(12 140 233 / var(--tw-text-opacity));
}
.text-accent-5 {
  --tw-text-opacity: 1;
  color: rgb(142 85 234 / var(--tw-text-opacity));
}
.text-b-neutral-4 {
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.text-body {
  --tw-text-opacity: 1;
  color: rgb(124 124 124 / var(--tw-text-opacity));
}
.text-danger {
  --tw-text-opacity: 1;
  color: rgb(235 58 58 / var(--tw-text-opacity));
}
.text-neutral-100 {
  --tw-text-opacity: 1;
  color: rgb(245 245 245 / var(--tw-text-opacity));
}
.text-primary {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.text-secondary {
  --tw-text-opacity: 1;
  color: rgb(69 248 130 / var(--tw-text-opacity));
}
.text-w-neutral-1 {
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.text-w-neutral-2 {
  --tw-text-opacity: 1;
  color: rgb(243 245 247 / var(--tw-text-opacity));
}
.text-w-neutral-3 {
  --tw-text-opacity: 1;
  color: rgb(232 236 239 / var(--tw-text-opacity));
}
.text-w-neutral-4 {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.text-w-neutral-4\/70 {
  color: rgb(156 171 185 / 0.7);
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.underline {
  text-decoration-line: underline;
}
.line-through {
  text-decoration-line: line-through;
}
.opacity-0 {
  opacity: 0;
}
.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored:
    0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow:
    var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
    var(--tw-shadow);
}
.shadow-lg {
  --tw-shadow:
    0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored:
    0 10px 15px -3px var(--tw-shadow-color),
    0 4px 6px -4px var(--tw-shadow-color);
  box-shadow:
    var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
    var(--tw-shadow);
}
.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.backdrop-blur-sm {
  --tw-backdrop-blur: blur(4px);
  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
    var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale)
    var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
    var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
    var(--tw-backdrop-sepia);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
    var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale)
    var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
    var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
    var(--tw-backdrop-sepia);
}
.transition {
  transition-property:
    color,
    background-color,
    border-color,
    text-decoration-color,
    fill,
    stroke,
    opacity,
    box-shadow,
    transform,
    filter,
    -webkit-backdrop-filter;
  transition-property:
    color, background-color, border-color, text-decoration-color, fill, stroke,
    opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property:
    color,
    background-color,
    border-color,
    text-decoration-color,
    fill,
    stroke,
    opacity,
    box-shadow,
    transform,
    filter,
    backdrop-filter,
    -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-500 {
  transition-duration: 500ms;
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
[x-cloak] {
  display: none;
}
.swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
}
.swiper-thumbs {
  box-sizing: border-box;
}
.testimonial-carousel .swiper-pagination-bullet,
.related-projects-carousel .swiper-pagination-bullet {
  background-color: rgba(0, 0, 0, 0);
  width: 12px;
  height: 12px;
  border: 1px solid #191919;
  border-radius: 10px;
  opacity: 1;
}
.testimonial-carousel .swiper-pagination-bullet-active,
.related-projects-carousel .swiper-pagination-bullet-active {
  background-color: #191919;
  width: 12px;
  height: 12px;
  border-radius: 10px;
  transition: all 0.3s ease-in-out;
}
.infinity-slide .swiper-wrapper {
  transition-timing-function: linear;
}
.infinity-slide .swiper-slide {
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (min-width: 992px) {
  .infinity-slide-vertical .swiper-wrapper {
    transition-timing-function: linear;
  }
  .infinity-slide-vertical .swiper-slide {
    height: -moz-fit-content;
    height: fit-content;
  }
}
.swiper-scrollbar {
  background-color: rgba(242, 150, 32, 0.5);
  height: 2px;
  border-radius: 0;
}
.swiper-scrollbar-drag {
  background-color: #7328CC /* F29620 */;
  height: 6px;
  top: -1px;
  border-radius: 0;
  cursor: pointer;
}
.swiper-horizontal > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {
  position: relative;
  left: auto;
  bottom: auto;
  top: auto;
  z-index: 50;
}
.pagination-one .swiper-pagination-bullet {
  background-color: #343839;
  width: 16px;
  height: 16px;
  opacity: 1;
  border-radius: 12px;
  transition: all 0.5s ease-in-out;
}
.pagination-one .swiper-pagination-bullet-active {
  width: 50px;
  height: 16px;
  background-color: #7328CC /* F29620 */;
  transition: all 0.5s ease-in-out;
}
.pagination-two .swiper-pagination-bullet {
  background-color: #9cabb9;
  width: 16px;
  height: 16px;
  opacity: 1;
  border-radius: 12px;
  transition: all 0.5s ease-in-out;
}
.pagination-two .swiper-pagination-bullet-active {
  width: 50px;
  height: 16px;
  background-color: #7328CC /* F29620 */;
  transition: all 0.5s ease-in-out;
}
.pagination-three .swiper-pagination-bullet {
  background-color: #9cabb9;
  width: 12px;
  height: 12px;
  opacity: 1;
  border-radius: 12px;
  transition: all 0.5s ease-in-out;
}
.pagination-three .swiper-pagination-bullet-active {
  width: 40px;
  height: 12px;
  background-color: #7328CC /* F29620 */;
  transition: all 0.5s ease-in-out;
}
.products-price-range .range-slider {
  position: relative;
  width: 100%;
  height: 30px;
}
.products-price-range .range-slider .slider-track {
  width: 100%;
  height: 6px;
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  border-radius: 5px;
}
.products-price-range .range-slider input[type="range"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  outline: none;
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0);
  pointer-events: none;
}
.products-price-range
  .range-slider
  input[type="range"]::-webkit-slider-runnable-track {
  -webkit-appearance: none;
  height: 6px;
}
.products-price-range .range-slider input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 10px;
  height: 16px;
  background-color: #7328CC /* F29620 */;
  border-radius: 2px;
  cursor: pointer;
  margin-top: -5px;
  pointer-events: auto;
}
.select-1 .select + .ss-main,
.select-1 .select-search + .ss-main {
  background-color: #232627;
  color: #fefefe;
  font-weight: 500;
  border: none;
  width: 100%;
}
.select-2 .select + .ss-main,
.select-2 .select-search + .ss-main {
  background-color: #7328CC /* F29620 */;
  color: #030304;
  font-weight: 500;
  border: none;
  width: 100%;
  border-radius: 12px;
}
.select-3 .select + .ss-main,
.select-3 .select-search + .ss-main {
  background-color: #030304;
  color: #fefefe;
  font-weight: 500;
  border: none;
  width: 100%;
  border-radius: 12px;
}
.select-4 .select + .ss-main,
.select-4 .select-search + .ss-main {
  background: rgba(0, 0, 0, 0);
  color: #7c7c7c;
  font-weight: 400;
  font-size: 16px;
  border: 1px solid #212529;
  width: 100%;
  border-radius: 12px;
}
.select-4 .select + .ss-main .ss-arrow,
.select-4 .select-search + .ss-main .ss-arrow {
  color: #fff;
}
.select + .ss-main,
.select-search + .ss-main {
  background-color: #232627;
  color: #fefefe;
  border: none;
  border-radius: 99px;
  box-shadow: none;
  font-style: normal;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 150%;
  white-space: nowrap;
}
.ss-arrow {
  font-size: 12px;
}
.ss-main .ss-arrow path {
  fill: none;
  stroke: currentColor;
}
.ss-main .ss-arrow {
  flex: 0 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 16px;
  height: 12px;
  gap: 10px;
}
.ss-content {
  border-radius: 0.5rem;
  border: none;
  background-color: #343839;
  max-height: 334px;
  min-width: -moz-fit-content;
  min-width: fit-content;
  max-width: 300px;
  width: 100%;
  padding: 12px;
  margin-top: 8px;
  z-index: 20;
}
.ss-content .ss-list::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  padding-left: 8px;
}
.ss-content .ss-list::-webkit-scrollbar-thumb {
  border-radius: 40px;
  background-color: #faab07;
}
.ss-content .ss-list::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  padding-left: 4px;
  background-color: rgba(0, 0, 0, 0);
}
.ss-content .ss-list .ss-option {
  text-wrap: nowrap;
}
.ss-content .ss-list .ss-option.ss-highlighted,
.ss-content .ss-list .ss-option:not(.ss-disabled) {
  color: #fff;
}
.ss-content .ss-list .ss-option.ss-highlighted:hover,
.ss-content .ss-list .ss-option:not(.ss-disabled):hover {
  background-color: #fefefe;
  color: #030304;
}
.ss-content .ss-list .ss-option.ss-highlighted,
.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected {
  color: #030304;
  background-color: #faab07;
}
.ss-content .ss-search {
  color: #fff;
}
.ss-content .ss-search input {
  background-color: rgba(0, 0, 0, 0);
  box-shadow: none;
  color: #fff;
}
.ss-content .ss-search input:focus {
  box-shadow: none;
  outline: none;
}
.gallery-items {
  position: relative;
  cursor: pointer;
}
.gallery-items .photo-counter {
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  z-index: 2;
}
html {
  box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}
.video-container {
  width: 640px;
  border-radius: 4px;
  margin: 0 auto;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.4);
}
.video-container .video-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.video-container video {
  width: 100%;
  height: 100%;
  border-radius: 4px;
}
.play-button-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: auto;
  pointer-events: none;
}
.play-button-wrapper #circle-play-b {
  cursor: pointer;
  pointer-events: auto;
}
.play-button-wrapper #circle-play-b svg {
  width: 100px;
  height: 100px;
  fill: #fff;
  stroke: #fff;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  opacity: 0.9;
}
:root {
  --plyr-color-main: #0c8ce9;
  --plyr-video-control-color: #fefefe;
  --plyr-menu-border-color: #fefefe;
  --plyr-range-thumb-background: #fefefe;
  --plyr-video-progress-buffered-background: rgba(156, 171, 185, 0.6);
}
.plyr_custom_poster {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  z-index: 2;
  cursor: pointer;
  display: block;
}
.plyr__video-embed {
  position: relative;
  overflow: hidden;
}
.plyr__control--overlaid {
  background-color: #0c8ce9;
  display: flex !important;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .plyr__control--overlaid {
    width: 60px !important;
    height: 60px;
    font-size: 24px;
  }
}
.text-split-left {
  overflow: hidden;
}
.text-split-top {
  overflow: hidden;
}
.text-split-bottom {
  overflow: hidden;
}
.text-split-top {
  overflow: hidden;
}
.text-split-lines {
  overflow: hidden;
}
html {
  scroll-behavior: smooth;
}
body {
  background-color: #030304;
  color: #fefefe;
}
section {
  overflow: hidden;
}
.video-modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 998;
}
.header-animation {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 399;
  animation-name: fadeDown;
  animation-duration: 1s;
  background-color: #030304;
}
@keyframes fadeDown {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  padding-left: 8px;
  background-color: #030304;
}
::-webkit-scrollbar-thumb {
  border-radius: 40px;
  background-color: #45f882;
}
.scrollbar-0::-webkit-scrollbar {
  width: 0px;
  height: 0px;
  padding-left: 4px;
  background-color: rgba(0, 0, 0, 0);
}
.scrollbar-sm::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  padding-left: 4px;
  background-color: rgba(0, 0, 0, 0);
}
.scrollbar-xsm::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  padding-left: 4px;
  background-color: rgba(0, 0, 0, 0);
}
button {
  cursor: pointer;
}
input:focus {
  outline: none;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  opacity: 1;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
}
p,
li,
input,
a,
table {
  font-family: "Prompt";
}
span:not(.word, .char) {
  font-family: Prompt;
}
.icon-16 {
  font-size: 1rem;
  line-height: 1.5rem;
}
.icon-20 {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .icon-20 {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.icon-24 {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .icon-24 {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.icon-28 {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .icon-28 {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
@media (min-width: 768px) {
  .icon-28 {
    font-size: 28px;
  }
}
.icon-32 {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .icon-32 {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
@media (min-width: 768px) {
  .icon-32 {
    font-size: 32px;
  }
}
.icon-40 {
  font-size: 1.5rem;
  line-height: 2rem;
}
@media (min-width: 576px) {
  .icon-40 {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}
@media (min-width: 768px) {
  .icon-40 {
    font-size: 40px;
  }
}
.icon-48 {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
@media (min-width: 576px) {
  .icon-48 {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}
@media (min-width: 768px) {
  .icon-48 {
    font-size: 3rem;
    line-height: 1;
  }
}
.icon-60 {
  font-size: 2.25rem;
  line-height: 2.5rem;
}
@media (min-width: 768px) {
  .icon-60 {
    font-size: 3rem;
    line-height: 1;
  }
}
@media (min-width: 992px) {
  .icon-60 {
    font-size: 60px;
  }
}
.scroll-to-top {
  z-index: 50;
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #7328CC /* F29620 */;
  color: #030304;
  width: 40px;
  height: 48px;
  font-size: 24px;
  border-radius: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transform: translateY(100px);
  transition: all 0.7s ease-in-out;
}
.scroll-to-top:hover {
  background-color: #45f882;
}
.scroll-to-top.show {
  transform: translateY(0px);
}
.btn-c {
  transition: all 0.5s ease-in-out;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.btn-c:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.btn-c:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
.btn-c-xs {
  width: 1.25rem;
  height: 1.25rem;
  font-size: 1rem;
  line-height: 1.5rem;
}
.btn-c-sm {
  width: 2.25rem;
  height: 2.25rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .btn-c-sm {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
.btn-c-md {
  width: 2.25rem;
  height: 2.25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .btn-c-md {
    font-size: 1.5rem;
    line-height: 2rem;
    width: 2.5rem;
    height: 2.5rem;
  }
}
.btn-c-lg {
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .btn-c-lg {
    font-size: 1.5rem;
    line-height: 2rem;
    width: 2.75rem;
    height: 2.75rem;
  }
}
@media (min-width: 768px) {
  .btn-c-lg {
    width: 3rem;
    height: 3rem;
  }
}
.btn-c-xl {
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .btn-c-xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
@media (min-width: 768px) {
  .btn-c-xl {
    font-size: 32px;
  }
}
@media (min-width: 576px) {
  .btn-c-xl {
    width: 2.75rem;
    height: 2.75rem;
  }
}
@media (min-width: 768px) {
  .btn-c-xl {
    width: 3rem;
    height: 3rem;
  }
}
@media (min-width: 992px) {
  .btn-c-xl {
    width: 3.25rem;
    height: 3.25rem;
  }
}
.btn-c-xxl {
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .btn-c-xxl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
@media (min-width: 768px) {
  .btn-c-xxl {
    font-size: 32px;
  }
}
@media (min-width: 576px) {
  .btn-c-xxl {
    width: 2.75rem;
    height: 2.75rem;
  }
}
@media (min-width: 768px) {
  .btn-c-xxl {
    width: 3rem;
    height: 3rem;
  }
}
@media (min-width: 992px) {
  .btn-c-xxl {
    width: 3.25rem;
    height: 3.25rem;
  }
}
@media (min-width: 1200px) {
  .btn-c-xxl {
    width: 60px;
    height: 60px;
  }
}
.btn-c-3xl {
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .btn-c-3xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
@media (min-width: 768px) {
  .btn-c-3xl {
    font-size: 32px;
  }
}
@media (min-width: 576px) {
  .btn-c-3xl {
    width: 2.75rem;
    height: 2.75rem;
  }
}
@media (min-width: 768px) {
  .btn-c-3xl {
    width: 3rem;
    height: 3rem;
  }
}
@media (min-width: 992px) {
  .btn-c-3xl {
    width: 3.25rem;
    height: 3.25rem;
  }
}
@media (min-width: 1200px) {
  .btn-c-3xl {
    width: 4rem;
    height: 4rem;
  }
}
.btn-c-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-c-primary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
}
.btn-c-neutral-3 {
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.btn-c-neutral-3:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(14 16 18 / var(--tw-text-opacity));
}
.btn-c-outline-primary {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.btn-c-outline-primary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.btn-c-dark-outline {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(156 171 185 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.btn-c-dark-outline:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(156 171 185 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(52 56 57 / var(--tw-text-opacity));
}
.btn-c-light-outline {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(254 254 254 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.btn-c-light-outline:hover {
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.tag {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}
.tag-item {
  display: inline-block;
  border-radius: 12px;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.tag-neutral-4 {
  transition: all 0.5s ease-in-out;
  --tw-bg-opacity: 1;
  background-color: rgb(3 3 4 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.tag-neutral-4:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.box-input-common {
  width: 100%;
  font-size: 1rem;
  line-height: 1.5rem;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-common:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-1 {
  transition: all 0.5s ease-in-out;
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .box-input-1 {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .box-input-1 {
    padding: 1rem;
  }
}
.box-input-1 {
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(243 245 247 / var(--tw-text-opacity));
  width: 100%;
  font-size: 1rem;
  line-height: 1.5rem;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-1:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-1::-moz-placeholder {
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.box-input-1::placeholder {
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.box-input-2 {
  transition: all 0.5s ease-in-out;
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .box-input-2 {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .box-input-2 {
    padding: 1rem;
  }
}
@media (min-width: 992px) {
  .box-input-2 {
    padding: 1.25rem;
  }
}
.box-input-2 {
  border-radius: 12px;
  --tw-bg-opacity: 1;
  background-color: rgb(3 3 4 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(243 245 247 / var(--tw-text-opacity));
  width: 100%;
  font-size: 1rem;
  line-height: 1.5rem;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-2:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-2::-moz-placeholder {
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.box-input-2::placeholder {
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.box-input-3 {
  transition: all 0.5s ease-in-out;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 576px) {
  .box-input-3 {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
}
@media (min-width: 768px) {
  .box-input-3 {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
.box-input-3 {
  border-radius: 12px;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(33 37 41 / var(--tw-border-opacity));
  background-color: transparent;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(243 245 247 / var(--tw-text-opacity));
  width: 100%;
  font-size: 1rem;
  line-height: 1.5rem;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-3:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-3::-moz-placeholder {
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.box-input-3::placeholder {
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.box-input-4 {
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .box-input-4 {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .box-input-4 {
    padding: 1rem;
  }
}
.box-input-4 {
  border-radius: 4px;
  background-color: rgba(33, 37, 41, 0.5);
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
  width: 100%;
  font-size: 1rem;
  line-height: 1.5rem;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-4:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.box-input-4::-moz-placeholder {
  color: rgb(124 124 124 / 0.6);
}
.box-input-4::placeholder {
  color: rgb(124 124 124 / 0.6);
}
.border-input-1 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 576px) {
  .border-input-1 {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
}
@media (min-width: 768px) {
  .border-input-1 {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
.border-input-1 {
  width: 100%;
  border-radius: 12px;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(33 37 41 / var(--tw-border-opacity));
  background-color: #FFF;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  /* color: rgb(254 254 254 / var(--tw-text-opacity)); */
  
  color: rgb(0 0 0 / var(--tw-text-opacity));
}
.border-input-1::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.border-input-1::placeholder {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.border-input-1:focus-within {
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
}
.input-sm {
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  height: 2.25rem;
  border-radius: 0.375rem;
}
@media (min-width: 576px) {
  .input-sm {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}
.form-group {
  display: block;
  margin-bottom: 15px;
}
.form-group input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}
.form-group label {
  position: relative;
  cursor: pointer;
}
.form-group label:before {
  content: "";
  -webkit-appearance: none;
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #1c1c1c;
  padding: 10px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  margin-right: 5px;
}
.form-group label:hover:before {
  background-color: #fff;
  border: #fff;
}
.form-group input:checked + label:after {
  content: "";
  display: block;
  position: absolute;
  top: 7px;
  left: 7px;
  width: 6px;
  height: 12px;
  border: solid #6d8c36;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.radio-button-container {
  display: block;
  position: relative;
  padding-left: 24px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.radio-button-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
.checkmark {
  position: absolute;
  top: 6px;
  left: 0;
  height: 16px;
  width: 16px;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 100%;
  border: 1px solid #7328CC /* F29620 */;
  transition: all 0.3s;
}
.radio-button-container input:checked ~ .checkmark {
  background-color: #7328CC /* F29620 */;
  border-color: #7328CC /* F29620 */;
}
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.radio-button-container input:checked ~ .checkmark:after {
  display: block;
}
.radio-button-container .checkmark:after {
  top: 3px;
  left: 3px;
  width: 8px;
  height: 8px;
  border-radius: 100%;
  background: #7328CC /* F29620 */;
}
.lines {
  border: 0.5px solid #969f96;
  background-image: repeating-linear-gradient(
    140deg,
    rgba(238, 238, 238, 0.6352941176) 10px,
    rgba(238, 238, 238, 0.6352941176) 12px,
    transparent 12px,
    transparent 20px
  );
}
.grid-lines-1 {
  width: 100%;
  height: 100%;
  --color: #2a123d;
  background-color: #1b072c;
  background-image:
    linear-gradient(
      0deg,
      transparent 24%,
      var(--color) 25%,
      var(--color) 26%,
      transparent 27%,
      transparent 74%,
      var(--color) 75%,
      var(--color) 76%,
      transparent 77%,
      transparent
    ),
    linear-gradient(
      90deg,
      transparent 24%,
      var(--color) 25%,
      var(--color) 26%,
      transparent 27%,
      transparent 74%,
      var(--color) 75%,
      var(--color) 76%,
      transparent 77%,
      transparent
    );
  background-size: 42px 42px;
}
.grid-lines {
  width: 100%;
  height: 100%;
  --color: rgba(27, 7, 44, 0.06);
  background-image:
    linear-gradient(
      0deg,
      transparent 24%,
      var(--color) 25%,
      var(--color) 26%,
      transparent 27%,
      transparent 74%,
      var(--color) 75%,
      var(--color) 76%,
      transparent 77%,
      transparent
    ),
    linear-gradient(
      90deg,
      transparent 24%,
      var(--color) 25%,
      var(--color) 26%,
      transparent 27%,
      transparent 74%,
      var(--color) 75%,
      var(--color) 76%,
      transparent 77%,
      transparent
    );
  background-size: 60px 60px;
}
.grid-lines-2 {
  width: 100%;
  height: 100%;
  --color: #2c1442;
  background-color: #250c3c;
  background-image:
    linear-gradient(
      0deg,
      transparent 24%,
      var(--color) 25%,
      var(--color) 26%,
      transparent 27%,
      transparent 74%,
      var(--color) 75%,
      var(--color) 76%,
      transparent 77%,
      transparent
    ),
    linear-gradient(
      90deg,
      transparent 24%,
      var(--color) 25%,
      var(--color) 26%,
      transparent 27%,
      transparent 74%,
      var(--color) 75%,
      var(--color) 76%,
      transparent 77%,
      transparent
    );
  background-size: 42px 42px;
}
.beadcrumb {
  background: linear-gradient(0deg, #250c3c 0%, rgba(37, 12, 60, 0) 100%);
}
.testimonials-one {
  background: linear-gradient(
    0deg,
    #1b072c 0%,
    rgba(27, 7, 44, 0.8) 50.4%,
    rgba(27, 7, 44, 0) 100%
  );
}
.input-outline {
  position: relative;
  width: 100%;
}
.input-outline label {
  position: absolute;
  top: 50%;
  left: 24px;
  transform: translateY(-50%);
  font-size: 14px;
  line-height: 24px;
  background-color: #2e0e4d;
  padding: 0 6px;
  margin-left: -6px;
  border-radius: 10px;
  color: #dfe0e4;
  pointer-events: none;
  transition: all 0.3s ease;
}
.input-outline .textarea label {
  top: 20%;
  transform: translateY(-12px);
}
.input-outline .textarea:not(:-moz-placeholder-shown) + label {
  top: 0;
  transform: translateY(-20);
  font-size: 40px;
}
.input-outline .textarea:focus + label,
.input-outline .textarea:not(:placeholder-shown) + label {
  top: 0;
  transform: translateY(-20);
  font-size: 40px;
}
.input-outline input,
.input-outline textarea {
  background: rgba(0, 0, 0, 0);
  width: 100%;
  border: none;
  outline: none;
  font-size: 14px;
  line-height: 24px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 32px;
}
.input-outline input:not(:-moz-placeholder-shown) + label,
.input-outline textarea:not(:-moz-placeholder-shown) + label {
  top: 0;
  transform: translateY(-50);
  font-size: 14px;
  color: #fff;
}
.input-outline input:focus + label,
.input-outline input:not(:placeholder-shown) + label,
.input-outline textarea:focus + label,
.input-outline textarea:not(:placeholder-shown) + label {
  top: 0;
  transform: translateY(-50);
  font-size: 14px;
  color: #fff;
}
.input-outline input::-moz-placeholder,
.input-outline textarea::-moz-placeholder {
  opacity: 0;
  font-size: 14px;
  -moz-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.input-outline input::placeholder,
.input-outline textarea::placeholder {
  opacity: 0;
  font-size: 14px;
  transition: opacity 0.3s ease;
}
.input-outline input:focus::-moz-placeholder,
.input-outline textarea:focus::-moz-placeholder {
  opacity: 1;
}
.input-outline input:focus::placeholder,
.input-outline textarea:focus::placeholder {
  opacity: 1;
}
.checkbox.style-border-1 {
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.checkbox.style-border-1 input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkbox.style-border-1 input:checked ~ .checkbox__label .checkbox__checkmark {
  background-color: rgba(255, 255, 255, 0.05);
}
.checkbox.style-border-1
  input:checked
  ~ .checkbox__label
  .checkbox__checkmark:after {
  opacity: 1;
}
.checkbox.style-border-1:hover input ~ .checkbox__label .checkbox__checkmark {
  background-color: rgba(255, 255, 255, 0.05);
}
.checkbox.style-border-1 .checkbox__checkmark {
  position: absolute;
  top: 0px;
  left: 0;
  height: 24px;
  width: 24px;
  border: 1px solid #e8e8e8;
  transition: background-color 0.25s ease;
  border-radius: 4px;
}
.checkbox.style-border-1 .checkbox__checkmark:after {
  content: "";
  position: absolute;
  left: 8px;
  top: 3px;
  width: 7px;
  height: 12px;
  border: solid #191919;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.25s ease;
  cursor: pointer;
}
.checkbox.style-box .checkbox__body {
  font-size: 18px;
  font-weight: 400;
  margin-left: 32px;
  margin-top: -6px;
  cursor: pointer;
}
.checkbox__label,
.checkbox__body {
  width: 100%;
}
.checkbox.style-box {
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.checkbox.style-box input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkbox.style-box input:checked ~ .checkbox__label .checkbox__checkmark {
  background-color: #f4f6fb;
}
.checkbox.style-box
  input:checked
  ~ .checkbox__label
  .checkbox__checkmark:after {
  opacity: 1;
}
.checkbox.style-box:hover input ~ .checkbox__label .checkbox__checkmark {
  background-color: #f4f6fb;
}
.checkbox.style-box .checkbox__checkmark {
  position: absolute;
  top: 0px;
  left: 0;
  height: 24px;
  width: 24px;
  background-color: #f4f6fb;
  transition: background-color 0.25s ease;
  border-radius: 4px;
}
.checkbox.style-box .checkbox__checkmark:after {
  content: "";
  position: absolute;
  left: 9px;
  top: 5px;
  width: 7px;
  height: 12px;
  border: solid #191919;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.25s ease;
  cursor: pointer;
}
.checkbox.style-box .checkbox__body {
  font-size: 18px;
  font-weight: 400;
  margin-left: 32px;
  margin-top: -6px;
  cursor: pointer;
}
.border-corners-checkbox {
  display: none;
}
.border-corners-checkbox-label {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.border-corners-checkbox-label i {
  transition: color 0.3s ease;
  font-family: "tabler-icons";
}
.border-corners-checkbox:not(:checked)
  + .border-corners-checkbox-label
  i::before {
  content: "";
}
.border-corners-checkbox:checked + .border-corners-checkbox-label i::before {
  content: "";
}
.border-corners-checkbox-label:hover i::before {
  opacity: 0.8;
}
.radio-wrapper.style-border-1-circle {
  display: inline-flex;
  align-items: center;
  gap: 16px;
}
.radio.style-border-1-circle:checked,
.radio.style-border-1-circle:not(:checked) {
  position: absolute;
  left: -9999px;
}
.radio.style-border-1-circle:checked + label,
.radio.style-border-1-circle:not(:checked) + label {
  position: relative;
  padding-left: 34px;
  padding-top: 2px;
  cursor: pointer;
  line-height: 20px;
  display: inline-block;
}
.radio.style-border-1-circle:checked + label:before,
.radio.style-border-1-circle:not(:checked) + label:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  border: 2px solid #191919;
  border-radius: 100%;
  background: rgba(0, 0, 0, 0);
}
.radio.style-border-1-circle:checked + label:after,
.radio.style-border-1-circle:not(:checked) + label:after {
  content: "";
  width: 14px;
  height: 14px;
  background: #191919;
  position: absolute;
  top: 5px;
  left: 5px;
  border-radius: 100%;
  transition: all 0.2s ease;
}
.radio.style-border-1-circle:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
.radio.style-border-1-circle:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
[type="button"]:not(:disabled),
[type="reset"]:not(:disabled),
[type="submit"]:not(:disabled),
button:not(:disabled) {
  cursor: pointer;
}
.transition-height {
  overflow: hidden;
  transition: height 0.3s ease;
}
.preloader {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100vw;
  height: 100vh;
  background: #121212;
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: center;
}
.loader {
  transform: rotateZ(45deg);
  perspective: 1000px;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  color: #91ff00;
}
.loader:before,
.loader:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: inherit;
  height: inherit;
  border-radius: 50%;
  transform: rotateX(70deg);
  animation: 1s spin linear infinite;
}
.loader:after {
  color: #ff3d00;
  transform: rotateY(70deg);
  animation-delay: 0.4s;
}
@keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotateZ(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotateZ(360deg);
  }
}
@keyframes rotateccw {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}
@keyframes spin {
  0%,
  100% {
    box-shadow: 0.2em 0px 0 0px currentcolor;
  }
  12% {
    box-shadow: 0.2em 0.2em 0 0 currentcolor;
  }
  25% {
    box-shadow: 0 0.2em 0 0px currentcolor;
  }
  37% {
    box-shadow: -0.2em 0.2em 0 0 currentcolor;
  }
  50% {
    box-shadow: -0.2em 0 0 0 currentcolor;
  }
  62% {
    box-shadow: -0.2em -0.2em 0 0 currentcolor;
  }
  75% {
    box-shadow: 0px -0.2em 0 0 currentcolor;
  }
  87% {
    box-shadow: 0.2em -0.2em 0 0 currentcolor;
  }
}
.zoomable {
  position: relative;
  overflow: hidden;
}
.zoomable__img {
  transform-origin: var(--zoom-pos-x, 0%) var(--zoom-pos-y, 0%);
  transition: transform 0.15s linear;
}
.zoomable--zoomed .zoomable__img {
  cursor: zoom-in;
  transform: scale(var(--zoom, 2));
}
.glitch-effect {
  position: relative;
  overflow: hidden;
  transition: all 0.5s ease-in-out;
}
.glitch-effect .glitch-thumb {
  position: relative;
  overflow: hidden;
  width: 100%;
  display: block;
  transition: all 0.5s ease-in-out;
}
.glitch-effect .glitch-thumb :nth-child(2) {
  transition: all 0.5s ease-in-out;
}
.glitch-effect .glitch-thumb:first-child {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  transform: translatex(50%) scalex(2);
  opacity: 0;
  filter: blur(10px);
}
.glitch-effect .glitch-thumb:first-child img {
  transform: scale(1);
  transition: all 0.5s ease-in-out;
}
.glitch-effect:hover .glitch-thumb:first-child {
  transform: translatex(0) scalex(1);
  opacity: 1;
  filter: blur(0);
}
.glitch-effect:hover .glitch-thumb:nth-child(2) {
  transform: translatex(-50%) scalex(2);
  opacity: 0;
  filter: blur(10px);
}
@media (min-width: 768px) {
  .flex-col-reverse-even > :nth-child(even) {
    flex-direction: column-reverse;
  }
}
.circle-spinner-button {
  position: relative;
  width: 174px;
  height: 174px;
  border-radius: 100vmax;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #250c3c;
}
.circle-spinner-button .logo {
  position: absolute;
  width: 60px;
  height: 60px;
  background-size: cover;
  border-radius: 100vmax;
  background-position: center;
}
.circle-spinner-button .text {
  position: absolute;
  width: 100%;
  height: 100%;
  animation: textRotation 8s linear infinite;
}
@keyframes textRotation {
  to {
    transform: rotate(360deg);
  }
}
.circle-spinner-button .text span {
  position: absolute;
  left: 50%;
  transform-origin: 0 87px;
}
.btn_effect {
  min-width: 64px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  background: #fff;
  transition: 0.5s;
}
.btn_effect:before {
  content: "";
  position: absolute;
  width: 85%;
  height: 85%;
  background-color: #fff;
  border-radius: 50%;
  opacity: 0.6;
  z-index: -1;
  animation: pulse 2s ease-out infinite;
}
.btn_effect:after {
  content: "";
  position: absolute;
  width: 85%;
  height: 85%;
  background-color: rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  opacity: 0.7;
  z-index: -1;
  animation: pulse 2s 1.5s ease-out infinite;
}
@keyframes pulse {
  100% {
    transform: scale(2.5);
    opacity: 0;
  }
}
.\*\:p-20p > * {
  padding: 0.75rem;
}
@media (min-width: 576px) {
  .\*\:p-20p > * {
    padding: 0.875rem;
  }
}
@media (min-width: 768px) {
  .\*\:p-20p > * {
    padding: 1rem;
  }
}
@media (min-width: 992px) {
  .\*\:p-20p > * {
    padding: 1.25rem;
  }
}
.\*\:px-20p > * {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
@media (min-width: 576px) {
  .\*\:px-20p > * {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }
}
@media (min-width: 768px) {
  .\*\:px-20p > * {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
@media (min-width: 992px) {
  .\*\:px-20p > * {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}
.\*\:py-24p > * {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
@media (min-width: 768px) {
  .\*\:py-24p > * {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
@media (min-width: 992px) {
  .\*\:py-24p > * {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .\*\:py-24p > * {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
.\*\:p-30p > * {
  padding: 1rem;
}
@media (min-width: 576px) {
  .\*\:p-30p > * {
    padding: 1.25rem;
  }
}
@media (min-width: 768px) {
  .\*\:p-30p > * {
    padding: 1.5rem;
  }
}
@media (min-width: 992px) {
  .\*\:p-30p > * {
    padding: 30px;
  }
}
.\*\:px-30p > * {
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-width: 576px) {
  .\*\:px-30p > * {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}
@media (min-width: 768px) {
  .\*\:px-30p > * {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 992px) {
  .\*\:px-30p > * {
    padding-left: 30px;
    padding-right: 30px;
  }
}
.\*\:p-32p > * {
  padding: 1.25rem;
}
@media (min-width: 576px) {
  .\*\:p-32p > * {
    padding: 1.5rem;
  }
}
@media (min-width: 768px) {
  .\*\:p-32p > * {
    padding: 1.75rem;
  }
}
@media (min-width: 992px) {
  .\*\:p-32p > * {
    padding: 2rem;
  }
}
.\*\:px-32p > * {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 576px) {
  .\*\:px-32p > * {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 768px) {
  .\*\:px-32p > * {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }
}
@media (min-width: 992px) {
  .\*\:px-32p > * {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.\*\:py-32p > * {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
@media (min-width: 576px) {
  .\*\:py-32p > * {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  .\*\:py-32p > * {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
  }
}
@media (min-width: 992px) {
  .\*\:py-32p > * {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
.\*\:px-40p > * {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
@media (min-width: 576px) {
  .\*\:px-40p > * {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 768px) {
  .\*\:px-40p > * {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 992px) {
  .\*\:px-40p > * {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
  }
}
@media (min-width: 1200px) {
  .\*\:px-40p > * {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.\*\:size-40p > * {
  width: 2rem;
  height: 2rem;
}
@media (min-width: 576px) {
  .\*\:size-40p > * {
    width: 2.25rem;
    height: 2.25rem;
  }
}
@media (min-width: 768px) {
  .\*\:size-40p > * {
    width: 2.5rem;
    height: 2.5rem;
  }
}
.\*\:rounded-24 > * {
  border-radius: 1rem;
}
@media (min-width: 768px) {
  .\*\:rounded-24 > * {
    border-radius: 20;
  }
}
@media (min-width: 992px) {
  .\*\:rounded-24 > * {
    border-radius: 24px;
  }
}
.\*\:flex-y > * {
  display: flex;
  align-items: center;
}
.\*\:gap-16p > * {
  gap: 0.75rem;
}
@media (min-width: 576px) {
  .\*\:gap-16p > * {
    gap: 1rem;
  }
}
.\*\:gap-20p > * {
  gap: 0.75rem;
}
@media (min-width: 768px) {
  .\*\:gap-20p > * {
    gap: 1rem;
  }
}
@media (min-width: 992px) {
  .\*\:gap-20p > * {
    gap: 1.25rem;
  }
}
.\*\:gap-24p > * {
  gap: 1rem;
}
@media (min-width: 768px) {
  .\*\:gap-24p > * {
    gap: 1.25rem;
  }
}
@media (min-width: 992px) {
  .\*\:gap-24p > * {
    gap: 1.5rem;
  }
}
.\*\:avatar > * {
  position: relative;
  border-radius: 9999px;
}
.\*\:avatar > * .status-badge {
  position: absolute;
  bottom: -0.5rem;
  right: -0.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .\*\:avatar > * .status-badge {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.\*\:avatar > * .status-badge.online {
  --tw-text-opacity: 1;
  color: rgb(69 248 130 / var(--tw-text-opacity));
}
.\*\:avatar > * .status-badge.offline {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.\*\:btn-socal-accent-4 > * {
  transition: all 0.5s ease-in-out;
  width: 2rem;
  height: 2rem;
}
@media (min-width: 576px) {
  .\*\:btn-socal-accent-4 > * {
    width: 2.25rem;
    height: 2.25rem;
  }
}
@media (min-width: 768px) {
  .\*\:btn-socal-accent-4 > * {
    width: 2.5rem;
    height: 2.5rem;
  }
}
.\*\:btn-socal-accent-4 > * {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media (min-width: 576px) {
  .\*\:btn-socal-accent-4 > * {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}
.\*\:btn-socal-accent-4 > *:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(12 140 233 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.group:hover .group-hover\:badge-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.group:hover .group-hover\:badge-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.group:hover .group-hover\:btn-primary {
  background-color: #7328CC /* F29620 */;
  color: #FFFFFF; /* #030304 */;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  z-index: 1;
}
.group:hover .group-hover\:btn-primary::before {
  content: "";
  width: 0;
  height: 100vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  background: #45f882;
  transition: 0.5s ease;
  display: block;
  z-index: -1;
}
.group:hover .group-hover\:btn-primary:hover {
  color: #13203b !important;
}
.group:hover .group-hover\:btn-primary:hover::before {
  width: 150%;
}
@media not all and (min-width: 1800px) {
  .max-4xl\:px-48p {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
  @media (min-width: 576px) {
    .max-4xl\:px-48p {
      padding-left: 1.75rem;
      padding-right: 1.75rem;
    }
  }
  @media (min-width: 768px) {
    .max-4xl\:px-48p {
      padding-left: 2rem;
      padding-right: 2rem;
    }
  }
  @media (min-width: 992px) {
    .max-4xl\:px-48p {
      padding-left: 2.25rem;
      padding-right: 2.25rem;
    }
  }
  @media (min-width: 1200px) {
    .max-4xl\:px-48p {
      padding-left: 3rem;
      padding-right: 3rem;
    }
  }
  .max-4xl\:gap-40p {
    gap: 1.5rem;
  }
  @media (min-width: 576px) {
    .max-4xl\:gap-40p {
      gap: 1.75rem;
    }
  }
  @media (min-width: 768px) {
    .max-4xl\:gap-40p {
      gap: 2rem;
    }
  }
  @media (min-width: 992px) {
    .max-4xl\:gap-40p {
      gap: 2.25rem;
    }
  }
  @media (min-width: 1200px) {
    .max-4xl\:gap-40p {
      gap: 2.5rem;
    }
  }
}
@media not all and (min-width: 1600px) {
  .max-3xl\:px-80p {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  @media (min-width: 576px) {
    .max-3xl\:px-80p {
      padding-left: 2.25rem;
      padding-right: 2.25rem;
    }
  }
  @media (min-width: 768px) {
    .max-3xl\:px-80p {
      padding-left: 2.5rem;
      padding-right: 2.5rem;
    }
  }
  @media (min-width: 992px) {
    .max-3xl\:px-80p {
      padding-left: 60px;
      padding-right: 60px;
    }
  }
  @media (min-width: 1200px) {
    .max-3xl\:px-80p {
      padding-left: 72px;
      padding-right: 72px;
    }
  }
  @media (min-width: 1400px) {
    .max-3xl\:px-80p {
      padding-left: 5rem;
      padding-right: 5rem;
    }
  }
  .max-3xl\:flex-col-c {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}
@media not all and (min-width: 1200px) {
  .max-xl\:p-20p {
    padding: 0.75rem;
  }
  @media (min-width: 576px) {
    .max-xl\:p-20p {
      padding: 0.875rem;
    }
  }
  @media (min-width: 768px) {
    .max-xl\:p-20p {
      padding: 1rem;
    }
  }
  @media (min-width: 992px) {
    .max-xl\:p-20p {
      padding: 1.25rem;
    }
  }
  .max-xl\:flex-col-c {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .max-xl\:gap-x-30p {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
  }
  @media (min-width: 768px) {
    .max-xl\:gap-x-30p {
      -moz-column-gap: 1.75rem;
      column-gap: 1.75rem;
    }
  }
  @media (min-width: 992px) {
    .max-xl\:gap-x-30p {
      -moz-column-gap: 30px;
      column-gap: 30px;
    }
  }
}
@media (min-width: 576px) {
  .sm\:flex-c {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .sm\:gap-y-16p {
    row-gap: 0.75rem;
  }
  @media (min-width: 576px) {
    .sm\:gap-y-16p {
      row-gap: 1rem;
    }
  }
  .\*\:sm\:py-60p > * {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  @media (min-width: 768px) {
    .\*\:sm\:py-60p > * {
      padding-top: 2.5rem;
      padding-bottom: 2.5rem;
    }
  }
  @media (min-width: 992px) {
    .\*\:sm\:py-60p > * {
      padding-top: 3rem;
      padding-bottom: 3rem;
    }
  }
  @media (min-width: 1200px) {
    .\*\:sm\:py-60p > * {
      padding-top: 3.5rem;
      padding-bottom: 3.5rem;
    }
  }
  @media (min-width: 1600px) {
    .\*\:sm\:py-60p > * {
      padding-top: 60px;
      padding-bottom: 60px;
    }
  }
}
@media (min-width: 768px) {
  .md\:pt-48p {
    padding-top: 1.25rem;
  }
  @media (min-width: 576px) {
    .md\:pt-48p {
      padding-top: 1.75rem;
    }
  }
  @media (min-width: 768px) {
    .md\:pt-48p {
      padding-top: 2rem;
    }
  }
  @media (min-width: 992px) {
    .md\:pt-48p {
      padding-top: 2.25rem;
    }
  }
  @media (min-width: 1200px) {
    .md\:pt-48p {
      padding-top: 3rem;
    }
  }
  .md\:gap-30p {
    gap: 1.5rem;
  }
  @media (min-width: 768px) {
    .md\:gap-30p {
      gap: 1.75rem;
    }
  }
  @media (min-width: 992px) {
    .md\:gap-30p {
      gap: 30px;
    }
  }
}
@media (min-width: 992px) {
  .lg\:section-pb {
    padding-bottom: 60px;
  }
  @media (min-width: 576px) {
    .lg\:section-pb {
      padding-bottom: 5rem;
    }
  }
  @media (min-width: 768px) {
    .lg\:section-pb {
      padding-bottom: 90px;
    }
  }
  @media (min-width: 992px) {
    .lg\:section-pb {
      padding-bottom: 100px;
    }
  }
  .lg\:mx-60p {
    margin-left: 2rem;
    margin-right: 2rem;
  }
  @media (min-width: 768px) {
    .lg\:mx-60p {
      margin-left: 2.5rem;
      margin-right: 2.5rem;
    }
  }
  @media (min-width: 992px) {
    .lg\:mx-60p {
      margin-left: 3rem;
      margin-right: 3rem;
    }
  }
  @media (min-width: 1200px) {
    .lg\:mx-60p {
      margin-left: 3.5rem;
      margin-right: 3.5rem;
    }
  }
  @media (min-width: 1600px) {
    .lg\:mx-60p {
      margin-left: 60px;
      margin-right: 60px;
    }
  }
  .lg\:gap-32p {
    gap: 1.5rem;
  }
  @media (min-width: 768px) {
    .lg\:gap-32p {
      gap: 1.75rem;
    }
  }
  @media (min-width: 992px) {
    .lg\:gap-32p {
      gap: 2rem;
    }
  }
  .lg\:gap-x-32p {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
  }
  @media (min-width: 768px) {
    .lg\:gap-x-32p {
      -moz-column-gap: 1.75rem;
      column-gap: 1.75rem;
    }
  }
  @media (min-width: 992px) {
    .lg\:gap-x-32p {
      -moz-column-gap: 2rem;
      column-gap: 2rem;
    }
  }
  .lg\:gap-y-60p {
    row-gap: 2.5rem;
  }
  @media (min-width: 768px) {
    .lg\:gap-y-60p {
      row-gap: 3rem;
    }
  }
  @media (min-width: 992px) {
    .lg\:gap-y-60p {
      row-gap: 3.5rem;
    }
  }
  @media (min-width: 1200px) {
    .lg\:gap-y-60p {
      row-gap: 60px;
    }
  }
  .lg\:pagination-center {
    justify-content: center;
  }
}
@media (min-width: 1600px) {
  .\33xl\:px-80p {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  @media (min-width: 576px) {
    .\33xl\:px-80p {
      padding-left: 2.25rem;
      padding-right: 2.25rem;
    }
  }
  @media (min-width: 768px) {
    .\33xl\:px-80p {
      padding-left: 2.5rem;
      padding-right: 2.5rem;
    }
  }
  @media (min-width: 992px) {
    .\33xl\:px-80p {
      padding-left: 60px;
      padding-right: 60px;
    }
  }
  @media (min-width: 1200px) {
    .\33xl\:px-80p {
      padding-left: 72px;
      padding-right: 72px;
    }
  }
  @media (min-width: 1400px) {
    .\33xl\:px-80p {
      padding-left: 5rem;
      padding-right: 5rem;
    }
  }
}
.\*\:-ml-3 > * {
  margin-left: -0.75rem;
}
.\*\:ml-5 > * {
  margin-left: 1.25rem;
}
.\*\:flex > * {
  display: flex;
}
.\*\:inline-flex > * {
  display: inline-flex;
}
.\*\:size-10 > * {
  width: 2.5rem;
  height: 2.5rem;
}
.\*\:size-8 > * {
  width: 2rem;
  height: 2rem;
}
.\*\:size-9 > * {
  width: 2.25rem;
  height: 2.25rem;
}
.\*\:\!h-fit > * {
  height: -moz-fit-content !important;
  height: fit-content !important;
}
.\*\:h-\[246px\] > * {
  height: 246px;
}
.\*\:h-\[250px\] > * {
  height: 250px;
}
.\*\:h-full > * {
  height: 100%;
}
.\*\:w-fit > * {
  width: -moz-fit-content;
  width: fit-content;
}
.\*\:w-full > * {
  width: 100%;
}
.\*\:min-w-\[220px\] > * {
  min-width: 220px;
}
.\*\:shrink-0 > * {
  flex-shrink: 0;
}
.\*\:flex-wrap > * {
  flex-wrap: wrap;
}
.\*\:items-center > * {
  align-items: center;
}
.\*\:justify-between > * {
  justify-content: space-between;
}
.\*\:gap-2 > * {
  gap: 0.5rem;
}
.\*\:gap-2\.5 > * {
  gap: 0.625rem;
}
.\*\:gap-3 > * {
  gap: 0.75rem;
}
.\*\:rounded-12 > * {
  border-radius: 12px;
}
.\*\:rounded-4 > * {
  border-radius: 4px;
}
.\*\:rounded-full > * {
  border-radius: 9999px;
}
.\*\:rounded-tl-none > * {
  border-top-left-radius: 0px;
}
.\*\:border > * {
  border-width: 1px;
}
.\*\:border-shap > * {
  --tw-border-opacity: 1;
  border-color: rgb(33 37 41 / var(--tw-border-opacity));
}
.\*\:border-white > * {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity));
}
.\*\:bg-b-neutral-3 > * {
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
}
.\*\:bg-glass-1 > * {
  background-color: rgba(33, 37, 41, 0.5);
}
.\*\:bg-glass-7 > * {
  background-color: rgba(35, 38, 39, 0.25);
}
.\*\:px-3 > * {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.\*\:py-2 > * {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.\*\:py-3 > * {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.\*\:font-prompt > * {
  font-family: Prompt;
}
.\*\:text-w-neutral-4 > * {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.placeholder\:text-sm::-moz-placeholder {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.placeholder\:text-sm::placeholder {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.placeholder\:text-xs::-moz-placeholder {
  font-size: 0.75rem;
  line-height: 1rem;
}
.placeholder\:text-xs::placeholder {
  font-size: 0.75rem;
  line-height: 1rem;
}
.placeholder\:text-body::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(124 124 124 / var(--tw-text-opacity));
}
.placeholder\:text-body::placeholder {
  --tw-text-opacity: 1;
  color: rgb(124 124 124 / var(--tw-text-opacity));
}
.placeholder\:text-w-neutral-1::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.placeholder\:text-w-neutral-1::placeholder {
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.placeholder\:text-w-neutral-3::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(232 236 239 / var(--tw-text-opacity));
}
.placeholder\:text-w-neutral-3::placeholder {
  --tw-text-opacity: 1;
  color: rgb(232 236 239 / var(--tw-text-opacity));
}
.placeholder\:text-w-neutral-4::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.placeholder\:text-w-neutral-4::placeholder {
  --tw-text-opacity: 1;
  color: rgb(156 171 185 / var(--tw-text-opacity));
}
.after\:absolute::after {
  content: var(--tw-content);
  position: absolute;
}
.after\:start-\[2px\]::after {
  content: var(--tw-content);
  inset-inline-start: 2px;
}
.after\:top-\[2px\]::after {
  content: var(--tw-content);
  top: 2px;
}
.after\:size-4::after {
  content: var(--tw-content);
  width: 1rem;
  height: 1rem;
}
.after\:h-5::after {
  content: var(--tw-content);
  height: 1.25rem;
}
.after\:w-5::after {
  content: var(--tw-content);
  width: 1.25rem;
}
.after\:rounded-full::after {
  content: var(--tw-content);
  border-radius: 9999px;
}
.after\:bg-b-neutral-3::after {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(14 16 18 / var(--tw-bg-opacity));
}
.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\:content-\[\'\'\]::after {
  --tw-content: "";
  content: var(--tw-content);
}
.hover\:translate-x-0:hover {
  --tw-translate-x: 0px;
  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));
}
.hover\:-rotate-6:hover {
  --tw-rotate: -6deg;
  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));
}
.hover\:scale-105:hover {
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  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));
}
.hover\:scale-110:hover {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  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));
}
.hover\:border-accent-7:hover {
  border-color: #45f88266;
}
.hover\:border-primary:hover {
  --tw-border-opacity: 1;
  border-color: rgb(123 5 213 / var(--tw-border-opacity));
}
.hover\:border-secondary:hover {
  --tw-border-opacity: 1;
  border-color: rgb(69 248 130 / var(--tw-border-opacity));
}
.hover\:bg-\[\#1876F2\]\/80:hover {
  background-color: rgb(24 118 242 / 0.8);
}
.hover\:bg-\[\#434DE4\]\/80:hover {
  background-color: rgb(67 77 228 / 0.8);
}
.hover\:bg-\[\#6E31DF\]\/80:hover {
  background-color: rgb(110 49 223 / 0.8);
}
.hover\:bg-b-neutral-2:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(35 38 39 / var(--tw-bg-opacity));
}
.hover\:bg-primary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
}
.hover\:bg-primary-dark-2:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(93 4 161 / var(--tw-bg-opacity));
}
.hover\:text-b-neutral-4:hover {
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.hover\:text-danger:hover {
  --tw-text-opacity: 1;
  color: rgb(235 58 58 / var(--tw-text-opacity));
}
.hover\:text-primary:hover {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.hover\:text-secondary:hover {
  --tw-text-opacity: 1;
  color: rgb(69 248 130 / var(--tw-text-opacity));
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.group:hover .group-hover\:visible {
  visibility: visible;
}
.group:hover .group-hover\:rotate-2 {
  --tw-rotate: 2deg;
  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));
}
.group:hover .group-hover\:scale-105 {
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  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));
}
.group:hover .group-hover\:scale-110 {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  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));
}
.group:hover .group-hover\:bg-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
}
.group:hover .group-hover\:bg-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
}
.group:hover .group-hover\:text-b-neutral-4 {
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.group:hover .group-hover\:text-primary {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
.group:hover .group-hover\:text-secondary {
  --tw-text-opacity: 1;
  color: rgb(69 248 130 / var(--tw-text-opacity));
}
.group:hover .group-hover\:text-w-neutral-1 {
  --tw-text-opacity: 1;
  color: rgb(254 254 254 / var(--tw-text-opacity));
}
.group:hover .group-hover\:opacity-100 {
  opacity: 1;
}
.peer:checked ~ .peer-checked\:bg-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
}
.peer:checked ~ .peer-checked\:bg-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(69 248 130 / var(--tw-bg-opacity));
}
.peer:checked ~ .peer-checked\:after\:translate-x-\[130\%\]::after {
  content: var(--tw-content);
  --tw-translate-x: 130%;
  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));
}
.peer:checked ~ .peer-checked\: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));
}
.peer:checked ~ .peer-checked\:after\:bg-w-neutral-1::after {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(254 254 254 / var(--tw-bg-opacity));
}
.peer:focus ~ .peer-focus\:outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
@media not all and (min-width: 1800px) {
  .max-4xl\:flex-col {
    flex-direction: column;
  }
  .max-4xl\:justify-center {
    justify-content: center;
  }
}
@media not all and (min-width: 1600px) {
  .max-3xl\:flex-col {
    flex-direction: column;
  }
  .max-3xl\:items-center {
    align-items: center;
  }
}
@media not all and (min-width: 1200px) {
  .max-xl\:fixed {
    position: fixed;
  }
  .max-xl\:z-\[60\] {
    z-index: 60;
  }
  .max-xl\:hidden {
    display: none;
  }
  .max-xl\:-translate-x-\[150\%\] {
    --tw-translate-x: -150%;
    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));
  }
  .max-xl\:flex-col {
    flex-direction: column;
  }
  .max-xl\:justify-center {
    justify-content: center;
  }
  .max-xl\:text-center {
    text-align: center;
  }
}
@media not all and (min-width: 992px) {
  .max-lg\:hidden {
    display: none;
  }
  .max-lg\:flex-col {
    flex-direction: column;
  }
}
@media not all and (min-width: 768px) {
  .max-md\:-mt-20 {
    margin-top: -5rem;
  }
  .max-md\:w-full {
    width: 100%;
  }
  .max-md\:max-w-\[400px\] {
    max-width: 400px;
  }
  .max-md\:-translate-x-full {
    --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));
  }
  .max-md\:translate-x-0 {
    --tw-translate-x: 0px;
    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));
  }
  .max-md\:flex-wrap {
    flex-wrap: wrap;
  }
  .max-md\:p-0 {
    padding: 0px;
  }
}
@media not all and (min-width: 576px) {
  .max-sm\:left-0 {
    left: 0px;
  }
  .max-sm\:w-\[266px\] {
    width: 266px;
  }
  .max-sm\:flex-col {
    flex-direction: column;
  }
  .max-sm\:flex-col-reverse {
    flex-direction: column-reverse;
  }
  .max-sm\:flex-wrap {
    flex-wrap: wrap;
  }
  .max-sm\:place-items-center {
    place-items: center;
  }
  .max-sm\:items-start {
    align-items: flex-start;
  }
  .max-sm\:justify-center {
    justify-content: center;
  }
  .max-sm\:py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
  .max-sm\:pb-5 {
    padding-bottom: 1.25rem;
  }
  .max-sm\:text-center {
    text-align: center;
  }
  .\*\:max-sm\:flex-wrap > * {
    flex-wrap: wrap;
  }
}
@media (min-width: 400px) {
  .xsm\:h-\[220px\] {
    height: 220px;
  }
  .xsm\:h-\[260px\] {
    height: 260px;
  }
  .xsm\:w-\[300px\] {
    width: 300px;
  }
  .xsm\:w-\[360px\] {
    width: 360px;
  }
  .xsm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 576px) {
  .sm\:absolute {
    position: absolute;
  }
  .sm\:bottom-\[32px\] {
    bottom: 32px;
  }
  .sm\:left-5 {
    left: 1.25rem;
  }
  .sm\:right-0 {
    right: 0px;
  }
  .sm\:right-\[32px\] {
    right: 32px;
  }
  .sm\:top-18 {
    top: 72px;
  }
  .sm\:top-5 {
    top: 1.25rem;
  }
  .sm\:z-20 {
    z-index: 20;
  }
  .sm\:col-span-1 {
    grid-column: span 1 / span 1
  }
  
  .sm\:col-span-2 {
    grid-column: span 2 / span 2
  }
  .sm\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .sm\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .sm\:mx-6 {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }
  .sm\:-mt-30 {
    margin-top: -120px;
  }
  .sm\:-mt-48 {
    margin-top: -12rem;
  }
  .sm\:block {
    display: block;
  }
  .sm\:flex {
    display: flex;
  }
  .sm\:size-40 {
    width: 10rem;
    height: 10rem;
  }
  .sm\:size-9 {
    width: 2.25rem;
    height: 2.25rem;
  }
  .sm\:size-\[300px\] {
    width: 300px;
    height: 300px;
  }
  .sm\:h-25 {
    height: 100px;
  }
  .sm\:h-\[114px\] {
    height: 114px;
  }
  .sm\:h-\[136px\] {
    height: 136px;
  }
  .sm\:h-\[220px\] {
    height: 220px;
  }
  .sm\:h-\[240px\] {
    height: 240px;
  }
  .sm\:h-\[270px\] {
    height: 270px;
  }
  .sm\:h-\[280px\] {
    height: 280px;
  }
  .sm\:h-\[300px\] {
    height: 300px;
  }
  .sm\:h-\[320px\] {
    height: 320px;
  }
  .sm\:h-\[380px\] {
    height: 380px;
  }
  .sm\:h-\[400px\] {
    height: 400px;
  }
  .sm\:h-\[500px\] {
    height: 500px;
  }
  .sm\:h-\[528px\] {
    height: 528px;
  }
  .sm\:w-30 {
    width: 120px;
  }
  .sm\:w-36 {
    width: 9rem;
  }
  .sm\:w-\[110px\] {
    width: 110px;
  }
  .sm\:w-\[230px\] {
    width: 230px;
  }
  .sm\:w-\[272px\] {
    width: 272px;
  }
  .sm\:w-\[400px\] {
    width: 400px;
  }
  .sm\:w-\[500px\] {
    width: 500px;
  }
  .sm\:w-fit {
    width: -moz-fit-content;
    width: fit-content;
  }
  .sm\:w-full {
    width: 100%;
  }
  .sm\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sm\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sm\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .sm\:flex-row {
    flex-direction: row;
  }
  .sm\:items-end {
    align-items: flex-end;
  }
  .sm\:justify-end {
    justify-content: flex-end;
  }
  .sm\:justify-center {
    justify-content: center;
  }
  .sm\:justify-between {
    justify-content: space-between;
  }
  .sm\:gap-3 {
    gap: 0.75rem;
  }
  .sm\:divide-y-\[20px\] > :not([hidden]) ~ :not([hidden]) {
    --tw-divide-y-reverse: 0;
    border-top-width: calc(20px * calc(1 - var(--tw-divide-y-reverse)));
    border-bottom-width: calc(20px * var(--tw-divide-y-reverse));
  }
  .sm\:py-25 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .sm\:py-3 {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }
  .sm\:py-3\.5 {
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
  .sm\:py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
  .sm\:pb-6 {
    padding-bottom: 1.5rem;
  }
  .sm\:text-\[120px\] {
    font-size: 120px;
  }
  .sm\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}
@media (min-width: 768px) {
  .md\:absolute {
    position: absolute;
  }
  .md\:-bottom-2 {
    bottom: -0.5rem;
  }
  .md\:-bottom-5 {
    bottom: -1.25rem;
  }
  .md\:bottom-12 {
    bottom: 3rem;
  }
  .md\:right-12 {
    right: 3rem;
  }
  .md\:right-5 {
    right: 1.25rem;
  }
  .md\:top-5 {
    top: 1.25rem;
  }
  .md\:col-span-1 {
    grid-column: span 1 / span 1
  }
  .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\:-mt-12 {
    margin-top: -3rem;
  }
  .md\:-mt-36 {
    margin-top: -9rem;
  }
  .md\:-mt-40 {
    margin-top: -10rem;
  }
  .md\:mb-2 {
    margin-bottom: 0.5rem;
  }
  .md\:size-30 {
    width: 120px;
    height: 120px;
  }
  .md\:size-44 {
    width: 11rem;
    height: 11rem;
  }
  .md\:size-\[356px\] {
    width: 356px;
    height: 356px;
  }
  .md\:h-18 {
    height: 72px;
  }
  .md\:h-\[140px\] {
    height: 140px;
  }
  .md\:h-\[170px\] {
    height: 170px;
  }
  .md\:h-\[200px\] {
    height: 200px;
  }
  .md\:h-\[228px\] {
    height: 228px;
  }
  .md\:h-\[240px\] {
    height: 240px;
  }
  .md\:h-\[252px\] {
    height: 252px;
  }
  .md\:h-\[260px\] {
    height: 260px;
  }
  .md\:h-\[280px\] {
    height: 280px;
  }
  .md\:h-\[300px\] {
    height: 300px;
  }
  .md\:h-\[340px\] {
    height: 340px;
  }
  .md\:h-\[360px\] {
    height: 360px;
  }
  .md\:h-\[380px\] {
    height: 380px;
  }
  .md\:h-\[400px\] {
    height: 400px;
  }
  .md\:h-\[420px\] {
    height: 420px;
  }
  .md\:h-\[440px\] {
    height: 440px;
  }
  .md\:h-\[480px\] {
    height: 480px;
  }
  .md\:h-\[580px\] {
    height: 580px;
  }
  .md\:h-full {
    height: 100%;
  }
  .md\:max-h-\[400px\] {
    max-height: 400px;
  }
  .md\:w-25 {
    width: 100px;
  }
  .md\:w-\[380px\] {
    width: 380px;
  }
  .md\:w-\[630px\] {
    width: 630px;
  }
  .md\:translate-y-0 {
    --tw-translate-y: 0px;
    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\:translate-y-full {
    --tw-translate-y: 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\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .md\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .md\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .md\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .md\:flex-row {
    flex-direction: row;
  }
  .md\:items-end {
    align-items: flex-end;
  }
  .md\:justify-end {
    justify-content: flex-end;
  }
  .md\:justify-between {
    justify-content: space-between;
  }
  .md\:gap-\[18px\] {
    gap: 18px;
  }
  .md\:overflow-y-hidden {
    overflow-y: hidden;
  }
  .md\:py-30 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .md\:pb-30 {
    padding-bottom: 120px;
  }
  .md\:pr-4 {
    padding-right: 1rem;
  }
  .md\:pt-12 {
    padding-top: 3rem;
  }
  .md\:pt-\[40px\] {
    padding-top: 40px;
  }
  .md\:text-left {
    text-align: left;
  }
  .md\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .md\:text-\[140px\] {
    font-size: 140px;
  }
}
@media (min-width: 992px) {
  .lg\:-bottom-6 {
    bottom: -1.5rem;
  }
  .lg\:bottom-15 {
    bottom: 60px;
  }
  .lg\:right-15 {
    right: 60px;
  }
  .lg\:order-1 {
    order: 1;
  }
  .lg\:order-2 {
    order: 2;
  }
  .lg\:col-span-1 {
    grid-column: span 1 / span 1
  }
  .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-2 {
    grid-column-start: 2;
  }
  .lg\:col-end-12 {
    grid-column-end: 12;
  }
  .lg\:-mt-15 {
    margin-top: -60px;
  }
  .lg\:-mt-30 {
    margin-top: -120px;
  }
  .lg\:-mt-44 {
    margin-top: -11rem;
  }
  .lg\:ml-\[240px\] {
    margin-left: 240px;
  }
  .lg\:mr-\[136px\] {
    margin-right: 136px;
  }
  .lg\:block {
    display: block;
  }
  .lg\:flex {
    display: flex;
  }
  .lg\:hidden {
    display: none;
  }
  .lg\:size-52 {
    width: 13rem;
    height: 13rem;
  }
  .lg\:h-20 {
    height: 5rem;
  }
  .lg\:h-\[160px\] {
    height: 160px;
  }
  .lg\:h-\[200px\] {
    height: 200px;
  }
  .lg\:h-\[228px\] {
    height: 228px;
  }
  .lg\:h-\[260px\] {
    height: 260px;
  }
  .lg\:h-\[340px\] {
    height: 340px;
  }
  .lg\:h-\[400px\] {
    height: 400px;
  }
  .lg\:h-\[420px\] {
    height: 420px;
  }
  .lg\:h-\[440px\] {
    height: 440px;
  }
  .lg\:h-\[506px\] {
    height: 506px;
  }
  .lg\:h-\[520px\] {
    height: 520px;
  }
  .lg\:h-\[640px\] {
    height: 640px;
  }
  .lg\:max-h-screen {
    max-height: 100vh;
  }
  .lg\:w-\[120px\] {
    width: 120px;
  }
  .lg\:w-\[400px\] {
    width: 400px;
  }
  .lg\:min-w-\[150px\] {
    min-width: 150px;
  }
  .lg\:min-w-\[300px\] {
    min-width: 300px;
  }
  .lg\:max-w-screen-md {
    max-width: 768px;
  }
  .lg\:translate-x-0 {
    --tw-translate-x: 0px;
    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\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .lg\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .lg\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .lg\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .lg\:grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .lg\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .lg\:items-center {
    align-items: center;
  }
  .lg\:gap-5 {
    gap: 1.25rem;
  }
  .lg\:px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
  .lg\:text-\[160px\] {
    font-size: 160px;
  }
}
@media (min-width: 1200px) {
  .xl\:sticky {
    position: sticky;
  }
  .xl\:right-\[30px\] {
    right: 30px;
  }
  .xl\:top-30 {
    top: 120px;
  }
  .xl\:top-\[30px\] {
    top: 30px;
  }
  .xl\:order-1 {
    order: 1;
  }
  .xl\:order-2 {
    order: 2;
  }
  .xl\:col-span-1 {
    grid-column: span 1 / span 1
  }
  .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-2 {
    grid-column-start: 2;
  }
  .xl\:col-start-3 {
    grid-column-start: 3;
  }
  .xl\:col-start-9 {
    grid-column-start: 9;
  }
  .xl\:col-end-11 {
    grid-column-end: 11;
  }
  .xl\:col-end-12 {
    grid-column-end: 12;
  }
  .xl\:col-end-13 {
    grid-column-end: 13;
  }
  .xl\:col-end-8 {
    grid-column-end: 8;
  }
  .xl\:-mt-15 {
    margin-top: -60px;
  }
  .xl\:-mt-52 {
    margin-top: -13rem;
  }
  .xl\:block {
    display: block;
  }
  .xl\:inline-flex {
    display: inline-flex;
  }
  .xl\:grid {
    display: grid;
  }
  .xl\:hidden {
    display: none;
  }
  .xl\:size-60 {
    width: 15rem;
    height: 15rem;
  }
  .xl\:size-\[140px\] {
    width: 140px;
    height: 140px;
  }
  .xl\:h-24 {
    height: 6rem;
  }
  .xl\:h-\[260px\] {
    height: 260px;
  }
  .xl\:h-\[264px\] {
    height: 264px;
  }
  .xl\:h-\[280px\] {
    height: 280px;
  }
  .xl\:h-\[312px\] {
    height: 312px;
  }
  .xl\:h-\[320px\] {
    height: 320px;
  }
  .xl\:h-\[350px\] {
    height: 350px;
  }
  .xl\:h-\[400px\] {
    height: 400px;
  }
  .xl\:h-\[450px\] {
    height: 450px;
  }
  .xl\:h-\[472px\] {
    height: 472px;
  }
  .xl\:h-\[490px\] {
    height: 490px;
  }
  .xl\:h-\[514px\] {
    height: 514px;
  }
  .xl\:h-\[580px\] {
    height: 580px;
  }
  .xl\:h-\[630px\] {
    height: 630px;
  }
  .xl\:h-\[700px\] {
    height: 700px;
  }
  .xl\:max-h-\[532px\] {
    max-height: 532px;
  }
  .xl\:w-\[140px\] {
    width: 140px;
  }
  .xl\:w-\[170px\] {
    width: 170px;
  }
  .xl\:w-\[400px\] {
    width: 400px;
  }
  .xl\:w-full {
    width: 100%;
  }
  .xl\:translate-x-0 {
    --tw-translate-x: 0px;
    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\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .xl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl\:flex-wrap {
    flex-wrap: wrap;
  }
  .xl\:justify-end {
    justify-content: flex-end;
  }
  .xl\:justify-between {
    justify-content: space-between;
  }
  .xl\:gap-6 {
    gap: 1.5rem;
  }
  .xl\:divide-x > :not([hidden]) ~ :not([hidden]) {
    --tw-divide-x-reverse: 0;
    border-right-width: calc(1px * var(--tw-divide-x-reverse));
    border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
  }
  .xl\:p-\[55px\] {
    padding: 55px;
  }
  .xl\:py-\[110px\] {
    padding-top: 110px;
    padding-bottom: 110px;
  }
  .xl\:py-\[130px\] {
    padding-top: 130px;
    padding-bottom: 130px;
  }
  .xl\:py-\[26px\] {
    padding-top: 26px;
    padding-bottom: 26px;
  }
  .xl\:pt-25 {
    padding-top: 100px;
  }
}
@media (min-width: 1400px) {
  .xxl\:sticky {
    position: sticky;
  }
  .xxl\:top-24 {
    top: 6rem;
  }
  .xxl\:top-30 {
    top: 120px;
  }
  .xxl\:order-1 {
    order: 1;
  }
  .xxl\:order-2 {
    order: 2;
  }
  .xxl\:order-3 {
    order: 3;
  }
  .xxl\:col-span-12 {
    grid-column: span 12 / span 12;
  }
  .xxl\:col-span-1 {
    grid-column: span 1 / span 1;
  }
  .xxl\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  .xxl\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .xxl\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .xxl\:col-span-5 {
    grid-column: span 5 / span 5;
  }
  .xxl\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .xxl\:col-span-7 {
    grid-column: span 7 / span 7;
  }
  .xxl\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .xxl\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .xxl\:col-start-2 {
    grid-column-start: 2;
  }
  .xxl\:col-start-3 {
    grid-column-start: 3;
  }
  .xxl\:col-end-11 {
    grid-column-end: 11;
  }
  .xxl\:col-end-12 {
    grid-column-end: 12;
  }
  .xxl\:-mt-30 {
    margin-top: -120px;
  }
  .xxl\:-mt-\[90px\] {
    margin-top: -90px;
  }
  .xxl\:block {
    display: block;
  }
  .xxl\:size-\[160px\] {
    width: 160px;
    height: 160px;
  }
  .xxl\:h-\[110px\] {
    height: 110px;
  }
  .xxl\:h-\[200px\] {
    height: 200px;
  }
  .xxl\:h-\[216px\] {
    height: 216px;
  }
  .xxl\:h-\[304px\] {
    height: 304px;
  }
  .xxl\:h-\[310px\] {
    height: 310px;
  }
  .xxl\:h-\[480px\] {
    height: 480px;
  }
  .xxl\:h-\[510px\] {
    height: 510px;
  }
  .xxl\:h-\[630px\] {
    height: 630px;
  }
  .xxl\:h-\[824px\] {
    height: 824px;
  }
  .xxl\:h-full {
    height: 100%;
  }
  .xxl\:max-h-screen {
    max-height: 100vh;
  }
  .xxl\:w-\[180px\] {
    width: 180px;
  }
  .xxl\:w-\[500px\] {
    width: 500px;
  }
  .xxl\:w-\[572px\] {
    width: 572px;
  }
  .xxl\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xxl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xxl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xxl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xxl\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xxl\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xxl\:grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xxl\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xxl\:gap-\[30px\] {
    gap: 30px;
  }
  .xxl\:overflow-y-auto {
    overflow-y: auto;
  }
  .xxl\:pb-0 {
    padding-bottom: 0px;
  }
  .xxl\:pt-28 {
    padding-top: 7rem;
  }
  .xxl\:pt-30 {
    padding-top: 120px;
  }
}
@media (min-width: 1480px) {
  .min-\[1480px\]\:sticky {
    position: sticky;
  }
  .min-\[1480px\]\:top-30 {
    top: 120px;
  }
  .min-\[1480px\]\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .min-\[1480px\]\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .min-\[1480px\]\:block {
    display: block;
  }
}
@media (min-width: 1500px) {
  .xxl\+\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .xxl\+\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .xxl\+\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xxl\+\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (min-width: 1600px) {
  .\33xl\:absolute {
    position: absolute;
  }
  .\33xl\:-top-25 {
    top: -100px;
  }
  .\33xl\:bottom-0 {
    bottom: 0px;
  }
  .\33xl\:left-1\/2 {
    left: 50%;
  }
  .\33xl\:right-0 {
    right: 0px;
  }
  .\33xl\:order-1 {
    order: 1;
  }
  .\33xl\:order-2 {
    order: 2;
  }
  .\33xl\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .\33xl\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .\33xl\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .\33xl\:col-span-7 {
    grid-column: span 7 / span 7;
  }
  .\33xl\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .\33xl\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .\33xl\:col-start-11 {
    grid-column-start: 11;
  }
  .\33xl\:col-start-2 {
    grid-column-start: 2;
  }
  .\33xl\:col-start-3 {
    grid-column-start: 3;
  }
  .\33xl\:col-end-11 {
    grid-column-end: 11;
  }
  .\33xl\:col-end-12 {
    grid-column-end: 12;
  }
  .\33xl\:mx-7 {
    margin-left: 1.75rem;
    margin-right: 1.75rem;
  }
  .\33xl\:mt-\[70px\] {
    margin-top: 70px;
  }
  .\33xl\:mt-\[90px\] {
    margin-top: 90px;
  }
  .\33xl\:h-\[310px\] {
    height: 310px;
  }
  .\33xl\:h-\[340px\] {
    height: 340px;
  }
  .\33xl\:h-\[428px\] {
    height: 428px;
  }
  .\33xl\:min-h-full {
    min-height: 100%;
  }
  .\33xl\:w-\[266px\] {
    width: 266px;
  }
  .\33xl\:w-\[580px\] {
    width: 580px;
  }
  .\33xl\:min-w-\[157px\] {
    min-width: 157px;
  }
  .\33xl\:min-w-\[163px\] {
    min-width: 163px;
  }
  .\33xl\:min-w-\[206px\] {
    min-width: 206px;
  }
  .\33xl\:-translate-x-1\/2 {
    --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));
  }
  .\33xl\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .\33xl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .\33xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .\33xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .\33xl\:flex-nowrap {
    flex-wrap: nowrap;
  }
  .\33xl\:items-end {
    align-items: flex-end;
  }
  .\33xl\:justify-between {
    justify-content: space-between;
  }
  .\33xl\:justify-around {
    justify-content: space-around;
  }
  .\33xl\:gap-x-10 {
    -moz-column-gap: 2.5rem;
    column-gap: 2.5rem;
  }
  .\33xl\:gap-x-\[128px\] {
    -moz-column-gap: 128px;
    column-gap: 128px;
  }
  .\33xl\:px-\[140px\] {
    padding-left: 140px;
    padding-right: 140px;
  }
  .\33xl\:pb-30 {
    padding-bottom: 120px;
  }
  .\33xl\:pt-\[125px\] {
    padding-top: 125px;
  }
  .\33xl\:pt-\[160px\] {
    padding-top: 160px;
  }
}
@media (min-width: 1800px) {
  .\34xl\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  .\34xl\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .\34xl\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .\34xl\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .\34xl\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .\34xl\:col-start-1 {
    grid-column-start: 1;
  }
  .\34xl\:col-start-11 {
    grid-column-start: 11;
  }
  .\34xl\:col-start-2 {
    grid-column-start: 2;
  }
  .\34xl\:col-start-3 {
    grid-column-start: 3;
  }
  .\34xl\:col-start-5 {
    grid-column-start: 5;
  }
  .\34xl\:col-start-8 {
    grid-column-start: 8;
  }
  .\34xl\:col-end-10 {
    grid-column-end: 10;
  }
  .\34xl\:col-end-11 {
    grid-column-end: 11;
  }
  .\34xl\:col-end-12 {
    grid-column-end: 12;
  }
  .\34xl\:col-end-13 {
    grid-column-end: 13;
  }
  .\34xl\:col-end-4 {
    grid-column-end: 4;
  }
  .\34xl\:col-end-7 {
    grid-column-end: 7;
  }
  .\34xl\:col-end-8 {
    grid-column-end: 8;
  }
  .\34xl\:mb-\[70px\] {
    margin-bottom: 70px;
  }
  .\34xl\:ml-\[70px\] {
    margin-left: 70px;
  }
  .\34xl\:line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .\34xl\:h-\[300px\] {
    height: 300px;
  }
  .\34xl\:h-\[316px\] {
    height: 316px;
  }
  .\34xl\:h-\[320px\] {
    height: 320px;
  }
  .\34xl\:h-\[370px\] {
    height: 370px;
  }
  .\34xl\:h-full {
    height: 100%;
  }
  .\34xl\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .\34xl\:grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .\34xl\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .\34xl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .\34xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .\34xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .\34xl\:justify-between {
    justify-content: space-between;
  }
  .\34xl\:gap-6 {
    gap: 1.5rem;
  }
  .\34xl\:gap-x-6 {
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
  }
  .\34xl\:divide-x > :not([hidden]) ~ :not([hidden]) {
    --tw-divide-x-reverse: 0;
    border-right-width: calc(1px * var(--tw-divide-x-reverse));
    border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
  }
  .\34xl\:px-\[140px\] {
    padding-left: 140px;
    padding-right: 140px;
  }
  .\34xl\:px-\[70px\] {
    padding-left: 70px;
    padding-right: 70px;
  }
  .\34xl\:text-left {
    text-align: left;
  }
}
.px-0 {
  padding-left: 0rem;
  padding-right: 0rem;
}
.w-half {
  width: 50%;
}
.left-sidebar-menu > li > a.active > span:nth-of-type(2) {
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
}
/* .left-sidebar-menu > li > a:hover > span:nth-of-type(2) {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
} */
.left-sidebar-menu > li > a.active:hover > span:nth-of-type(2) {
  --tw-text-opacity: 1;
  color: rgb(3 3 4 / var(--tw-text-opacity));
}
.badge-product-title {
  --tw-bg-opacity: 0.25;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  text-align: center;
  /* color: rgb(3 3 4 / var(--tw-text-opacity)); */
}
.badge-product-title:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 5 213 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
  text-align: center;
  /* color: rgb(3 3 4 / var(--tw-text-opacity)); */
}

/* Footer container */
.mb-footer-k {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 9999997;
    background: linear-gradient(180deg, #1c1c1c 0%, #080808 100%);
    text-align: center;
    line-height: 1.5;
    font-size: 1rem;
    color: #ffffff;
    box-sizing: border-box;
}

/* Inner layer */
.mb-footer-k .mb-footer-k-layer {
    max-width: 1200px;
    width: 100%;
    margin: auto;
    font-weight: 400;
    font-size: 1rem;
    color: #ffffff;
    text-align: center;
    box-sizing: border-box;
}

/* Navbar */
.mb-footer-k .mb-footer-k-navbar {
    min-height: 45px;
    display: inline-flex;
    list-style: none;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0 auto;
    flex-direction: row;
    white-space: nowrap;
    box-sizing: border-box;
    color: #ffffff;
    font-size: 1rem;
    line-height: 1.5;
}

/* Navbar items */
.mb-footer-k .mb-footer-k-navbar > li {
    flex: 1;
    text-align: center;
    line-height: 1;
    padding: 3px 10px;
    margin: 0;
    font-size: 12px;
    position: relative;
    z-index: 0;
}

.mb-footer-k .mb-footer-k-navbar > li > a {
    color: #ffffff;
    display: block;
}

.mb-footer-k .mb-footer-k-navbar > li span {
    margin-top: 3px;
    display: block;
}

/* Active item */
.mb-footer-k .mb-footer-k-navbar > li.active {
    margin-top: -15px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    flex: 0 0 60px;
    background: linear-gradient(135deg, #7e30e4 0%, #3b097b 100%);
    padding: 10px;
    font-size: 10px;
    color: #ffffff;
}

/* Utility class */
.icon-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* .swal2-title {
    color: #fff !important;
}
.swal2-content {
    color: #fff !important;
}
.swal2-html-container {
    color: #fff !important;
}
.swal2-popup {
    background: #26253f !important;
}
.swal2-styled.swal2-confirm {
    background-color: #7b05d5 !important;
}
.swal2-styled.swal2-confirm:hover {
  color: #FFF !important;
  --tw-text-opacity: 1;
  color: rgb(123 5 213 / var(--tw-text-opacity));
} */
/* Header Styles */
#header-nav {
    background-color: #56008B;
}

.nav-toggle {
    width: auto;
    color: #FFF;
}

.topbar-member-info {
    font-size: smaller;
    line-height: normal;
}

/* Login Modal - Ensure highest z-index */
#loginModal {
    z-index: 9000 !important;
}

/* SweetAlert2 - Ensure it's always on top of modals */
.swal2-container {
    z-index: 99999 !important;
}