/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-space-y-reverse: 0;
      --tw-space-x-reverse: 0;
      --tw-divide-x-reverse: 0;
      --tw-border-style: solid;
      --tw-divide-y-reverse: 0;
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-duration: initial;
      --tw-ease: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-red-50: oklch(97.1% .013 17.38);
    --color-red-100: oklch(93.6% .032 17.717);
    --color-red-200: oklch(88.5% .062 18.334);
    --color-red-300: oklch(80.8% .114 19.571);
    --color-red-400: oklch(70.4% .191 22.216);
    --color-red-500: oklch(63.7% .237 25.331);
    --color-orange-50: oklch(98% .016 73.684);
    --color-orange-100: oklch(95.4% .038 75.164);
    --color-orange-200: oklch(90.1% .076 70.697);
    --color-orange-400: oklch(75% .183 55.934);
    --color-orange-500: oklch(70.5% .213 47.604);
    --color-orange-600: oklch(64.6% .222 41.116);
    --color-orange-700: oklch(55.3% .195 38.402);
    --color-orange-800: oklch(47% .157 37.304);
    --color-amber-50: oklch(98.7% .022 95.277);
    --color-amber-100: oklch(96.2% .059 95.617);
    --color-amber-200: oklch(92.4% .12 95.746);
    --color-amber-400: oklch(82.8% .189 84.429);
    --color-amber-500: oklch(76.9% .188 70.08);
    --color-yellow-400: oklch(85.2% .199 91.936);
    --color-green-50: oklch(98.2% .018 155.826);
    --color-green-100: oklch(96.2% .044 156.743);
    --color-green-200: oklch(92.5% .084 155.995);
    --color-green-400: oklch(79.2% .209 151.711);
    --color-green-500: oklch(72.3% .219 149.579);
    --color-green-600: oklch(62.7% .194 149.214);
    --color-green-700: oklch(52.7% .154 150.069);
    --color-green-800: oklch(44.8% .119 151.328);
    --color-emerald-50: oklch(97.9% .021 166.113);
    --color-emerald-100: oklch(95% .052 163.051);
    --color-emerald-200: oklch(90.5% .093 164.15);
    --color-emerald-300: oklch(84.5% .143 164.978);
    --color-emerald-400: oklch(76.5% .177 163.223);
    --color-emerald-500: oklch(69.6% .17 162.48);
    --color-emerald-600: oklch(59.6% .145 163.225);
    --color-sky-50: oklch(97.7% .013 236.62);
    --color-sky-100: oklch(95.1% .026 236.824);
    --color-sky-200: oklch(90.1% .058 230.902);
    --color-sky-400: oklch(74.6% .16 232.661);
    --color-sky-500: oklch(68.5% .169 237.323);
    --color-blue-50: oklch(97% .014 254.604);
    --color-blue-100: oklch(93.2% .032 255.585);
    --color-blue-200: oklch(88.2% .059 254.128);
    --color-blue-300: oklch(80.9% .105 251.813);
    --color-blue-400: oklch(70.7% .165 254.624);
    --color-blue-500: oklch(62.3% .214 259.815);
    --color-blue-600: oklch(54.6% .245 262.881);
    --color-blue-700: oklch(48.8% .243 264.376);
    --color-blue-800: oklch(42.4% .199 265.638);
    --color-indigo-500: oklch(58.5% .233 277.117);
    --color-violet-50: oklch(96.9% .016 293.756);
    --color-violet-200: oklch(89.4% .057 293.283);
    --color-violet-500: oklch(60.6% .25 292.717);
    --color-purple-50: oklch(97.7% .014 308.299);
    --color-purple-100: oklch(94.6% .033 307.174);
    --color-purple-200: oklch(90.2% .063 306.703);
    --color-purple-300: oklch(82.7% .119 306.383);
    --color-slate-50: oklch(98.4% .003 247.858);
    --color-slate-100: oklch(96.8% .007 247.896);
    --color-slate-200: oklch(92.9% .013 255.508);
    --color-slate-300: oklch(86.9% .022 252.894);
    --color-gray-50: oklch(98.5% .002 247.839);
    --color-gray-100: oklch(96.7% .003 264.542);
    --color-gray-200: oklch(92.8% .006 264.531);
    --color-gray-300: oklch(87.2% .01 258.338);
    --color-gray-400: oklch(70.7% .022 261.325);
    --color-gray-500: oklch(55.1% .027 264.364);
    --color-gray-600: oklch(44.6% .03 256.802);
    --color-gray-700: oklch(37.3% .034 259.733);
    --color-gray-800: oklch(27.8% .033 256.848);
    --color-gray-900: oklch(21% .034 264.665);
    --color-black: #000;
    --color-white: #fff;
    --spacing: .25rem;
    --container-xs: 20rem;
    --container-sm: 24rem;
    --container-md: 28rem;
    --container-lg: 32rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
    --container-3xl: 48rem;
    --container-4xl: 56rem;
    --container-5xl: 64rem;
    --container-6xl: 72rem;
    --container-7xl: 80rem;
    --text-xs: .75rem;
    --text-xs--line-height: calc(1 / .75);
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;
    --text-3xl--line-height: calc(2.25 / 1.875);
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
    --text-5xl--line-height: 1;
    --text-6xl: 3.75rem;
    --text-6xl--line-height: 1;
    --font-weight-thin: 100;
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-black: 900;
    --tracking-tight: -.025em;
    --tracking-normal: 0em;
    --tracking-wide: .025em;
    --tracking-wider: .05em;
    --tracking-widest: .1em;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --radius-sm: .25rem;
    --radius-md: .375rem;
    --radius-lg: .5rem;
    --radius-xl: .75rem;
    --radius-2xl: 1rem;
    --radius-3xl: 1.5rem;
    --ease-in: cubic-bezier(.4, 0, 1, 1);
    --ease-out: cubic-bezier(0, 0, .2, 1);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --animate-spin: spin 1s linear infinite;
    --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --blur-sm: 8px;
    --blur-md: 12px;
    --blur-xl: 24px;
    --blur-2xl: 40px;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-primary: #0e1e31;
    --color-primary-light: #1a2a3a;
    --color-primary-dark: #0a1728;
    --color-primary-darker: #050c16;
    --color-accent: #f8a054;
    --color-accent-hover: #fbb87a;
    --color-accent-light: #fef6ec;
    --color-surface: #fafaf8;
    --color-surface-alt: #f5f4f1;
    --color-surface-dim: #edece8;
    --color-border: #e8e6e1;
    --color-border-dark: #374a685e;
    --color-body: #52524e;
    --color-heading: #0e1e31;
    --color-muted: #9a9890;
    --font-heading: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  }
}

@layer base {
  *, :after, :before, ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  html, :host {
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
      -o-tab-size: 4;
         tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }

  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }

  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }

  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }

  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }

  small {
    font-size: 80%;
  }

  sub, sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative;
  }

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }

  :-moz-focusring {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

  ol, ul, menu {
    list-style: none;
  }

  img, svg, video, canvas, audio, iframe, embed, object {
    vertical-align: middle;
    display: block;
  }

  img, video {
    max-width: 100%;
    height: auto;
  }

  button, input, select, optgroup, textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }

  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }

  ::file-selector-button {
    margin-inline-end: 4px;
  }

  ::-moz-placeholder {
    opacity: 1;
  }

  ::placeholder {
    opacity: 1;
  }

  @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
    ::-moz-placeholder {
      color: currentColor;
    }
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab, red, red)) {
      ::-moz-placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }

  textarea {
    resize: vertical;
  }

  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }

  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }

  ::-webkit-datetime-edit {
    display: inline-flex;
  }

  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }

  ::-webkit-datetime-edit {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

  :-moz-ui-invalid {
    box-shadow: none;
  }

  button, input:where([type="button"], [type="reset"], [type="submit"]) {
    -webkit-appearance: button;
       -moz-appearance: button;
            appearance: button;
  }

  ::file-selector-button {
    -webkit-appearance: button;
       -moz-appearance: button;
            appearance: button;
  }

  ::-webkit-inner-spin-button {
    height: auto;
  }

  ::-webkit-outer-spin-button {
    height: auto;
  }

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }

  html {
    scroll-behavior: smooth;
    scroll-padding-top: 56px;
  }

  body {
    font-family: var(--font-sans);
    color: var(--color-body);
    background: var(--color-surface);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  h1, h2, h3, h4, h5, h6 {
    color: var(--color-heading);
  }
}

@layer components;

@layer utilities {
  .\@container {
    container-type: inline-size;
  }

  .pointer-events-none {
    pointer-events: none;
  }

  .collapse {
    visibility: collapse;
  }

  .invisible {
    visibility: hidden;
  }

  .visible {
    visibility: visible;
  }

  .sr-only {
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
  }

  .absolute {
    position: absolute;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .static {
    position: static;
  }

  .sticky {
    position: sticky;
  }

  .-inset-3 {
    inset: calc(var(--spacing) * -3);
  }

  .-inset-4 {
    inset: calc(var(--spacing) * -4);
  }

  .-inset-6 {
    inset: calc(var(--spacing) * -6);
  }

  .-inset-8 {
    inset: calc(var(--spacing) * -8);
  }

  .-inset-9 {
    inset: calc(var(--spacing) * -9);
  }

  .-inset-10 {
    inset: calc(var(--spacing) * -10);
  }

  .-inset-14 {
    inset: calc(var(--spacing) * -14);
  }

  .-inset-px {
    inset: -1px;
  }

  .inset-0 {
    inset: calc(var(--spacing) * 0);
  }

  .inset-x-0 {
    inset-inline: calc(var(--spacing) * 0);
  }

  .inset-x-3 {
    inset-inline: calc(var(--spacing) * 3);
  }

  .inset-x-\[-2px\] {
    inset-inline: -2px;
  }

  .inset-y-0 {
    inset-block: calc(var(--spacing) * 0);
  }

  .start {
    inset-inline-start: var(--spacing);
  }

  .end {
    inset-inline-end: var(--spacing);
  }

  .-top-0\.5 {
    top: calc(var(--spacing) * -.5);
  }

  .-top-1 {
    top: calc(var(--spacing) * -1);
  }

  .-top-1\.5 {
    top: calc(var(--spacing) * -1.5);
  }

  .-top-2 {
    top: calc(var(--spacing) * -2);
  }

  .-top-32 {
    top: calc(var(--spacing) * -32);
  }

  .-top-40 {
    top: calc(var(--spacing) * -40);
  }

  .top-0 {
    top: calc(var(--spacing) * 0);
  }

  .top-0\.5 {
    top: calc(var(--spacing) * .5);
  }

  .top-1 {
    top: calc(var(--spacing) * 1);
  }

  .top-1\.5 {
    top: calc(var(--spacing) * 1.5);
  }

  .top-1\/2 {
    top: 50%;
  }

  .top-1\/3 {
    top: 33.3333%;
  }

  .top-1\/4 {
    top: 25%;
  }

  .top-2 {
    top: calc(var(--spacing) * 2);
  }

  .top-2\.5 {
    top: calc(var(--spacing) * 2.5);
  }

  .top-3 {
    top: calc(var(--spacing) * 3);
  }

  .top-4 {
    top: calc(var(--spacing) * 4);
  }

  .top-8 {
    top: calc(var(--spacing) * 8);
  }

  .top-16 {
    top: calc(var(--spacing) * 16);
  }

  .top-20 {
    top: calc(var(--spacing) * 20);
  }

  .top-28 {
    top: calc(var(--spacing) * 28);
  }

  .top-\[-1px\] {
    top: -1px;
  }

  .top-\[-10\%\] {
    top: -10%;
  }

  .top-\[-10px\] {
    top: -10px;
  }

  .top-\[2px\] {
    top: 2px;
  }

  .top-\[5px\] {
    top: 5px;
  }

  .top-\[6\%\] {
    top: 6%;
  }

  .top-\[10\%\] {
    top: 10%;
  }

  .top-\[10px\] {
    top: 10px;
  }

  .top-\[12\%\] {
    top: 12%;
  }

  .top-\[14px\] {
    top: 14px;
  }

  .top-\[15px\] {
    top: 15px;
  }

  .top-\[28px\] {
    top: 28px;
  }

  .top-\[42px\] {
    top: 42px;
  }

  .top-\[45\%\] {
    top: 45%;
  }

  .top-\[50\%\] {
    top: 50%;
  }

  .top-full {
    top: 100%;
  }

  .-right-0\.5 {
    right: calc(var(--spacing) * -.5);
  }

  .-right-1 {
    right: calc(var(--spacing) * -1);
  }

  .-right-1\.5 {
    right: calc(var(--spacing) * -1.5);
  }

  .-right-2 {
    right: calc(var(--spacing) * -2);
  }

  .-right-3 {
    right: calc(var(--spacing) * -3);
  }

  .-right-4 {
    right: calc(var(--spacing) * -4);
  }

  .-right-8 {
    right: calc(var(--spacing) * -8);
  }

  .-right-16 {
    right: calc(var(--spacing) * -16);
  }

  .right-0 {
    right: calc(var(--spacing) * 0);
  }

  .right-0\.5 {
    right: calc(var(--spacing) * .5);
  }

  .right-1\.5 {
    right: calc(var(--spacing) * 1.5);
  }

  .right-1\/3 {
    right: 33.3333%;
  }

  .right-1\/4 {
    right: 25%;
  }

  .right-2 {
    right: calc(var(--spacing) * 2);
  }

  .right-4 {
    right: calc(var(--spacing) * 4);
  }

  .right-5 {
    right: calc(var(--spacing) * 5);
  }

  .right-6 {
    right: calc(var(--spacing) * 6);
  }

  .right-\[2\%\] {
    right: 2%;
  }

  .right-\[10\%\] {
    right: 10%;
  }

  .right-\[12\%\] {
    right: 12%;
  }

  .right-\[15\%\] {
    right: 15%;
  }

  .right-\[16\%\] {
    right: 16%;
  }

  .-bottom-0\.5 {
    bottom: calc(var(--spacing) * -.5);
  }

  .-bottom-1 {
    bottom: calc(var(--spacing) * -1);
  }

  .-bottom-1\.5 {
    bottom: calc(var(--spacing) * -1.5);
  }

  .-bottom-2 {
    bottom: calc(var(--spacing) * -2);
  }

  .-bottom-3 {
    bottom: calc(var(--spacing) * -3);
  }

  .-bottom-4 {
    bottom: calc(var(--spacing) * -4);
  }

  .-bottom-20 {
    bottom: calc(var(--spacing) * -20);
  }

  .bottom-0 {
    bottom: calc(var(--spacing) * 0);
  }

  .bottom-0\.5 {
    bottom: calc(var(--spacing) * .5);
  }

  .bottom-1 {
    bottom: calc(var(--spacing) * 1);
  }

  .bottom-1\/4 {
    bottom: 25%;
  }

  .bottom-2 {
    bottom: calc(var(--spacing) * 2);
  }

  .bottom-2\.5 {
    bottom: calc(var(--spacing) * 2.5);
  }

  .bottom-4 {
    bottom: calc(var(--spacing) * 4);
  }

  .bottom-8 {
    bottom: calc(var(--spacing) * 8);
  }

  .bottom-12 {
    bottom: calc(var(--spacing) * 12);
  }

  .bottom-16 {
    bottom: calc(var(--spacing) * 16);
  }

  .bottom-\[-60px\] {
    bottom: -60px;
  }

  .bottom-\[5\%\] {
    bottom: 5%;
  }

  .bottom-\[8\%\] {
    bottom: 8%;
  }

  .bottom-\[14\%\] {
    bottom: 14%;
  }

  .bottom-full {
    bottom: 100%;
  }

  .-left-1 {
    left: calc(var(--spacing) * -1);
  }

  .-left-2 {
    left: calc(var(--spacing) * -2);
  }

  .-left-4 {
    left: calc(var(--spacing) * -4);
  }

  .-left-20 {
    left: calc(var(--spacing) * -20);
  }

  .left-0 {
    left: calc(var(--spacing) * 0);
  }

  .left-0\.5 {
    left: calc(var(--spacing) * .5);
  }

  .left-1 {
    left: calc(var(--spacing) * 1);
  }

  .left-1\.5 {
    left: calc(var(--spacing) * 1.5);
  }

  .left-1\/2 {
    left: 50%;
  }

  .left-1\/3 {
    left: 33.3333%;
  }

  .left-1\/4 {
    left: 25%;
  }

  .left-2 {
    left: calc(var(--spacing) * 2);
  }

  .left-2\.5 {
    left: calc(var(--spacing) * 2.5);
  }

  .left-3 {
    left: calc(var(--spacing) * 3);
  }

  .left-4 {
    left: calc(var(--spacing) * 4);
  }

  .left-6 {
    left: calc(var(--spacing) * 6);
  }

  .left-8 {
    left: calc(var(--spacing) * 8);
  }

  .left-12 {
    left: calc(var(--spacing) * 12);
  }

  .left-14 {
    left: calc(var(--spacing) * 14);
  }

  .left-\[3\%\] {
    left: 3%;
  }

  .left-\[8\%\] {
    left: 8%;
  }

  .left-\[14\%\] {
    left: 14%;
  }

  .left-\[15\%\] {
    left: 15%;
  }

  .left-\[16\%\] {
    left: 16%;
  }

  .left-\[20\%\] {
    left: 20%;
  }

  .left-\[27px\] {
    left: 27px;
  }

  .left-\[33\%\] {
    left: 33%;
  }

  .left-\[58\%\] {
    left: 58%;
  }

  .left-\[72px\] {
    left: 72px;
  }

  .left-\[195px\] {
    left: 195px;
  }

  .left-\[240px\] {
    left: 240px;
  }

  .left-\[calc\(70\%\+4px\)\] {
    left: calc(70% + 4px);
  }

  .isolate {
    isolation: isolate;
  }

  .-z-10 {
    z-index: calc(10 * -1);
  }

  .z-0 {
    z-index: 0;
  }

  .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-8 {
    z-index: 8;
  }

  .z-10 {
    z-index: 10;
  }

  .z-20 {
    z-index: 20;
  }

  .z-30 {
    z-index: 30;
  }

  .z-40 {
    z-index: 40;
  }

  .z-50 {
    z-index: 50;
  }

  .z-100 {
    z-index: 100;
  }

  .z-200 {
    z-index: 200;
  }

  .z-\[1\] {
    z-index: 1;
  }

  .z-\[2\] {
    z-index: 2;
  }

  .z-\[5\] {
    z-index: 5;
  }

  .z-\[8\] {
    z-index: 8;
  }

  .order-1 {
    order: 1;
  }

  .order-2 {
    order: 2;
  }

  .col-span-1 {
    grid-column: span 1 / span 1;
  }

  .col-span-2 {
    grid-column: span 2 / span 2;
  }

  .col-span-3 {
    grid-column: span 3 / span 3;
  }

  .col-span-5 {
    grid-column: span 5 / span 5;
  }

  .col-span-6 {
    grid-column: span 6 / span 6;
  }

  .col-span-7 {
    grid-column: span 7 / span 7;
  }

  .row-span-2 {
    grid-row: span 2 / span 2;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .-m-1\.5 {
    margin: calc(var(--spacing) * -1.5);
  }

  .-m-2\.5 {
    margin: calc(var(--spacing) * -2.5);
  }

  .-m-3 {
    margin: calc(var(--spacing) * -3);
  }

  .m-0 {
    margin: calc(var(--spacing) * 0);
  }

  .m-1 {
    margin: calc(var(--spacing) * 1);
  }

  .m-2 {
    margin: calc(var(--spacing) * 2);
  }

  .m-3 {
    margin: calc(var(--spacing) * 3);
  }

  .m-4 {
    margin: calc(var(--spacing) * 4);
  }

  .m-5 {
    margin: calc(var(--spacing) * 5);
  }

  .m-6 {
    margin: calc(var(--spacing) * 6);
  }

  .m-7 {
    margin: calc(var(--spacing) * 7);
  }

  .m-8 {
    margin: calc(var(--spacing) * 8);
  }

  .m-9 {
    margin: calc(var(--spacing) * 9);
  }

  .m-10 {
    margin: calc(var(--spacing) * 10);
  }

  .mx-0\.5 {
    margin-inline: calc(var(--spacing) * .5);
  }

  .mx-1 {
    margin-inline: calc(var(--spacing) * 1);
  }

  .mx-1\.5 {
    margin-inline: calc(var(--spacing) * 1.5);
  }

  .mx-2 {
    margin-inline: calc(var(--spacing) * 2);
  }

  .mx-2\.5 {
    margin-inline: calc(var(--spacing) * 2.5);
  }

  .mx-3 {
    margin-inline: calc(var(--spacing) * 3);
  }

  .mx-4 {
    margin-inline: calc(var(--spacing) * 4);
  }

  .mx-5 {
    margin-inline: calc(var(--spacing) * 5);
  }

  .mx-6 {
    margin-inline: calc(var(--spacing) * 6);
  }

  .mx-7 {
    margin-inline: calc(var(--spacing) * 7);
  }

  .mx-8 {
    margin-inline: calc(var(--spacing) * 8);
  }

  .mx-9 {
    margin-inline: calc(var(--spacing) * 9);
  }

  .mx-10 {
    margin-inline: calc(var(--spacing) * 10);
  }

  .mx-20 {
    margin-inline: calc(var(--spacing) * 20);
  }

  .mx-auto {
    margin-inline: auto;
  }

  .my-1 {
    margin-block: calc(var(--spacing) * 1);
  }

  .my-1\.5 {
    margin-block: calc(var(--spacing) * 1.5);
  }

  .my-2 {
    margin-block: calc(var(--spacing) * 2);
  }

  .my-3 {
    margin-block: calc(var(--spacing) * 3);
  }

  .my-4 {
    margin-block: calc(var(--spacing) * 4);
  }

  .my-5 {
    margin-block: calc(var(--spacing) * 5);
  }

  .my-6 {
    margin-block: calc(var(--spacing) * 6);
  }

  .my-7 {
    margin-block: calc(var(--spacing) * 7);
  }

  .my-8 {
    margin-block: calc(var(--spacing) * 8);
  }

  .my-9 {
    margin-block: calc(var(--spacing) * 9);
  }

  .my-10 {
    margin-block: calc(var(--spacing) * 10);
  }

  .-mt-1 {
    margin-top: calc(var(--spacing) * -1);
  }

  .-mt-2 {
    margin-top: calc(var(--spacing) * -2);
  }

  .-mt-5 {
    margin-top: calc(var(--spacing) * -5);
  }

  .-mt-px {
    margin-top: -1px;
  }

  .mt-0 {
    margin-top: calc(var(--spacing) * 0);
  }

  .mt-0\.5 {
    margin-top: calc(var(--spacing) * .5);
  }

  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }

  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5);
  }

  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }

  .mt-2\.5 {
    margin-top: calc(var(--spacing) * 2.5);
  }

  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }

  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }

  .mt-5 {
    margin-top: calc(var(--spacing) * 5);
  }

  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }

  .mt-7 {
    margin-top: calc(var(--spacing) * 7);
  }

  .mt-8 {
    margin-top: calc(var(--spacing) * 8);
  }

  .mt-9 {
    margin-top: calc(var(--spacing) * 9);
  }

  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }

  .mt-12 {
    margin-top: calc(var(--spacing) * 12);
  }

  .mt-14 {
    margin-top: calc(var(--spacing) * 14);
  }

  .mt-16 {
    margin-top: calc(var(--spacing) * 16);
  }

  .mt-20 {
    margin-top: calc(var(--spacing) * 20);
  }

  .mt-auto {
    margin-top: auto;
  }

  .mr-0 {
    margin-right: calc(var(--spacing) * 0);
  }

  .mr-0\.5 {
    margin-right: calc(var(--spacing) * .5);
  }

  .mr-1 {
    margin-right: calc(var(--spacing) * 1);
  }

  .mr-1\.5 {
    margin-right: calc(var(--spacing) * 1.5);
  }

  .mr-2 {
    margin-right: calc(var(--spacing) * 2);
  }

  .mr-2\.5 {
    margin-right: calc(var(--spacing) * 2.5);
  }

  .mr-3 {
    margin-right: calc(var(--spacing) * 3);
  }

  .mr-4 {
    margin-right: calc(var(--spacing) * 4);
  }

  .mr-5 {
    margin-right: calc(var(--spacing) * 5);
  }

  .mr-6 {
    margin-right: calc(var(--spacing) * 6);
  }

  .mr-7 {
    margin-right: calc(var(--spacing) * 7);
  }

  .mr-8 {
    margin-right: calc(var(--spacing) * 8);
  }

  .mr-9 {
    margin-right: calc(var(--spacing) * 9);
  }

  .mr-10 {
    margin-right: calc(var(--spacing) * 10);
  }

  .mr-14 {
    margin-right: calc(var(--spacing) * 14);
  }

  .-mb-px {
    margin-bottom: -1px;
  }

  .mb-0 {
    margin-bottom: calc(var(--spacing) * 0);
  }

  .mb-0\.5 {
    margin-bottom: calc(var(--spacing) * .5);
  }

  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }

  .mb-1\.5 {
    margin-bottom: calc(var(--spacing) * 1.5);
  }

  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }

  .mb-2\.5 {
    margin-bottom: calc(var(--spacing) * 2.5);
  }

  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }

  .mb-3\.5 {
    margin-bottom: calc(var(--spacing) * 3.5);
  }

  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }

  .mb-5 {
    margin-bottom: calc(var(--spacing) * 5);
  }

  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }

  .mb-7 {
    margin-bottom: calc(var(--spacing) * 7);
  }

  .mb-8 {
    margin-bottom: calc(var(--spacing) * 8);
  }

  .mb-9 {
    margin-bottom: calc(var(--spacing) * 9);
  }

  .mb-10 {
    margin-bottom: calc(var(--spacing) * 10);
  }

  .mb-12 {
    margin-bottom: calc(var(--spacing) * 12);
  }

  .mb-14 {
    margin-bottom: calc(var(--spacing) * 14);
  }

  .mb-16 {
    margin-bottom: calc(var(--spacing) * 16);
  }

  .mb-20 {
    margin-bottom: calc(var(--spacing) * 20);
  }

  .mb-24 {
    margin-bottom: calc(var(--spacing) * 24);
  }

  .mb-28 {
    margin-bottom: calc(var(--spacing) * 28);
  }

  .-ml-1 {
    margin-left: calc(var(--spacing) * -1);
  }

  .-ml-1\.5 {
    margin-left: calc(var(--spacing) * -1.5);
  }

  .-ml-px {
    margin-left: -1px;
  }

  .ml-0 {
    margin-left: calc(var(--spacing) * 0);
  }

  .ml-0\.5 {
    margin-left: calc(var(--spacing) * .5);
  }

  .ml-1 {
    margin-left: calc(var(--spacing) * 1);
  }

  .ml-1\.5 {
    margin-left: calc(var(--spacing) * 1.5);
  }

  .ml-2 {
    margin-left: calc(var(--spacing) * 2);
  }

  .ml-2\.5 {
    margin-left: calc(var(--spacing) * 2.5);
  }

  .ml-3 {
    margin-left: calc(var(--spacing) * 3);
  }

  .ml-4 {
    margin-left: calc(var(--spacing) * 4);
  }

  .ml-5 {
    margin-left: calc(var(--spacing) * 5);
  }

  .ml-6 {
    margin-left: calc(var(--spacing) * 6);
  }

  .ml-7 {
    margin-left: calc(var(--spacing) * 7);
  }

  .ml-8 {
    margin-left: calc(var(--spacing) * 8);
  }

  .ml-9 {
    margin-left: calc(var(--spacing) * 9);
  }

  .ml-10 {
    margin-left: calc(var(--spacing) * 10);
  }

  .ml-12 {
    margin-left: calc(var(--spacing) * 12);
  }

  .ml-\[180px\] {
    margin-left: 180px;
  }

  .ml-auto {
    margin-left: auto;
  }

  .box-content {
    box-sizing: content-box;
  }

  .line-clamp-2 {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
  }

  .block {
    display: block;
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .inline-block {
    display: inline-block;
  }

  .inline-flex {
    display: inline-flex;
  }

  .table {
    display: table;
  }

  .table-cell {
    display: table-cell;
  }

  .aspect-\[4\/3\] {
    aspect-ratio: 4 / 3;
  }

  .aspect-\[16\/10\] {
    aspect-ratio: 16 / 10;
  }

  .aspect-square {
    aspect-ratio: 1;
  }

  .h-0 {
    height: calc(var(--spacing) * 0);
  }

  .h-0\.5 {
    height: calc(var(--spacing) * .5);
  }

  .h-1 {
    height: calc(var(--spacing) * 1);
  }

  .h-1\.5 {
    height: calc(var(--spacing) * 1.5);
  }

  .h-2 {
    height: calc(var(--spacing) * 2);
  }

  .h-2\.5 {
    height: calc(var(--spacing) * 2.5);
  }

  .h-3 {
    height: calc(var(--spacing) * 3);
  }

  .h-3\.5 {
    height: calc(var(--spacing) * 3.5);
  }

  .h-4 {
    height: calc(var(--spacing) * 4);
  }

  .h-5 {
    height: calc(var(--spacing) * 5);
  }

  .h-6 {
    height: calc(var(--spacing) * 6);
  }

  .h-7 {
    height: calc(var(--spacing) * 7);
  }

  .h-8 {
    height: calc(var(--spacing) * 8);
  }

  .h-9 {
    height: calc(var(--spacing) * 9);
  }

  .h-10 {
    height: calc(var(--spacing) * 10);
  }

  .h-11 {
    height: calc(var(--spacing) * 11);
  }

  .h-12 {
    height: calc(var(--spacing) * 12);
  }

  .h-14 {
    height: calc(var(--spacing) * 14);
  }

  .h-16 {
    height: calc(var(--spacing) * 16);
  }

  .h-18 {
    height: calc(var(--spacing) * 18);
  }

  .h-20 {
    height: calc(var(--spacing) * 20);
  }

  .h-24 {
    height: calc(var(--spacing) * 24);
  }

  .h-25 {
    height: calc(var(--spacing) * 25);
  }

  .h-30 {
    height: calc(var(--spacing) * 30);
  }

  .h-32 {
    height: calc(var(--spacing) * 32);
  }

  .h-40 {
    height: calc(var(--spacing) * 40);
  }

  .h-48 {
    height: calc(var(--spacing) * 48);
  }

  .h-50 {
    height: calc(var(--spacing) * 50);
  }

  .h-52 {
    height: calc(var(--spacing) * 52);
  }

  .h-56 {
    height: calc(var(--spacing) * 56);
  }

  .h-60 {
    height: calc(var(--spacing) * 60);
  }

  .h-64 {
    height: calc(var(--spacing) * 64);
  }

  .h-70 {
    height: calc(var(--spacing) * 70);
  }

  .h-75 {
    height: calc(var(--spacing) * 75);
  }

  .h-80 {
    height: calc(var(--spacing) * 80);
  }

  .h-90 {
    height: calc(var(--spacing) * 90);
  }

  .h-96 {
    height: calc(var(--spacing) * 96);
  }

  .h-100 {
    height: calc(var(--spacing) * 100);
  }

  .h-128 {
    height: calc(var(--spacing) * 128);
  }

  .h-256 {
    height: calc(var(--spacing) * 256);
  }

  .h-400 {
    height: calc(var(--spacing) * 400);
  }

  .h-512 {
    height: calc(var(--spacing) * 512);
  }

  .h-\[1\.5px\] {
    height: 1.5px;
  }

  .h-\[1px\] {
    height: 1px;
  }

  .h-\[2px\] {
    height: 2px;
  }

  .h-\[3px\] {
    height: 3px;
  }

  .h-\[4px\] {
    height: 4px;
  }

  .h-\[5px\] {
    height: 5px;
  }

  .h-\[6px\] {
    height: 6px;
  }

  .h-\[7px\] {
    height: 7px;
  }

  .h-\[14px\] {
    height: 14px;
  }

  .h-\[18px\] {
    height: 18px;
  }

  .h-\[22px\] {
    height: 22px;
  }

  .h-\[30px\] {
    height: 30px;
  }

  .h-\[32px\] {
    height: 32px;
  }

  .h-\[35px\] {
    height: 35px;
  }

  .h-\[36px\] {
    height: 36px;
  }

  .h-\[50px\] {
    height: 50px;
  }

  .h-\[54px\] {
    height: 54px;
  }

  .h-\[58px\] {
    height: 58px;
  }

  .h-\[60px\] {
    height: 60px;
  }

  .h-\[72px\] {
    height: 72px;
  }

  .h-\[120px\] {
    height: 120px;
  }

  .h-\[250px\] {
    height: 250px;
  }

  .h-\[280px\] {
    height: 280px;
  }

  .h-\[300px\] {
    height: 300px;
  }

  .h-\[350px\] {
    height: 350px;
  }

  .h-\[380px\] {
    height: 380px;
  }

  .h-\[400px\] {
    height: 400px;
  }

  .h-\[500px\] {
    height: 500px;
  }

  .h-\[900px\] {
    height: 900px;
  }

  .h-auto {
    height: auto;
  }

  .h-full {
    height: 100%;
  }

  .h-px {
    height: 1px;
  }

  .max-h-48 {
    max-height: calc(var(--spacing) * 48);
  }

  .max-h-64 {
    max-height: calc(var(--spacing) * 64);
  }

  .min-h-\[72px\] {
    min-height: 72px;
  }

  .min-h-screen {
    min-height: 100vh;
  }

  .w-0 {
    width: calc(var(--spacing) * 0);
  }

  .w-0\.5 {
    width: calc(var(--spacing) * .5);
  }

  .w-1 {
    width: calc(var(--spacing) * 1);
  }

  .w-1\.5 {
    width: calc(var(--spacing) * 1.5);
  }

  .w-1\/2 {
    width: 50%;
  }

  .w-1\/3 {
    width: 33.3333%;
  }

  .w-2 {
    width: calc(var(--spacing) * 2);
  }

  .w-2\.5 {
    width: calc(var(--spacing) * 2.5);
  }

  .w-2\/3 {
    width: 66.6667%;
  }

  .w-3 {
    width: calc(var(--spacing) * 3);
  }

  .w-3\.5 {
    width: calc(var(--spacing) * 3.5);
  }

  .w-3\/4 {
    width: 75%;
  }

  .w-3\/5 {
    width: 60%;
  }

  .w-4 {
    width: calc(var(--spacing) * 4);
  }

  .w-4\/5 {
    width: 80%;
  }

  .w-5 {
    width: calc(var(--spacing) * 5);
  }

  .w-5\/6 {
    width: 83.3333%;
  }

  .w-6 {
    width: calc(var(--spacing) * 6);
  }

  .w-7 {
    width: calc(var(--spacing) * 7);
  }

  .w-8 {
    width: calc(var(--spacing) * 8);
  }

  .w-9 {
    width: calc(var(--spacing) * 9);
  }

  .w-10 {
    width: calc(var(--spacing) * 10);
  }

  .w-11 {
    width: calc(var(--spacing) * 11);
  }

  .w-11\/12 {
    width: 91.6667%;
  }

  .w-12 {
    width: calc(var(--spacing) * 12);
  }

  .w-14 {
    width: calc(var(--spacing) * 14);
  }

  .w-15 {
    width: calc(var(--spacing) * 15);
  }

  .w-16 {
    width: calc(var(--spacing) * 16);
  }

  .w-18 {
    width: calc(var(--spacing) * 18);
  }

  .w-20 {
    width: calc(var(--spacing) * 20);
  }

  .w-24 {
    width: calc(var(--spacing) * 24);
  }

  .w-25 {
    width: calc(var(--spacing) * 25);
  }

  .w-26 {
    width: calc(var(--spacing) * 26);
  }

  .w-28 {
    width: calc(var(--spacing) * 28);
  }

  .w-30 {
    width: calc(var(--spacing) * 30);
  }

  .w-32 {
    width: calc(var(--spacing) * 32);
  }

  .w-40 {
    width: calc(var(--spacing) * 40);
  }

  .w-48 {
    width: calc(var(--spacing) * 48);
  }

  .w-50 {
    width: calc(var(--spacing) * 50);
  }

  .w-52 {
    width: calc(var(--spacing) * 52);
  }

  .w-56 {
    width: calc(var(--spacing) * 56);
  }

  .w-60 {
    width: calc(var(--spacing) * 60);
  }

  .w-64 {
    width: calc(var(--spacing) * 64);
  }

  .w-70 {
    width: calc(var(--spacing) * 70);
  }

  .w-75 {
    width: calc(var(--spacing) * 75);
  }

  .w-80 {
    width: calc(var(--spacing) * 80);
  }

  .w-90 {
    width: calc(var(--spacing) * 90);
  }

  .w-96 {
    width: calc(var(--spacing) * 96);
  }

  .w-100 {
    width: calc(var(--spacing) * 100);
  }

  .w-128 {
    width: calc(var(--spacing) * 128);
  }

  .w-250 {
    width: calc(var(--spacing) * 250);
  }

  .w-256 {
    width: calc(var(--spacing) * 256);
  }

  .w-512 {
    width: calc(var(--spacing) * 512);
  }

  .w-\[1px\] {
    width: 1px;
  }

  .w-\[3px\] {
    width: 3px;
  }

  .w-\[4px\] {
    width: 4px;
  }

  .w-\[5px\] {
    width: 5px;
  }

  .w-\[6px\] {
    width: 6px;
  }

  .w-\[7px\] {
    width: 7px;
  }

  .w-\[10\%\] {
    width: 10%;
  }

  .w-\[18\%\] {
    width: 18%;
  }

  .w-\[22px\] {
    width: 22px;
  }

  .w-\[28\%\] {
    width: 28%;
  }

  .w-\[30px\] {
    width: 30px;
  }

  .w-\[50px\] {
    width: 50px;
  }

  .w-\[54px\] {
    width: 54px;
  }

  .w-\[60px\] {
    width: 60px;
  }

  .w-\[62\%\] {
    width: 62%;
  }

  .w-\[65\%\] {
    width: 65%;
  }

  .w-\[68\%\] {
    width: 68%;
  }

  .w-\[68px\] {
    width: 68px;
  }

  .w-\[70\%\] {
    width: 70%;
  }

  .w-\[72px\] {
    width: 72px;
  }

  .w-\[80\%\] {
    width: 80%;
  }

  .w-\[85\%\] {
    width: 85%;
  }

  .w-\[90\%\] {
    width: 90%;
  }

  .w-\[92\%\] {
    width: 92%;
  }

  .w-\[100px\] {
    width: 100px;
  }

  .w-\[114px\] {
    width: 114px;
  }

  .w-\[116px\] {
    width: 116px;
  }

  .w-\[118px\] {
    width: 118px;
  }

  .w-\[120px\] {
    width: 120px;
  }

  .w-\[130px\] {
    width: 130px;
  }

  .w-\[132px\] {
    width: 132px;
  }

  .w-\[136px\] {
    width: 136px;
  }

  .w-\[138px\] {
    width: 138px;
  }

  .w-\[140px\] {
    width: 140px;
  }

  .w-\[148px\] {
    width: 148px;
  }

  .w-\[160px\] {
    width: 160px;
  }

  .w-\[165px\] {
    width: 165px;
  }

  .w-\[200px\] {
    width: 200px;
  }

  .w-\[260px\] {
    width: 260px;
  }

  .w-\[280px\] {
    width: 280px;
  }

  .w-\[300px\] {
    width: 300px;
  }

  .w-\[340px\] {
    width: 340px;
  }

  .w-\[350px\] {
    width: 350px;
  }

  .w-\[380px\] {
    width: 380px;
  }

  .w-\[400px\] {
    width: 400px;
  }

  .w-\[450px\] {
    width: 450px;
  }

  .w-\[500px\] {
    width: 500px;
  }

  .w-\[600px\] {
    width: 600px;
  }

  .w-\[900px\] {
    width: 900px;
  }

  .w-auto {
    width: auto;
  }

  .w-full {
    width: 100%;
  }

  .w-px {
    width: 1px;
  }

  .max-w-2xl {
    max-width: var(--container-2xl);
  }

  .max-w-3xl {
    max-width: var(--container-3xl);
  }

  .max-w-4xl {
    max-width: var(--container-4xl);
  }

  .max-w-5xl {
    max-width: var(--container-5xl);
  }

  .max-w-6xl {
    max-width: var(--container-6xl);
  }

  .max-w-7xl {
    max-width: var(--container-7xl);
  }

  .max-w-32 {
    max-width: calc(var(--spacing) * 32);
  }

  .max-w-360 {
    max-width: calc(var(--spacing) * 360);
  }

  .max-w-\[5rem\] {
    max-width: 5rem;
  }

  .max-w-\[20px\] {
    max-width: 20px;
  }

  .max-w-\[30rem\] {
    max-width: 30rem;
  }

  .max-w-\[32rem\] {
    max-width: 32rem;
  }

  .max-w-\[38rem\] {
    max-width: 38rem;
  }

  .max-w-\[40rem\] {
    max-width: 40rem;
  }

  .max-w-\[50px\] {
    max-width: 50px;
  }

  .max-w-\[58rem\] {
    max-width: 58rem;
  }

  .max-w-\[60px\] {
    max-width: 60px;
  }

  .max-w-\[70\%\] {
    max-width: 70%;
  }

  .max-w-\[80px\] {
    max-width: 80px;
  }

  .max-w-\[85\%\] {
    max-width: 85%;
  }

  .max-w-\[90\%\] {
    max-width: 90%;
  }

  .max-w-\[100px\] {
    max-width: 100px;
  }

  .max-w-\[170px\] {
    max-width: 170px;
  }

  .max-w-\[180px\] {
    max-width: 180px;
  }

  .max-w-\[190px\] {
    max-width: 190px;
  }

  .max-w-\[200px\] {
    max-width: 200px;
  }

  .max-w-\[210px\] {
    max-width: 210px;
  }

  .max-w-\[220px\] {
    max-width: 220px;
  }

  .max-w-\[260px\] {
    max-width: 260px;
  }

  .max-w-\[280px\] {
    max-width: 280px;
  }

  .max-w-\[300px\] {
    max-width: 300px;
  }

  .max-w-\[320px\] {
    max-width: 320px;
  }

  .max-w-\[340px\] {
    max-width: 340px;
  }

  .max-w-\[360px\] {
    max-width: 360px;
  }

  .max-w-\[400px\] {
    max-width: 400px;
  }

  .max-w-\[540px\] {
    max-width: 540px;
  }

  .max-w-\[600px\] {
    max-width: 600px;
  }

  .max-w-\[680px\] {
    max-width: 680px;
  }

  .max-w-\[700px\] {
    max-width: 700px;
  }

  .max-w-\[720px\] {
    max-width: 720px;
  }

  .max-w-\[780px\] {
    max-width: 780px;
  }

  .max-w-\[860px\] {
    max-width: 860px;
  }

  .max-w-\[900px\] {
    max-width: 900px;
  }

  .max-w-\[980px\] {
    max-width: 980px;
  }

  .max-w-\[1000px\] {
    max-width: 1000px;
  }

  .max-w-\[1100px\] {
    max-width: 1100px;
  }

  .max-w-\[1200px\] {
    max-width: 1200px;
  }

  .max-w-lg {
    max-width: var(--container-lg);
  }

  .max-w-md {
    max-width: var(--container-md);
  }

  .max-w-none {
    max-width: none;
  }

  .max-w-sm {
    max-width: var(--container-sm);
  }

  .max-w-xl {
    max-width: var(--container-xl);
  }

  .max-w-xs {
    max-width: var(--container-xs);
  }

  .min-w-0 {
    min-width: calc(var(--spacing) * 0);
  }

  .min-w-20 {
    min-width: calc(var(--spacing) * 20);
  }

  .min-w-80 {
    min-width: calc(var(--spacing) * 80);
  }

  .min-w-\[20px\] {
    min-width: 20px;
  }

  .min-w-\[32px\] {
    min-width: 32px;
  }

  .min-w-\[200px\] {
    min-width: 200px;
  }

  .min-w-screen {
    min-width: 100vw;
  }

  .flex-0 {
    flex: 0;
  }

  .flex-1 {
    flex: 1;
  }

  .flex-auto {
    flex: auto;
  }

  .flex-none {
    flex: none;
  }

  .flex-shrink {
    flex-shrink: 1;
  }

  .flex-shrink-0 {
    flex-shrink: 0;
  }

  .shrink {
    flex-shrink: 1;
  }

  .shrink-0 {
    flex-shrink: 0;
  }

  .flex-grow, .grow {
    flex-grow: 1;
  }

  .border-collapse {
    border-collapse: collapse;
  }

  .origin-bottom {
    transform-origin: bottom;
  }

  .origin-left {
    transform-origin: 0;
  }

  .origin-right {
    transform-origin: 100%;
  }

  .-translate-x-0\.5 {
    --tw-translate-x: calc(var(--spacing) * -.5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-x-1\.5 {
    --tw-translate-x: calc(var(--spacing) * -1.5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-x-full {
    --tw-translate-x: -100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-x-0 {
    --tw-translate-x: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-x-1 {
    --tw-translate-x: calc(var(--spacing) * 1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-x-1\.5 {
    --tw-translate-x: calc(var(--spacing) * 1.5);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-x-2 {
    --tw-translate-x: calc(var(--spacing) * 2);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-x-full {
    --tw-translate-x: 100%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-y-1 {
    --tw-translate-y: calc(var(--spacing) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-y-2 {
    --tw-translate-y: calc(var(--spacing) * -2);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-y-px {
    --tw-translate-y: -1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-y-0 {
    --tw-translate-y: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-y-1 {
    --tw-translate-y: calc(var(--spacing) * 1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-y-2 {
    --tw-translate-y: calc(var(--spacing) * 2);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-y-3 {
    --tw-translate-y: calc(var(--spacing) * 3);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .scale-75 {
    --tw-scale-x: 75%;
    --tw-scale-y: 75%;
    --tw-scale-z: 75%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }

  .scale-90 {
    --tw-scale-x: 90%;
    --tw-scale-y: 90%;
    --tw-scale-z: 90%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }

  .scale-95 {
    --tw-scale-x: 95%;
    --tw-scale-y: 95%;
    --tw-scale-z: 95%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }

  .scale-100 {
    --tw-scale-x: 100%;
    --tw-scale-y: 100%;
    --tw-scale-z: 100%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }

  .-rotate-12 {
    rotate: -12deg;
  }

  .rotate-3 {
    rotate: 3deg;
  }

  .rotate-6 {
    rotate: 6deg;
  }

  .rotate-45 {
    rotate: 45deg;
  }

  .rotate-90 {
    rotate: 90deg;
  }

  .rotate-180 {
    rotate: 180deg;
  }

  .transform {
    transform: var(--tw-rotate-x,  ) var(--tw-rotate-y,  ) var(--tw-rotate-z,  ) var(--tw-skew-x,  ) var(--tw-skew-y,  );
  }

  .animate-\[heroFadeUp_1s_0\.1s_both\] {
    animation: 1s .1s both heroFadeUp;
  }

  .animate-\[heroFadeUp_1s_0\.6s_both\] {
    animation: 1s .6s both heroFadeUp;
  }

  .animate-\[heroFadeUp_1s_0\.25s_both\] {
    animation: 1s .25s both heroFadeUp;
  }

  .animate-\[heroFadeUp_1s_0\.45s_both\] {
    animation: 1s .45s both heroFadeUp;
  }

  .animate-pulse {
    animation: var(--animate-pulse);
  }

  .animate-spin {
    animation: var(--animate-spin);
  }

  .cursor-default {
    cursor: default;
  }

  .cursor-grab {
    cursor: grab;
  }

  .cursor-move {
    cursor: move;
  }

  .cursor-not-allowed {
    cursor: not-allowed;
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .resize {
    resize: both;
  }

  .list-disc {
    list-style-type: disc;
  }

  .appearance-none {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }

  .columns-3 {
    -moz-columns: 3;
         columns: 3;
  }

  .grid-cols-1 {
    grid-template-columns: repeat(1, 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-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  .grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }

  .grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .flex-col {
    flex-direction: column;
  }

  .flex-row {
    flex-direction: row;
  }

  .flex-row-reverse {
    flex-direction: row-reverse;
  }

  .flex-nowrap {
    flex-wrap: nowrap;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }

  .items-baseline {
    align-items: baseline;
  }

  .items-center {
    align-items: center;
  }

  .items-end {
    align-items: flex-end;
  }

  .items-start {
    align-items: flex-start;
  }

  .items-stretch {
    align-items: stretch;
  }

  .justify-around {
    justify-content: space-around;
  }

  .justify-between {
    justify-content: space-between;
  }

  .justify-center {
    justify-content: center;
  }

  .justify-end {
    justify-content: flex-end;
  }

  .justify-start {
    justify-content: flex-start;
  }

  .justify-stretch {
    justify-content: stretch;
  }

  .gap-0 {
    gap: calc(var(--spacing) * 0);
  }

  .gap-0\.5 {
    gap: calc(var(--spacing) * .5);
  }

  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }

  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }

  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }

  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5);
  }

  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }

  .gap-3\.5 {
    gap: calc(var(--spacing) * 3.5);
  }

  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }

  .gap-5 {
    gap: calc(var(--spacing) * 5);
  }

  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }

  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }

  .gap-10 {
    gap: calc(var(--spacing) * 10);
  }

  .gap-12 {
    gap: calc(var(--spacing) * 12);
  }

  .gap-\[3px\] {
    gap: 3px;
  }

  .gap-px {
    gap: 1px;
  }

  :where(.space-y-0 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 0) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 0) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-0\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * .5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * .5) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-1 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-1\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-2 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-2\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-3 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-3\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 3.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 3.5) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-4 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-6 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-\[3px\] > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(3px * var(--tw-space-y-reverse));
    margin-block-end: calc(3px * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-\[5px\] > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(5px * var(--tw-space-y-reverse));
    margin-block-end: calc(5px * calc(1 - var(--tw-space-y-reverse)));
  }

  .gap-x-1\.5 {
    -moz-column-gap: calc(var(--spacing) * 1.5);
         column-gap: calc(var(--spacing) * 1.5);
  }

  .gap-x-2 {
    -moz-column-gap: calc(var(--spacing) * 2);
         column-gap: calc(var(--spacing) * 2);
  }

  .gap-x-2\.5 {
    -moz-column-gap: calc(var(--spacing) * 2.5);
         column-gap: calc(var(--spacing) * 2.5);
  }

  .gap-x-4 {
    -moz-column-gap: calc(var(--spacing) * 4);
         column-gap: calc(var(--spacing) * 4);
  }

  .gap-x-5 {
    -moz-column-gap: calc(var(--spacing) * 5);
         column-gap: calc(var(--spacing) * 5);
  }

  .gap-x-6 {
    -moz-column-gap: calc(var(--spacing) * 6);
         column-gap: calc(var(--spacing) * 6);
  }

  .gap-x-8 {
    -moz-column-gap: calc(var(--spacing) * 8);
         column-gap: calc(var(--spacing) * 8);
  }

  .gap-x-10 {
    -moz-column-gap: calc(var(--spacing) * 10);
         column-gap: calc(var(--spacing) * 10);
  }

  .gap-x-12 {
    -moz-column-gap: calc(var(--spacing) * 12);
         column-gap: calc(var(--spacing) * 12);
  }

  .gap-x-16 {
    -moz-column-gap: calc(var(--spacing) * 16);
         column-gap: calc(var(--spacing) * 16);
  }

  :where(.-space-x-1 > :not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing) * -1) * var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing) * -1) * calc(1 - var(--tw-space-x-reverse)));
  }

  :where(.space-x-2 > :not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
  }

  :where(.space-x-3 > :not(:last-child)) {
    --tw-space-x-reverse: 0;
    margin-inline-start: calc(calc(var(--spacing) * 3) * var(--tw-space-x-reverse));
    margin-inline-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-x-reverse)));
  }

  .gap-y-0 {
    row-gap: calc(var(--spacing) * 0);
  }

  .gap-y-1 {
    row-gap: calc(var(--spacing) * 1);
  }

  .gap-y-1\.5 {
    row-gap: calc(var(--spacing) * 1.5);
  }

  .gap-y-2 {
    row-gap: calc(var(--spacing) * 2);
  }

  .gap-y-2\.5 {
    row-gap: calc(var(--spacing) * 2.5);
  }

  .gap-y-3 {
    row-gap: calc(var(--spacing) * 3);
  }

  .gap-y-4 {
    row-gap: calc(var(--spacing) * 4);
  }

  .gap-y-5 {
    row-gap: calc(var(--spacing) * 5);
  }

  .gap-y-7 {
    row-gap: calc(var(--spacing) * 7);
  }

  .gap-y-10 {
    row-gap: calc(var(--spacing) * 10);
  }

  :where(.divide-x > :not(:last-child)) {
    --tw-divide-x-reverse: 0;
    border-inline-style: var(--tw-border-style);
    border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
    border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
  }

  :where(.divide-y > :not(:last-child)) {
    --tw-divide-y-reverse: 0;
    border-bottom-style: var(--tw-border-style);
    border-top-style: var(--tw-border-style);
    border-top-width: calc(1px * var(--tw-divide-y-reverse));
    border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  }

  :where(.divide-border > :not(:last-child)) {
    border-color: var(--color-border);
  }

  :where(.divide-border\/15 > :not(:last-child)) {
    border-color: #e8e6e126;
  }

  @supports (color: color-mix(in lab, red, red)) {
    :where(.divide-border\/15 > :not(:last-child)) {
      border-color: color-mix(in oklab, var(--color-border) 15%, transparent);
    }
  }

  :where(.divide-border\/20 > :not(:last-child)) {
    border-color: #e8e6e133;
  }

  @supports (color: color-mix(in lab, red, red)) {
    :where(.divide-border\/20 > :not(:last-child)) {
      border-color: color-mix(in oklab, var(--color-border) 20%, transparent);
    }
  }

  :where(.divide-border\/50 > :not(:last-child)) {
    border-color: #e8e6e180;
  }

  @supports (color: color-mix(in lab, red, red)) {
    :where(.divide-border\/50 > :not(:last-child)) {
      border-color: color-mix(in oklab, var(--color-border) 50%, transparent);
    }
  }

  :where(.divide-white\/\[0\.04\] > :not(:last-child)) {
    border-color: #ffffff0a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    :where(.divide-white\/\[0\.04\] > :not(:last-child)) {
      border-color: color-mix(in oklab, var(--color-white) 4%, transparent);
    }
  }

  :where(.divide-white\/\[0\.06\] > :not(:last-child)) {
    border-color: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    :where(.divide-white\/\[0\.06\] > :not(:last-child)) {
      border-color: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .self-center {
    align-self: center;
  }

  .self-stretch {
    align-self: stretch;
  }

  .truncate {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .overflow-auto {
    overflow: auto;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .overflow-x-auto {
    overflow-x: auto;
  }

  .overflow-x-clip {
    overflow-x: clip;
  }

  .overflow-x-hidden {
    overflow-x: hidden;
  }

  .overflow-y-auto {
    overflow-y: auto;
  }

  .overflow-y-hidden {
    overflow-y: hidden;
  }

  .overflow-y-scroll {
    overflow-y: scroll;
  }

  .scroll-smooth {
    scroll-behavior: smooth;
  }

  .rounded {
    border-radius: .25rem;
  }

  .rounded-2xl {
    border-radius: var(--radius-2xl);
  }

  .rounded-3xl {
    border-radius: var(--radius-3xl);
  }

  .rounded-\[1px\] {
    border-radius: 1px;
  }

  .rounded-\[3px\] {
    border-radius: 3px;
  }

  .rounded-\[4px\] {
    border-radius: 4px;
  }

  .rounded-\[5px\] {
    border-radius: 5px;
  }

  .rounded-\[8px\] {
    border-radius: 8px;
  }

  .rounded-\[10px\] {
    border-radius: 10px;
  }

  .rounded-full {
    border-radius: 3.40282e38px;
  }

  .rounded-lg {
    border-radius: var(--radius-lg);
  }

  .rounded-md {
    border-radius: var(--radius-md);
  }

  .rounded-sm {
    border-radius: var(--radius-sm);
  }

  .rounded-xl {
    border-radius: var(--radius-xl);
  }

  .rounded-t {
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
  }

  .rounded-t-lg {
    border-top-left-radius: var(--radius-lg);
    border-top-right-radius: var(--radius-lg);
  }

  .rounded-t-md {
    border-top-left-radius: var(--radius-md);
    border-top-right-radius: var(--radius-md);
  }

  .rounded-t-sm {
    border-top-left-radius: var(--radius-sm);
    border-top-right-radius: var(--radius-sm);
  }

  .rounded-t-xl {
    border-top-left-radius: var(--radius-xl);
    border-top-right-radius: var(--radius-xl);
  }

  .rounded-l {
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem;
  }

  .rounded-tl-sm {
    border-top-left-radius: var(--radius-sm);
  }

  .rounded-r {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
  }

  .rounded-b {
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
  }

  .rounded-b-lg {
    border-bottom-right-radius: var(--radius-lg);
    border-bottom-left-radius: var(--radius-lg);
  }

  .rounded-b-xl {
    border-bottom-right-radius: var(--radius-xl);
    border-bottom-left-radius: var(--radius-xl);
  }

  .rounded-br-sm {
    border-bottom-right-radius: var(--radius-sm);
  }

  .rounded-bl-sm {
    border-bottom-left-radius: var(--radius-sm);
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }

  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }

  .border-t-0 {
    border-top-style: var(--tw-border-style);
    border-top-width: 0;
  }

  .border-t-\[8px\] {
    border-top-style: var(--tw-border-style);
    border-top-width: 8px;
  }

  .border-r {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }

  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }

  .border-b-0 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0;
  }

  .border-b-2 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
  }

  .border-l {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
  }

  .border-l-2 {
    border-left-style: var(--tw-border-style);
    border-left-width: 2px;
  }

  .border-l-\[3px\] {
    border-left-style: var(--tw-border-style);
    border-left-width: 3px;
  }

  .border-l-\[8px\] {
    border-left-style: var(--tw-border-style);
    border-left-width: 8px;
  }

  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }

  .border-accent {
    border-color: var(--color-accent);
  }

  .border-accent\/6 {
    border-color: #f8a0540f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/6 {
      border-color: color-mix(in oklab, var(--color-accent) 6%, transparent);
    }
  }

  .border-accent\/10 {
    border-color: #f8a0541a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/10 {
      border-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
    }
  }

  .border-accent\/12 {
    border-color: #f8a0541f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/12 {
      border-color: color-mix(in oklab, var(--color-accent) 12%, transparent);
    }
  }

  .border-accent\/15 {
    border-color: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/15 {
      border-color: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .border-accent\/18 {
    border-color: #f8a0542e;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/18 {
      border-color: color-mix(in oklab, var(--color-accent) 18%, transparent);
    }
  }

  .border-accent\/20 {
    border-color: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/20 {
      border-color: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .border-accent\/25 {
    border-color: #f8a05440;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/25 {
      border-color: color-mix(in oklab, var(--color-accent) 25%, transparent);
    }
  }

  .border-accent\/30 {
    border-color: #f8a0544d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/30 {
      border-color: color-mix(in oklab, var(--color-accent) 30%, transparent);
    }
  }

  .border-accent\/40 {
    border-color: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/40 {
      border-color: color-mix(in oklab, var(--color-accent) 40%, transparent);
    }
  }

  .border-accent\/50 {
    border-color: #f8a05480;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/50 {
      border-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  .border-accent\/\[0\.1\] {
    border-color: #f8a0541a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.1\] {
      border-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
    }
  }

  .border-accent\/\[0\.03\] {
    border-color: #f8a05408;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.03\] {
      border-color: color-mix(in oklab, var(--color-accent) 3%, transparent);
    }
  }

  .border-accent\/\[0\.04\] {
    border-color: #f8a0540a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.04\] {
      border-color: color-mix(in oklab, var(--color-accent) 4%, transparent);
    }
  }

  .border-accent\/\[0\.05\] {
    border-color: #f8a0540d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.05\] {
      border-color: color-mix(in oklab, var(--color-accent) 5%, transparent);
    }
  }

  .border-accent\/\[0\.06\] {
    border-color: #f8a0540f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.06\] {
      border-color: color-mix(in oklab, var(--color-accent) 6%, transparent);
    }
  }

  .border-accent\/\[0\.08\] {
    border-color: #f8a05414;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.08\] {
      border-color: color-mix(in oklab, var(--color-accent) 8%, transparent);
    }
  }

  .border-accent\/\[0\.10\] {
    border-color: #f8a0541a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.10\] {
      border-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
    }
  }

  .border-accent\/\[0\.12\] {
    border-color: #f8a0541f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.12\] {
      border-color: color-mix(in oklab, var(--color-accent) 12%, transparent);
    }
  }

  .border-accent\/\[0\.15\] {
    border-color: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.15\] {
      border-color: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .border-accent\/\[0\.18\] {
    border-color: #f8a0542e;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-accent\/\[0\.18\] {
      border-color: color-mix(in oklab, var(--color-accent) 18%, transparent);
    }
  }

  .border-amber-200\/40 {
    border-color: #fee68566;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-amber-200\/40 {
      border-color: color-mix(in oklab, var(--color-amber-200) 40%, transparent);
    }
  }

  .border-amber-400\/15 {
    border-color: #fcbb0026;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-amber-400\/15 {
      border-color: color-mix(in oklab, var(--color-amber-400) 15%, transparent);
    }
  }

  .border-blue-100 {
    border-color: var(--color-blue-100);
  }

  .border-blue-100\/60 {
    border-color: #dbeafe99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-blue-100\/60 {
      border-color: color-mix(in oklab, var(--color-blue-100) 60%, transparent);
    }
  }

  .border-blue-200 {
    border-color: var(--color-blue-200);
  }

  .border-blue-200\/40 {
    border-color: #bedbff66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-blue-200\/40 {
      border-color: color-mix(in oklab, var(--color-blue-200) 40%, transparent);
    }
  }

  .border-blue-400\/20 {
    border-color: #54a2ff33;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-blue-400\/20 {
      border-color: color-mix(in oklab, var(--color-blue-400) 20%, transparent);
    }
  }

  .border-blue-500\/20 {
    border-color: #3080ff33;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-blue-500\/20 {
      border-color: color-mix(in oklab, var(--color-blue-500) 20%, transparent);
    }
  }

  .border-border {
    border-color: var(--color-border);
  }

  .border-border\/15 {
    border-color: #e8e6e126;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-border\/15 {
      border-color: color-mix(in oklab, var(--color-border) 15%, transparent);
    }
  }

  .border-border\/20 {
    border-color: #e8e6e133;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-border\/20 {
      border-color: color-mix(in oklab, var(--color-border) 20%, transparent);
    }
  }

  .border-border\/30 {
    border-color: #e8e6e14d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-border\/30 {
      border-color: color-mix(in oklab, var(--color-border) 30%, transparent);
    }
  }

  .border-border\/40 {
    border-color: #e8e6e166;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-border\/40 {
      border-color: color-mix(in oklab, var(--color-border) 40%, transparent);
    }
  }

  .border-border\/50 {
    border-color: #e8e6e180;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-border\/50 {
      border-color: color-mix(in oklab, var(--color-border) 50%, transparent);
    }
  }

  .border-border\/60 {
    border-color: #e8e6e199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-border\/60 {
      border-color: color-mix(in oklab, var(--color-border) 60%, transparent);
    }
  }

  .border-emerald-100 {
    border-color: var(--color-emerald-100);
  }

  .border-emerald-200\/40 {
    border-color: #a4f4cf66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-emerald-200\/40 {
      border-color: color-mix(in oklab, var(--color-emerald-200) 40%, transparent);
    }
  }

  .border-emerald-400\/15 {
    border-color: #00d29426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-emerald-400\/15 {
      border-color: color-mix(in oklab, var(--color-emerald-400) 15%, transparent);
    }
  }

  .border-emerald-400\/20 {
    border-color: #00d29433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-emerald-400\/20 {
      border-color: color-mix(in oklab, var(--color-emerald-400) 20%, transparent);
    }
  }

  .border-emerald-400\/30 {
    border-color: #00d2944d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-emerald-400\/30 {
      border-color: color-mix(in oklab, var(--color-emerald-400) 30%, transparent);
    }
  }

  .border-emerald-400\/\[0\.18\] {
    border-color: #00d2942e;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-emerald-400\/\[0\.18\] {
      border-color: color-mix(in oklab, var(--color-emerald-400) 18%, transparent);
    }
  }

  .border-gray-200 {
    border-color: var(--color-gray-200);
  }

  .border-gray-300 {
    border-color: var(--color-gray-300);
  }

  .border-gray-400 {
    border-color: var(--color-gray-400);
  }

  .border-green-100 {
    border-color: var(--color-green-100);
  }

  .border-green-100\/60 {
    border-color: #dcfce799;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-green-100\/60 {
      border-color: color-mix(in oklab, var(--color-green-100) 60%, transparent);
    }
  }

  .border-green-200 {
    border-color: var(--color-green-200);
  }

  .border-green-200\/40 {
    border-color: #b9f8cf66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-green-200\/40 {
      border-color: color-mix(in oklab, var(--color-green-200) 40%, transparent);
    }
  }

  .border-green-200\/60 {
    border-color: #b9f8cf99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-green-200\/60 {
      border-color: color-mix(in oklab, var(--color-green-200) 60%, transparent);
    }
  }

  .border-green-400\/20 {
    border-color: #05df7233;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-green-400\/20 {
      border-color: color-mix(in oklab, var(--color-green-400) 20%, transparent);
    }
  }

  .border-green-400\/40 {
    border-color: #05df7266;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-green-400\/40 {
      border-color: color-mix(in oklab, var(--color-green-400) 40%, transparent);
    }
  }

  .border-heading\/8 {
    border-color: #0e1e3114;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-heading\/8 {
      border-color: color-mix(in oklab, var(--color-heading) 8%, transparent);
    }
  }

  .border-heading\/10 {
    border-color: #0e1e311a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-heading\/10 {
      border-color: color-mix(in oklab, var(--color-heading) 10%, transparent);
    }
  }

  .border-heading\/\[0\.1\] {
    border-color: #0e1e311a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-heading\/\[0\.1\] {
      border-color: color-mix(in oklab, var(--color-heading) 10%, transparent);
    }
  }

  .border-heading\/\[0\.03\] {
    border-color: #0e1e3108;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-heading\/\[0\.03\] {
      border-color: color-mix(in oklab, var(--color-heading) 3%, transparent);
    }
  }

  .border-heading\/\[0\.04\] {
    border-color: #0e1e310a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-heading\/\[0\.04\] {
      border-color: color-mix(in oklab, var(--color-heading) 4%, transparent);
    }
  }

  .border-heading\/\[0\.06\] {
    border-color: #0e1e310f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-heading\/\[0\.06\] {
      border-color: color-mix(in oklab, var(--color-heading) 6%, transparent);
    }
  }

  .border-heading\/\[0\.08\] {
    border-color: #0e1e3114;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-heading\/\[0\.08\] {
      border-color: color-mix(in oklab, var(--color-heading) 8%, transparent);
    }
  }

  .border-orange-200 {
    border-color: var(--color-orange-200);
  }

  .border-orange-200\/40 {
    border-color: #ffd7a866;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-orange-200\/40 {
      border-color: color-mix(in oklab, var(--color-orange-200) 40%, transparent);
    }
  }

  .border-primary {
    border-color: var(--color-primary);
  }

  .border-primary\/\[0\.05\] {
    border-color: #0e1e310d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-primary\/\[0\.05\] {
      border-color: color-mix(in oklab, var(--color-primary) 5%, transparent);
    }
  }

  .border-primary\/\[0\.06\] {
    border-color: #0e1e310f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-primary\/\[0\.06\] {
      border-color: color-mix(in oklab, var(--color-primary) 6%, transparent);
    }
  }

  .border-primary\/\[0\.08\] {
    border-color: #0e1e3114;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-primary\/\[0\.08\] {
      border-color: color-mix(in oklab, var(--color-primary) 8%, transparent);
    }
  }

  .border-purple-100\/60 {
    border-color: #f3e8ff99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-purple-100\/60 {
      border-color: color-mix(in oklab, var(--color-purple-100) 60%, transparent);
    }
  }

  .border-purple-200\/40 {
    border-color: #e9d5ff66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-purple-200\/40 {
      border-color: color-mix(in oklab, var(--color-purple-200) 40%, transparent);
    }
  }

  .border-red-200 {
    border-color: var(--color-red-200);
  }

  .border-red-200\/50 {
    border-color: #ffcaca80;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-red-200\/50 {
      border-color: color-mix(in oklab, var(--color-red-200) 50%, transparent);
    }
  }

  .border-red-200\/60 {
    border-color: #ffcaca99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-red-200\/60 {
      border-color: color-mix(in oklab, var(--color-red-200) 60%, transparent);
    }
  }

  .border-red-400\/15 {
    border-color: #ff656826;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-red-400\/15 {
      border-color: color-mix(in oklab, var(--color-red-400) 15%, transparent);
    }
  }

  .border-red-400\/20 {
    border-color: #ff656833;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-red-400\/20 {
      border-color: color-mix(in oklab, var(--color-red-400) 20%, transparent);
    }
  }

  .border-red-500\/20 {
    border-color: #fb2c3633;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-red-500\/20 {
      border-color: color-mix(in oklab, var(--color-red-500) 20%, transparent);
    }
  }

  .border-sky-200\/40 {
    border-color: #b8e6fe66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-sky-200\/40 {
      border-color: color-mix(in oklab, var(--color-sky-200) 40%, transparent);
    }
  }

  .border-surface-alt\/60 {
    border-color: #f5f4f199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-surface-alt\/60 {
      border-color: color-mix(in oklab, var(--color-surface-alt) 60%, transparent);
    }
  }

  .border-transparent {
    border-color: #0000;
  }

  .border-violet-200\/40 {
    border-color: #ddd6ff66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-violet-200\/40 {
      border-color: color-mix(in oklab, var(--color-violet-200) 40%, transparent);
    }
  }

  .border-white {
    border-color: var(--color-white);
  }

  .border-white\/10 {
    border-color: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/10 {
      border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .border-white\/15 {
    border-color: #ffffff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/15 {
      border-color: color-mix(in oklab, var(--color-white) 15%, transparent);
    }
  }

  .border-white\/20 {
    border-color: #fff3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/20 {
      border-color: color-mix(in oklab, var(--color-white) 20%, transparent);
    }
  }

  .border-white\/30 {
    border-color: #ffffff4d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/30 {
      border-color: color-mix(in oklab, var(--color-white) 30%, transparent);
    }
  }

  .border-white\/\[0\.1\] {
    border-color: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.1\] {
      border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .border-white\/\[0\.04\] {
    border-color: #ffffff0a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.04\] {
      border-color: color-mix(in oklab, var(--color-white) 4%, transparent);
    }
  }

  .border-white\/\[0\.05\] {
    border-color: #ffffff0d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.05\] {
      border-color: color-mix(in oklab, var(--color-white) 5%, transparent);
    }
  }

  .border-white\/\[0\.06\] {
    border-color: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.06\] {
      border-color: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .border-white\/\[0\.07\] {
    border-color: #ffffff12;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.07\] {
      border-color: color-mix(in oklab, var(--color-white) 7.0%, transparent);
    }
  }

  .border-white\/\[0\.08\] {
    border-color: #ffffff14;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.08\] {
      border-color: color-mix(in oklab, var(--color-white) 8%, transparent);
    }
  }

  .border-white\/\[0\.10\] {
    border-color: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.10\] {
      border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .border-white\/\[0\.12\] {
    border-color: #ffffff1f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-white\/\[0\.12\] {
      border-color: color-mix(in oklab, var(--color-white) 12%, transparent);
    }
  }

  .border-t-accent\/15 {
    border-top-color: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-t-accent\/15 {
      border-top-color: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .border-t-white\/\[0\.06\] {
    border-top-color: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-t-white\/\[0\.06\] {
      border-top-color: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .border-b-white\/\[0\.06\] {
    border-bottom-color: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-b-white\/\[0\.06\] {
      border-bottom-color: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .border-l-accent\/20 {
    border-left-color: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-l-accent\/20 {
      border-left-color: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .border-l-accent\/40 {
    border-left-color: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-l-accent\/40 {
      border-left-color: color-mix(in oklab, var(--color-accent) 40%, transparent);
    }
  }

  .border-l-transparent {
    border-left-color: #0000;
  }

  .bg-\[\#0a1628\]\/97 {
    background-color: oklab(19.9764% -.00817466 -.0394435 / .97);
  }

  .bg-\[\#060d17\] {
    background-color: #060d17;
  }

  .bg-accent {
    background-color: var(--color-accent);
  }

  .bg-accent-light {
    background-color: var(--color-accent-light);
  }

  .bg-accent\/0 {
    background-color: #0000;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/0 {
      background-color: color-mix(in oklab, var(--color-accent) 0%, transparent);
    }
  }

  .bg-accent\/5 {
    background-color: #f8a0540d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/5 {
      background-color: color-mix(in oklab, var(--color-accent) 5%, transparent);
    }
  }

  .bg-accent\/6 {
    background-color: #f8a0540f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/6 {
      background-color: color-mix(in oklab, var(--color-accent) 6%, transparent);
    }
  }

  .bg-accent\/8 {
    background-color: #f8a05414;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/8 {
      background-color: color-mix(in oklab, var(--color-accent) 8%, transparent);
    }
  }

  .bg-accent\/10 {
    background-color: #f8a0541a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/10 {
      background-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
    }
  }

  .bg-accent\/12 {
    background-color: #f8a0541f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/12 {
      background-color: color-mix(in oklab, var(--color-accent) 12%, transparent);
    }
  }

  .bg-accent\/15 {
    background-color: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/15 {
      background-color: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .bg-accent\/20 {
    background-color: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/20 {
      background-color: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .bg-accent\/25 {
    background-color: #f8a05440;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/25 {
      background-color: color-mix(in oklab, var(--color-accent) 25%, transparent);
    }
  }

  .bg-accent\/30 {
    background-color: #f8a0544d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/30 {
      background-color: color-mix(in oklab, var(--color-accent) 30%, transparent);
    }
  }

  .bg-accent\/35 {
    background-color: #f8a05459;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/35 {
      background-color: color-mix(in oklab, var(--color-accent) 35%, transparent);
    }
  }

  .bg-accent\/40 {
    background-color: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/40 {
      background-color: color-mix(in oklab, var(--color-accent) 40%, transparent);
    }
  }

  .bg-accent\/50 {
    background-color: #f8a05480;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/50 {
      background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  .bg-accent\/60 {
    background-color: #f8a05499;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/60 {
      background-color: color-mix(in oklab, var(--color-accent) 60%, transparent);
    }
  }

  .bg-accent\/\[0\.1\] {
    background-color: #f8a0541a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.1\] {
      background-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
    }
  }

  .bg-accent\/\[0\.02\] {
    background-color: #f8a05405;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.02\] {
      background-color: color-mix(in oklab, var(--color-accent) 2%, transparent);
    }
  }

  .bg-accent\/\[0\.03\] {
    background-color: #f8a05408;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.03\] {
      background-color: color-mix(in oklab, var(--color-accent) 3%, transparent);
    }
  }

  .bg-accent\/\[0\.04\] {
    background-color: #f8a0540a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.04\] {
      background-color: color-mix(in oklab, var(--color-accent) 4%, transparent);
    }
  }

  .bg-accent\/\[0\.05\] {
    background-color: #f8a0540d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.05\] {
      background-color: color-mix(in oklab, var(--color-accent) 5%, transparent);
    }
  }

  .bg-accent\/\[0\.06\] {
    background-color: #f8a0540f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.06\] {
      background-color: color-mix(in oklab, var(--color-accent) 6%, transparent);
    }
  }

  .bg-accent\/\[0\.08\] {
    background-color: #f8a05414;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.08\] {
      background-color: color-mix(in oklab, var(--color-accent) 8%, transparent);
    }
  }

  .bg-accent\/\[0\.012\] {
    background-color: #f8a05403;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.012\] {
      background-color: color-mix(in oklab, var(--color-accent) 1.2%, transparent);
    }
  }

  .bg-accent\/\[0\.025\] {
    background-color: #f8a05406;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-accent\/\[0\.025\] {
      background-color: color-mix(in oklab, var(--color-accent) 2.5%, transparent);
    }
  }

  .bg-amber-50 {
    background-color: var(--color-amber-50);
  }

  .bg-amber-100 {
    background-color: var(--color-amber-100);
  }

  .bg-amber-100\/70 {
    background-color: #fef3c6b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-amber-100\/70 {
      background-color: color-mix(in oklab, var(--color-amber-100) 70%, transparent);
    }
  }

  .bg-amber-200\/50 {
    background-color: #fee68580;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-amber-200\/50 {
      background-color: color-mix(in oklab, var(--color-amber-200) 50%, transparent);
    }
  }

  .bg-amber-400 {
    background-color: var(--color-amber-400);
  }

  .bg-amber-400\/10 {
    background-color: #fcbb001a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-amber-400\/10 {
      background-color: color-mix(in oklab, var(--color-amber-400) 10%, transparent);
    }
  }

  .bg-amber-400\/30 {
    background-color: #fcbb004d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-amber-400\/30 {
      background-color: color-mix(in oklab, var(--color-amber-400) 30%, transparent);
    }
  }

  .bg-amber-400\/40 {
    background-color: #fcbb0066;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-amber-400\/40 {
      background-color: color-mix(in oklab, var(--color-amber-400) 40%, transparent);
    }
  }

  .bg-amber-400\/50 {
    background-color: #fcbb0080;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-amber-400\/50 {
      background-color: color-mix(in oklab, var(--color-amber-400) 50%, transparent);
    }
  }

  .bg-black {
    background-color: var(--color-black);
  }

  .bg-black\/40 {
    background-color: #0006;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-black\/40 {
      background-color: color-mix(in oklab, var(--color-black) 40%, transparent);
    }
  }

  .bg-blue-50 {
    background-color: var(--color-blue-50);
  }

  .bg-blue-200 {
    background-color: var(--color-blue-200);
  }

  .bg-blue-200\/50 {
    background-color: #bedbff80;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-200\/50 {
      background-color: color-mix(in oklab, var(--color-blue-200) 50%, transparent);
    }
  }

  .bg-blue-200\/60 {
    background-color: #bedbff99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-200\/60 {
      background-color: color-mix(in oklab, var(--color-blue-200) 60%, transparent);
    }
  }

  .bg-blue-200\/70 {
    background-color: #bedbffb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-200\/70 {
      background-color: color-mix(in oklab, var(--color-blue-200) 70%, transparent);
    }
  }

  .bg-blue-400 {
    background-color: var(--color-blue-400);
  }

  .bg-blue-400\/10 {
    background-color: #54a2ff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-400\/10 {
      background-color: color-mix(in oklab, var(--color-blue-400) 10%, transparent);
    }
  }

  .bg-blue-400\/15 {
    background-color: #54a2ff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-400\/15 {
      background-color: color-mix(in oklab, var(--color-blue-400) 15%, transparent);
    }
  }

  .bg-blue-400\/30 {
    background-color: #54a2ff4d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-400\/30 {
      background-color: color-mix(in oklab, var(--color-blue-400) 30%, transparent);
    }
  }

  .bg-blue-400\/50 {
    background-color: #54a2ff80;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-400\/50 {
      background-color: color-mix(in oklab, var(--color-blue-400) 50%, transparent);
    }
  }

  .bg-blue-500 {
    background-color: var(--color-blue-500);
  }

  .bg-blue-500\/15 {
    background-color: #3080ff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-blue-500\/15 {
      background-color: color-mix(in oklab, var(--color-blue-500) 15%, transparent);
    }
  }

  .bg-border {
    background-color: var(--color-border);
  }

  .bg-border\/20 {
    background-color: #e8e6e133;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-border\/20 {
      background-color: color-mix(in oklab, var(--color-border) 20%, transparent);
    }
  }

  .bg-border\/25 {
    background-color: #e8e6e140;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-border\/25 {
      background-color: color-mix(in oklab, var(--color-border) 25%, transparent);
    }
  }

  .bg-border\/30 {
    background-color: #e8e6e14d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-border\/30 {
      background-color: color-mix(in oklab, var(--color-border) 30%, transparent);
    }
  }

  .bg-border\/40 {
    background-color: #e8e6e166;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-border\/40 {
      background-color: color-mix(in oklab, var(--color-border) 40%, transparent);
    }
  }

  .bg-border\/50 {
    background-color: #e8e6e180;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-border\/50 {
      background-color: color-mix(in oklab, var(--color-border) 50%, transparent);
    }
  }

  .bg-border\/60 {
    background-color: #e8e6e199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-border\/60 {
      background-color: color-mix(in oklab, var(--color-border) 60%, transparent);
    }
  }

  .bg-emerald-50 {
    background-color: var(--color-emerald-50);
  }

  .bg-emerald-100 {
    background-color: var(--color-emerald-100);
  }

  .bg-emerald-400\/8 {
    background-color: #00d29414;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-emerald-400\/8 {
      background-color: color-mix(in oklab, var(--color-emerald-400) 8%, transparent);
    }
  }

  .bg-emerald-400\/10 {
    background-color: #00d2941a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-emerald-400\/10 {
      background-color: color-mix(in oklab, var(--color-emerald-400) 10%, transparent);
    }
  }

  .bg-emerald-400\/30 {
    background-color: #00d2944d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-emerald-400\/30 {
      background-color: color-mix(in oklab, var(--color-emerald-400) 30%, transparent);
    }
  }

  .bg-emerald-400\/40 {
    background-color: #00d29466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-emerald-400\/40 {
      background-color: color-mix(in oklab, var(--color-emerald-400) 40%, transparent);
    }
  }

  .bg-emerald-400\/50 {
    background-color: #00d29480;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-emerald-400\/50 {
      background-color: color-mix(in oklab, var(--color-emerald-400) 50%, transparent);
    }
  }

  .bg-emerald-400\/60 {
    background-color: #00d29499;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-emerald-400\/60 {
      background-color: color-mix(in oklab, var(--color-emerald-400) 60%, transparent);
    }
  }

  .bg-emerald-400\/\[0\.08\] {
    background-color: #00d29414;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-emerald-400\/\[0\.08\] {
      background-color: color-mix(in oklab, var(--color-emerald-400) 8%, transparent);
    }
  }

  .bg-gray-50 {
    background-color: var(--color-gray-50);
  }

  .bg-gray-100 {
    background-color: var(--color-gray-100);
  }

  .bg-gray-200 {
    background-color: var(--color-gray-200);
  }

  .bg-gray-400 {
    background-color: var(--color-gray-400);
  }

  .bg-green-50 {
    background-color: var(--color-green-50);
  }

  .bg-green-200 {
    background-color: var(--color-green-200);
  }

  .bg-green-200\/60 {
    background-color: #b9f8cf99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-200\/60 {
      background-color: color-mix(in oklab, var(--color-green-200) 60%, transparent);
    }
  }

  .bg-green-200\/70 {
    background-color: #b9f8cfb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-200\/70 {
      background-color: color-mix(in oklab, var(--color-green-200) 70%, transparent);
    }
  }

  .bg-green-400 {
    background-color: var(--color-green-400);
  }

  .bg-green-400\/10 {
    background-color: #05df721a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-400\/10 {
      background-color: color-mix(in oklab, var(--color-green-400) 10%, transparent);
    }
  }

  .bg-green-400\/15 {
    background-color: #05df7226;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-400\/15 {
      background-color: color-mix(in oklab, var(--color-green-400) 15%, transparent);
    }
  }

  .bg-green-400\/30 {
    background-color: #05df724d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-400\/30 {
      background-color: color-mix(in oklab, var(--color-green-400) 30%, transparent);
    }
  }

  .bg-green-400\/60 {
    background-color: #05df7299;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-400\/60 {
      background-color: color-mix(in oklab, var(--color-green-400) 60%, transparent);
    }
  }

  .bg-green-400\/80 {
    background-color: #05df72cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-400\/80 {
      background-color: color-mix(in oklab, var(--color-green-400) 80%, transparent);
    }
  }

  .bg-green-500\/10 {
    background-color: #00c7581a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-green-500\/10 {
      background-color: color-mix(in oklab, var(--color-green-500) 10%, transparent);
    }
  }

  .bg-heading\/4 {
    background-color: #0e1e310a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/4 {
      background-color: color-mix(in oklab, var(--color-heading) 4%, transparent);
    }
  }

  .bg-heading\/5 {
    background-color: #0e1e310d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/5 {
      background-color: color-mix(in oklab, var(--color-heading) 5%, transparent);
    }
  }

  .bg-heading\/6 {
    background-color: #0e1e310f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/6 {
      background-color: color-mix(in oklab, var(--color-heading) 6%, transparent);
    }
  }

  .bg-heading\/8 {
    background-color: #0e1e3114;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/8 {
      background-color: color-mix(in oklab, var(--color-heading) 8%, transparent);
    }
  }

  .bg-heading\/10 {
    background-color: #0e1e311a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/10 {
      background-color: color-mix(in oklab, var(--color-heading) 10%, transparent);
    }
  }

  .bg-heading\/12 {
    background-color: #0e1e311f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/12 {
      background-color: color-mix(in oklab, var(--color-heading) 12%, transparent);
    }
  }

  .bg-heading\/15 {
    background-color: #0e1e3126;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/15 {
      background-color: color-mix(in oklab, var(--color-heading) 15%, transparent);
    }
  }

  .bg-heading\/\[0\.02\] {
    background-color: #0e1e3105;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/\[0\.02\] {
      background-color: color-mix(in oklab, var(--color-heading) 2%, transparent);
    }
  }

  .bg-heading\/\[0\.03\] {
    background-color: #0e1e3108;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/\[0\.03\] {
      background-color: color-mix(in oklab, var(--color-heading) 3%, transparent);
    }
  }

  .bg-heading\/\[0\.04\] {
    background-color: #0e1e310a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/\[0\.04\] {
      background-color: color-mix(in oklab, var(--color-heading) 4%, transparent);
    }
  }

  .bg-heading\/\[0\.05\] {
    background-color: #0e1e310d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/\[0\.05\] {
      background-color: color-mix(in oklab, var(--color-heading) 5%, transparent);
    }
  }

  .bg-heading\/\[0\.06\] {
    background-color: #0e1e310f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/\[0\.06\] {
      background-color: color-mix(in oklab, var(--color-heading) 6%, transparent);
    }
  }

  .bg-heading\/\[0\.08\] {
    background-color: #0e1e3114;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-heading\/\[0\.08\] {
      background-color: color-mix(in oklab, var(--color-heading) 8%, transparent);
    }
  }

  .bg-muted\/20 {
    background-color: #9a989033;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-muted\/20 {
      background-color: color-mix(in oklab, var(--color-muted) 20%, transparent);
    }
  }

  .bg-orange-50 {
    background-color: var(--color-orange-50);
  }

  .bg-orange-200 {
    background-color: var(--color-orange-200);
  }

  .bg-orange-400 {
    background-color: var(--color-orange-400);
  }

  .bg-primary {
    background-color: var(--color-primary);
  }

  .bg-primary-dark {
    background-color: var(--color-primary-dark);
  }

  .bg-primary-darker {
    background-color: var(--color-primary-darker);
  }

  .bg-primary-light {
    background-color: var(--color-primary-light);
  }

  .bg-primary\/\[0\.03\] {
    background-color: #0e1e3108;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-primary\/\[0\.03\] {
      background-color: color-mix(in oklab, var(--color-primary) 3%, transparent);
    }
  }

  .bg-primary\/\[0\.04\] {
    background-color: #0e1e310a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-primary\/\[0\.04\] {
      background-color: color-mix(in oklab, var(--color-primary) 4%, transparent);
    }
  }

  .bg-primary\/\[0\.05\] {
    background-color: #0e1e310d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-primary\/\[0\.05\] {
      background-color: color-mix(in oklab, var(--color-primary) 5%, transparent);
    }
  }

  .bg-primary\/\[0\.06\] {
    background-color: #0e1e310f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-primary\/\[0\.06\] {
      background-color: color-mix(in oklab, var(--color-primary) 6%, transparent);
    }
  }

  .bg-purple-50 {
    background-color: var(--color-purple-50);
  }

  .bg-purple-200\/60 {
    background-color: #e9d5ff99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-purple-200\/60 {
      background-color: color-mix(in oklab, var(--color-purple-200) 60%, transparent);
    }
  }

  .bg-red-50 {
    background-color: var(--color-red-50);
  }

  .bg-red-50\/40 {
    background-color: #fef2f266;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-50\/40 {
      background-color: color-mix(in oklab, var(--color-red-50) 40%, transparent);
    }
  }

  .bg-red-50\/60 {
    background-color: #fef2f299;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-50\/60 {
      background-color: color-mix(in oklab, var(--color-red-50) 60%, transparent);
    }
  }

  .bg-red-100 {
    background-color: var(--color-red-100);
  }

  .bg-red-300\/40 {
    background-color: #ffa3a366;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-300\/40 {
      background-color: color-mix(in oklab, var(--color-red-300) 40%, transparent);
    }
  }

  .bg-red-300\/60 {
    background-color: #ffa3a399;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-300\/60 {
      background-color: color-mix(in oklab, var(--color-red-300) 60%, transparent);
    }
  }

  .bg-red-400 {
    background-color: var(--color-red-400);
  }

  .bg-red-400\/10 {
    background-color: #ff65681a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-400\/10 {
      background-color: color-mix(in oklab, var(--color-red-400) 10%, transparent);
    }
  }

  .bg-red-400\/15 {
    background-color: #ff656826;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-400\/15 {
      background-color: color-mix(in oklab, var(--color-red-400) 15%, transparent);
    }
  }

  .bg-red-400\/30 {
    background-color: #ff65684d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-400\/30 {
      background-color: color-mix(in oklab, var(--color-red-400) 30%, transparent);
    }
  }

  .bg-red-400\/40 {
    background-color: #ff656866;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-400\/40 {
      background-color: color-mix(in oklab, var(--color-red-400) 40%, transparent);
    }
  }

  .bg-red-400\/70 {
    background-color: #ff6568b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-400\/70 {
      background-color: color-mix(in oklab, var(--color-red-400) 70%, transparent);
    }
  }

  .bg-red-400\/90 {
    background-color: #ff6568e6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-400\/90 {
      background-color: color-mix(in oklab, var(--color-red-400) 90%, transparent);
    }
  }

  .bg-red-400\/\[0\.03\] {
    background-color: #ff656808;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-400\/\[0\.03\] {
      background-color: color-mix(in oklab, var(--color-red-400) 3%, transparent);
    }
  }

  .bg-red-500 {
    background-color: var(--color-red-500);
  }

  .bg-red-500\/10 {
    background-color: #fb2c361a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-red-500\/10 {
      background-color: color-mix(in oklab, var(--color-red-500) 10%, transparent);
    }
  }

  .bg-sky-50 {
    background-color: var(--color-sky-50);
  }

  .bg-sky-100 {
    background-color: var(--color-sky-100);
  }

  .bg-sky-400\/40 {
    background-color: #00bcfe66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-sky-400\/40 {
      background-color: color-mix(in oklab, var(--color-sky-400) 40%, transparent);
    }
  }

  .bg-slate-50\/80 {
    background-color: #f8fafccc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-50\/80 {
      background-color: color-mix(in oklab, var(--color-slate-50) 80%, transparent);
    }
  }

  .bg-slate-100\/80 {
    background-color: #f1f5f9cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-100\/80 {
      background-color: color-mix(in oklab, var(--color-slate-100) 80%, transparent);
    }
  }

  .bg-slate-200\/30 {
    background-color: #e2e8f04d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-200\/30 {
      background-color: color-mix(in oklab, var(--color-slate-200) 30%, transparent);
    }
  }

  .bg-slate-200\/40 {
    background-color: #e2e8f066;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-200\/40 {
      background-color: color-mix(in oklab, var(--color-slate-200) 40%, transparent);
    }
  }

  .bg-slate-200\/50 {
    background-color: #e2e8f080;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-200\/50 {
      background-color: color-mix(in oklab, var(--color-slate-200) 50%, transparent);
    }
  }

  .bg-slate-200\/60 {
    background-color: #e2e8f099;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-200\/60 {
      background-color: color-mix(in oklab, var(--color-slate-200) 60%, transparent);
    }
  }

  .bg-slate-200\/70 {
    background-color: #e2e8f0b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-200\/70 {
      background-color: color-mix(in oklab, var(--color-slate-200) 70%, transparent);
    }
  }

  .bg-slate-200\/80 {
    background-color: #e2e8f0cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-200\/80 {
      background-color: color-mix(in oklab, var(--color-slate-200) 80%, transparent);
    }
  }

  .bg-slate-300\/50 {
    background-color: #cad5e280;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-300\/50 {
      background-color: color-mix(in oklab, var(--color-slate-300) 50%, transparent);
    }
  }

  .bg-slate-300\/60 {
    background-color: #cad5e299;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-slate-300\/60 {
      background-color: color-mix(in oklab, var(--color-slate-300) 60%, transparent);
    }
  }

  .bg-surface {
    background-color: var(--color-surface);
  }

  .bg-surface-alt {
    background-color: var(--color-surface-alt);
  }

  .bg-surface-alt\/10 {
    background-color: #f5f4f11a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-alt\/10 {
      background-color: color-mix(in oklab, var(--color-surface-alt) 10%, transparent);
    }
  }

  .bg-surface-alt\/20 {
    background-color: #f5f4f133;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-alt\/20 {
      background-color: color-mix(in oklab, var(--color-surface-alt) 20%, transparent);
    }
  }

  .bg-surface-alt\/30 {
    background-color: #f5f4f14d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-alt\/30 {
      background-color: color-mix(in oklab, var(--color-surface-alt) 30%, transparent);
    }
  }

  .bg-surface-alt\/40 {
    background-color: #f5f4f166;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-alt\/40 {
      background-color: color-mix(in oklab, var(--color-surface-alt) 40%, transparent);
    }
  }

  .bg-surface-alt\/50 {
    background-color: #f5f4f180;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-alt\/50 {
      background-color: color-mix(in oklab, var(--color-surface-alt) 50%, transparent);
    }
  }

  .bg-surface-alt\/60 {
    background-color: #f5f4f199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-alt\/60 {
      background-color: color-mix(in oklab, var(--color-surface-alt) 60%, transparent);
    }
  }

  .bg-surface-alt\/80 {
    background-color: #f5f4f1cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-alt\/80 {
      background-color: color-mix(in oklab, var(--color-surface-alt) 80%, transparent);
    }
  }

  .bg-surface-dim {
    background-color: var(--color-surface-dim);
  }

  .bg-surface-dim\/60 {
    background-color: #edece899;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-surface-dim\/60 {
      background-color: color-mix(in oklab, var(--color-surface-dim) 60%, transparent);
    }
  }

  .bg-transparent {
    background-color: #0000;
  }

  .bg-violet-50 {
    background-color: var(--color-violet-50);
  }

  .bg-white {
    background-color: var(--color-white);
  }

  .bg-white\/10 {
    background-color: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/10 {
      background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .bg-white\/15 {
    background-color: #ffffff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/15 {
      background-color: color-mix(in oklab, var(--color-white) 15%, transparent);
    }
  }

  .bg-white\/20 {
    background-color: #fff3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/20 {
      background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
    }
  }

  .bg-white\/30 {
    background-color: #ffffff4d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/30 {
      background-color: color-mix(in oklab, var(--color-white) 30%, transparent);
    }
  }

  .bg-white\/40 {
    background-color: #fff6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/40 {
      background-color: color-mix(in oklab, var(--color-white) 40%, transparent);
    }
  }

  .bg-white\/80 {
    background-color: #fffc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/80 {
      background-color: color-mix(in oklab, var(--color-white) 80%, transparent);
    }
  }

  .bg-white\/95 {
    background-color: #fffffff2;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/95 {
      background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
    }
  }

  .bg-white\/\[0\.01\] {
    background-color: #ffffff03;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.01\] {
      background-color: color-mix(in oklab, var(--color-white) 1%, transparent);
    }
  }

  .bg-white\/\[0\.02\] {
    background-color: #ffffff05;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.02\] {
      background-color: color-mix(in oklab, var(--color-white) 2%, transparent);
    }
  }

  .bg-white\/\[0\.2\] {
    background-color: #fff3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.2\] {
      background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
    }
  }

  .bg-white\/\[0\.03\] {
    background-color: #ffffff08;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.03\] {
      background-color: color-mix(in oklab, var(--color-white) 3%, transparent);
    }
  }

  .bg-white\/\[0\.04\] {
    background-color: #ffffff0a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.04\] {
      background-color: color-mix(in oklab, var(--color-white) 4%, transparent);
    }
  }

  .bg-white\/\[0\.05\] {
    background-color: #ffffff0d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.05\] {
      background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
    }
  }

  .bg-white\/\[0\.06\] {
    background-color: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.06\] {
      background-color: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .bg-white\/\[0\.07\] {
    background-color: #ffffff12;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.07\] {
      background-color: color-mix(in oklab, var(--color-white) 7.0%, transparent);
    }
  }

  .bg-white\/\[0\.08\] {
    background-color: #ffffff14;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.08\] {
      background-color: color-mix(in oklab, var(--color-white) 8%, transparent);
    }
  }

  .bg-white\/\[0\.10\] {
    background-color: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.10\] {
      background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .bg-white\/\[0\.012\] {
    background-color: #ffffff03;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.012\] {
      background-color: color-mix(in oklab, var(--color-white) 1.2%, transparent);
    }
  }

  .bg-white\/\[0\.12\] {
    background-color: #ffffff1f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.12\] {
      background-color: color-mix(in oklab, var(--color-white) 12%, transparent);
    }
  }

  .bg-white\/\[0\.015\] {
    background-color: #ffffff04;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.015\] {
      background-color: color-mix(in oklab, var(--color-white) 1.5%, transparent);
    }
  }

  .bg-white\/\[0\.025\] {
    background-color: #ffffff06;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.025\] {
      background-color: color-mix(in oklab, var(--color-white) 2.5%, transparent);
    }
  }

  .bg-white\/\[0\.055\] {
    background-color: #ffffff0e;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-white\/\[0\.055\] {
      background-color: color-mix(in oklab, var(--color-white) 5.5%, transparent);
    }
  }

  .bg-yellow-400 {
    background-color: var(--color-yellow-400);
  }

  .bg-gradient-to-b {
    --tw-gradient-position: to bottom in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .bg-gradient-to-bl {
    --tw-gradient-position: to bottom left in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .bg-gradient-to-br {
    --tw-gradient-position: to bottom right in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .bg-gradient-to-l {
    --tw-gradient-position: to left in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .bg-gradient-to-r {
    --tw-gradient-position: to right in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .bg-gradient-to-t {
    --tw-gradient-position: to top in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .bg-gradient-to-tl {
    --tw-gradient-position: to top left in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .bg-gradient-to-tr {
    --tw-gradient-position: to top right in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .from-\[var\(--color-primary\)\] {
    --tw-gradient-from: var(--color-primary);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent {
    --tw-gradient-from: var(--color-accent);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent\/15 {
    --tw-gradient-from: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-accent\/15 {
      --tw-gradient-from: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .from-accent\/15 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent\/20 {
    --tw-gradient-from: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-accent\/20 {
      --tw-gradient-from: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .from-accent\/20 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent\/25 {
    --tw-gradient-from: #f8a05440;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-accent\/25 {
      --tw-gradient-from: color-mix(in oklab, var(--color-accent) 25%, transparent);
    }
  }

  .from-accent\/25 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent\/30 {
    --tw-gradient-from: #f8a0544d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-accent\/30 {
      --tw-gradient-from: color-mix(in oklab, var(--color-accent) 30%, transparent);
    }
  }

  .from-accent\/30 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent\/35 {
    --tw-gradient-from: #f8a05459;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-accent\/35 {
      --tw-gradient-from: color-mix(in oklab, var(--color-accent) 35%, transparent);
    }
  }

  .from-accent\/35 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent\/40 {
    --tw-gradient-from: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-accent\/40 {
      --tw-gradient-from: color-mix(in oklab, var(--color-accent) 40%, transparent);
    }
  }

  .from-accent\/40 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-accent\/\[0\.08\] {
    --tw-gradient-from: #f8a05414;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-accent\/\[0\.08\] {
      --tw-gradient-from: color-mix(in oklab, var(--color-accent) 8%, transparent);
    }
  }

  .from-accent\/\[0\.08\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-blue-50 {
    --tw-gradient-from: var(--color-blue-50);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-blue-200 {
    --tw-gradient-from: var(--color-blue-200);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-border {
    --tw-gradient-from: var(--color-border);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-border\/8 {
    --tw-gradient-from: #e8e6e114;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-border\/8 {
      --tw-gradient-from: color-mix(in oklab, var(--color-border) 8%, transparent);
    }
  }

  .from-border\/8 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-border\/20 {
    --tw-gradient-from: #e8e6e133;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-border\/20 {
      --tw-gradient-from: color-mix(in oklab, var(--color-border) 20%, transparent);
    }
  }

  .from-border\/20 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-green-50 {
    --tw-gradient-from: var(--color-green-50);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-orange-50 {
    --tw-gradient-from: var(--color-orange-50);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-surface-alt\/60 {
    --tw-gradient-from: #f5f4f199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-surface-alt\/60 {
      --tw-gradient-from: color-mix(in oklab, var(--color-surface-alt) 60%, transparent);
    }
  }

  .from-surface-alt\/60 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-transparent {
    --tw-gradient-from: transparent;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-white\/15 {
    --tw-gradient-from: #ffffff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-white\/15 {
      --tw-gradient-from: color-mix(in oklab, var(--color-white) 15%, transparent);
    }
  }

  .from-white\/15 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-white\/\[0\.03\] {
    --tw-gradient-from: #ffffff08;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-white\/\[0\.03\] {
      --tw-gradient-from: color-mix(in oklab, var(--color-white) 3%, transparent);
    }
  }

  .from-white\/\[0\.03\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-white\/\[0\.04\] {
    --tw-gradient-from: #ffffff0a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-white\/\[0\.04\] {
      --tw-gradient-from: color-mix(in oklab, var(--color-white) 4%, transparent);
    }
  }

  .from-white\/\[0\.04\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-white\/\[0\.06\] {
    --tw-gradient-from: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-white\/\[0\.06\] {
      --tw-gradient-from: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .from-white\/\[0\.06\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-white\/\[0\.08\] {
    --tw-gradient-from: #ffffff14;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-white\/\[0\.08\] {
      --tw-gradient-from: color-mix(in oklab, var(--color-white) 8%, transparent);
    }
  }

  .from-white\/\[0\.08\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .from-white\/\[0\.15\] {
    --tw-gradient-from: #ffffff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .from-white\/\[0\.15\] {
      --tw-gradient-from: color-mix(in oklab, var(--color-white) 15%, transparent);
    }
  }

  .from-white\/\[0\.15\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .via-\[var\(--color-primary-dark\)\] {
    --tw-gradient-via: var(--color-primary-dark);
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/10 {
    --tw-gradient-via: #f8a0541a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/10 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 10%, transparent);
    }
  }

  .via-accent\/10 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/15 {
    --tw-gradient-via: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/15 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .via-accent\/15 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/20 {
    --tw-gradient-via: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/20 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .via-accent\/20 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/25 {
    --tw-gradient-via: #f8a05440;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/25 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 25%, transparent);
    }
  }

  .via-accent\/25 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/30 {
    --tw-gradient-via: #f8a0544d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/30 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 30%, transparent);
    }
  }

  .via-accent\/30 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/40 {
    --tw-gradient-via: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/40 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 40%, transparent);
    }
  }

  .via-accent\/40 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/50 {
    --tw-gradient-via: #f8a05480;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/50 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  .via-accent\/50 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-accent\/60 {
    --tw-gradient-via: #f8a05499;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-accent\/60 {
      --tw-gradient-via: color-mix(in oklab, var(--color-accent) 60%, transparent);
    }
  }

  .via-accent\/60 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-border\/60 {
    --tw-gradient-via: #e8e6e199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-border\/60 {
      --tw-gradient-via: color-mix(in oklab, var(--color-border) 60%, transparent);
    }
  }

  .via-border\/60 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-border\/80 {
    --tw-gradient-via: #e8e6e1cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-border\/80 {
      --tw-gradient-via: color-mix(in oklab, var(--color-border) 80%, transparent);
    }
  }

  .via-border\/80 {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-white {
    --tw-gradient-via: var(--color-white);
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-white\/\[0\.1\] {
    --tw-gradient-via: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-white\/\[0\.1\] {
      --tw-gradient-via: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .via-white\/\[0\.1\] {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-white\/\[0\.06\] {
    --tw-gradient-via: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-white\/\[0\.06\] {
      --tw-gradient-via: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .via-white\/\[0\.06\] {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .via-white\/\[0\.12\] {
    --tw-gradient-via: #ffffff1f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .via-white\/\[0\.12\] {
      --tw-gradient-via: color-mix(in oklab, var(--color-white) 12%, transparent);
    }
  }

  .via-white\/\[0\.12\] {
    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-via-stops);
  }

  .to-\[var\(--color-primary\)\] {
    --tw-gradient-to: var(--color-primary);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent-hover {
    --tw-gradient-to: var(--color-accent-hover);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/5 {
    --tw-gradient-to: #f8a0540d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/5 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 5%, transparent);
    }
  }

  .to-accent\/5 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/6 {
    --tw-gradient-to: #f8a0540f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/6 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 6%, transparent);
    }
  }

  .to-accent\/6 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/8 {
    --tw-gradient-to: #f8a05414;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/8 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 8%, transparent);
    }
  }

  .to-accent\/8 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/10 {
    --tw-gradient-to: #f8a0541a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/10 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 10%, transparent);
    }
  }

  .to-accent\/10 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/12 {
    --tw-gradient-to: #f8a0541f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/12 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 12%, transparent);
    }
  }

  .to-accent\/12 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/15 {
    --tw-gradient-to: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/15 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .to-accent\/15 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/20 {
    --tw-gradient-to: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/20 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .to-accent\/20 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/30 {
    --tw-gradient-to: #f8a0544d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/30 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 30%, transparent);
    }
  }

  .to-accent\/30 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/40 {
    --tw-gradient-to: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/40 {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 40%, transparent);
    }
  }

  .to-accent\/40 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/\[0\.02\] {
    --tw-gradient-to: #f8a05405;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/\[0\.02\] {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 2%, transparent);
    }
  }

  .to-accent\/\[0\.02\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-accent\/\[0\.03\] {
    --tw-gradient-to: #f8a05408;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-accent\/\[0\.03\] {
      --tw-gradient-to: color-mix(in oklab, var(--color-accent) 3%, transparent);
    }
  }

  .to-accent\/\[0\.03\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-blue-100 {
    --tw-gradient-to: var(--color-blue-100);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-blue-100\/50 {
    --tw-gradient-to: #dbeafe80;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-blue-100\/50 {
      --tw-gradient-to: color-mix(in oklab, var(--color-blue-100) 50%, transparent);
    }
  }

  .to-blue-100\/50 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-border {
    --tw-gradient-to: var(--color-border);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-border\/20 {
    --tw-gradient-to: #e8e6e133;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-border\/20 {
      --tw-gradient-to: color-mix(in oklab, var(--color-border) 20%, transparent);
    }
  }

  .to-border\/20 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-border\/30 {
    --tw-gradient-to: #e8e6e14d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-border\/30 {
      --tw-gradient-to: color-mix(in oklab, var(--color-border) 30%, transparent);
    }
  }

  .to-border\/30 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-border\/50 {
    --tw-gradient-to: #e8e6e180;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-border\/50 {
      --tw-gradient-to: color-mix(in oklab, var(--color-border) 50%, transparent);
    }
  }

  .to-border\/50 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-green-100 {
    --tw-gradient-to: var(--color-green-100);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-orange-100 {
    --tw-gradient-to: var(--color-orange-100);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-transparent {
    --tw-gradient-to: transparent;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-white\/10 {
    --tw-gradient-to: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-white\/10 {
      --tw-gradient-to: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .to-white\/10 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-white\/15 {
    --tw-gradient-to: #ffffff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-white\/15 {
      --tw-gradient-to: color-mix(in oklab, var(--color-white) 15%, transparent);
    }
  }

  .to-white\/15 {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-white\/\[0\.3\] {
    --tw-gradient-to: #ffffff4d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-white\/\[0\.3\] {
      --tw-gradient-to: color-mix(in oklab, var(--color-white) 30%, transparent);
    }
  }

  .to-white\/\[0\.3\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-white\/\[0\.06\] {
    --tw-gradient-to: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-white\/\[0\.06\] {
      --tw-gradient-to: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .to-white\/\[0\.06\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-white\/\[0\.08\] {
    --tw-gradient-to: #ffffff14;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .to-white\/\[0\.08\] {
      --tw-gradient-to: color-mix(in oklab, var(--color-white) 8%, transparent);
    }
  }

  .to-white\/\[0\.08\] {
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .bg-cover {
    background-size: cover;
  }

  .bg-no-repeat {
    background-repeat: no-repeat;
  }

  .mask-repeat {
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat;
  }

  .object-cover {
    -o-object-fit: cover;
       object-fit: cover;
  }

  .p-0 {
    padding: calc(var(--spacing) * 0);
  }

  .p-0\.5 {
    padding: calc(var(--spacing) * .5);
  }

  .p-1 {
    padding: calc(var(--spacing) * 1);
  }

  .p-1\.5 {
    padding: calc(var(--spacing) * 1.5);
  }

  .p-2 {
    padding: calc(var(--spacing) * 2);
  }

  .p-2\.5 {
    padding: calc(var(--spacing) * 2.5);
  }

  .p-3 {
    padding: calc(var(--spacing) * 3);
  }

  .p-3\.5 {
    padding: calc(var(--spacing) * 3.5);
  }

  .p-4 {
    padding: calc(var(--spacing) * 4);
  }

  .p-5 {
    padding: calc(var(--spacing) * 5);
  }

  .p-6 {
    padding: calc(var(--spacing) * 6);
  }

  .p-7 {
    padding: calc(var(--spacing) * 7);
  }

  .p-8 {
    padding: calc(var(--spacing) * 8);
  }

  .p-9 {
    padding: calc(var(--spacing) * 9);
  }

  .p-10 {
    padding: calc(var(--spacing) * 10);
  }

  .px-0 {
    padding-inline: calc(var(--spacing) * 0);
  }

  .px-0\.5 {
    padding-inline: calc(var(--spacing) * .5);
  }

  .px-1 {
    padding-inline: calc(var(--spacing) * 1);
  }

  .px-1\.5 {
    padding-inline: calc(var(--spacing) * 1.5);
  }

  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }

  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }

  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }

  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }

  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }

  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }

  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }

  .px-7 {
    padding-inline: calc(var(--spacing) * 7);
  }

  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }

  .px-9 {
    padding-inline: calc(var(--spacing) * 9);
  }

  .px-10 {
    padding-inline: calc(var(--spacing) * 10);
  }

  .px-14 {
    padding-inline: calc(var(--spacing) * 14);
  }

  .px-\[6px\] {
    padding-inline: 6px;
  }

  .px-\[7px\] {
    padding-inline: 7px;
  }

  .py-0 {
    padding-block: calc(var(--spacing) * 0);
  }

  .py-0\.5 {
    padding-block: calc(var(--spacing) * .5);
  }

  .py-1 {
    padding-block: calc(var(--spacing) * 1);
  }

  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }

  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }

  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5);
  }

  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }

  .py-3\.5 {
    padding-block: calc(var(--spacing) * 3.5);
  }

  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }

  .py-5 {
    padding-block: calc(var(--spacing) * 5);
  }

  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }

  .py-7 {
    padding-block: calc(var(--spacing) * 7);
  }

  .py-8 {
    padding-block: calc(var(--spacing) * 8);
  }

  .py-9 {
    padding-block: calc(var(--spacing) * 9);
  }

  .py-10 {
    padding-block: calc(var(--spacing) * 10);
  }

  .py-12 {
    padding-block: calc(var(--spacing) * 12);
  }

  .py-14 {
    padding-block: calc(var(--spacing) * 14);
  }

  .py-16 {
    padding-block: calc(var(--spacing) * 16);
  }

  .py-20 {
    padding-block: calc(var(--spacing) * 20);
  }

  .py-24 {
    padding-block: calc(var(--spacing) * 24);
  }

  .py-28 {
    padding-block: calc(var(--spacing) * 28);
  }

  .py-32 {
    padding-block: calc(var(--spacing) * 32);
  }

  .py-\[1px\] {
    padding-block: 1px;
  }

  .py-\[2px\] {
    padding-block: 2px;
  }

  .py-\[3px\] {
    padding-block: 3px;
  }

  .py-px {
    padding-block: 1px;
  }

  .pt-0 {
    padding-top: calc(var(--spacing) * 0);
  }

  .pt-1 {
    padding-top: calc(var(--spacing) * 1);
  }

  .pt-1\.5 {
    padding-top: calc(var(--spacing) * 1.5);
  }

  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }

  .pt-2\.5 {
    padding-top: calc(var(--spacing) * 2.5);
  }

  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }

  .pt-3\.5 {
    padding-top: calc(var(--spacing) * 3.5);
  }

  .pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }

  .pt-5 {
    padding-top: calc(var(--spacing) * 5);
  }

  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }

  .pt-7 {
    padding-top: calc(var(--spacing) * 7);
  }

  .pt-8 {
    padding-top: calc(var(--spacing) * 8);
  }

  .pt-9 {
    padding-top: calc(var(--spacing) * 9);
  }

  .pt-10 {
    padding-top: calc(var(--spacing) * 10);
  }

  .pt-12 {
    padding-top: calc(var(--spacing) * 12);
  }

  .pt-14 {
    padding-top: calc(var(--spacing) * 14);
  }

  .pt-16 {
    padding-top: calc(var(--spacing) * 16);
  }

  .pt-20 {
    padding-top: calc(var(--spacing) * 20);
  }

  .pt-24 {
    padding-top: calc(var(--spacing) * 24);
  }

  .pt-28 {
    padding-top: calc(var(--spacing) * 28);
  }

  .pt-44 {
    padding-top: calc(var(--spacing) * 44);
  }

  .pt-\[12px\] {
    padding-top: 12px;
  }

  .pt-\[60px\] {
    padding-top: 60px;
  }

  .pt-\[195px\] {
    padding-top: 195px;
  }

  .pr-0 {
    padding-right: calc(var(--spacing) * 0);
  }

  .pr-1 {
    padding-right: calc(var(--spacing) * 1);
  }

  .pr-2 {
    padding-right: calc(var(--spacing) * 2);
  }

  .pr-2\.5 {
    padding-right: calc(var(--spacing) * 2.5);
  }

  .pr-3 {
    padding-right: calc(var(--spacing) * 3);
  }

  .pr-4 {
    padding-right: calc(var(--spacing) * 4);
  }

  .pr-5 {
    padding-right: calc(var(--spacing) * 5);
  }

  .pr-6 {
    padding-right: calc(var(--spacing) * 6);
  }

  .pr-7 {
    padding-right: calc(var(--spacing) * 7);
  }

  .pr-8 {
    padding-right: calc(var(--spacing) * 8);
  }

  .pr-9 {
    padding-right: calc(var(--spacing) * 9);
  }

  .pr-10 {
    padding-right: calc(var(--spacing) * 10);
  }

  .pr-11 {
    padding-right: calc(var(--spacing) * 11);
  }

  .pr-12 {
    padding-right: calc(var(--spacing) * 12);
  }

  .pb-0 {
    padding-bottom: calc(var(--spacing) * 0);
  }

  .pb-0\.5 {
    padding-bottom: calc(var(--spacing) * .5);
  }

  .pb-1 {
    padding-bottom: calc(var(--spacing) * 1);
  }

  .pb-1\.5 {
    padding-bottom: calc(var(--spacing) * 1.5);
  }

  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }

  .pb-2\.5 {
    padding-bottom: calc(var(--spacing) * 2.5);
  }

  .pb-3 {
    padding-bottom: calc(var(--spacing) * 3);
  }

  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }

  .pb-5 {
    padding-bottom: calc(var(--spacing) * 5);
  }

  .pb-6 {
    padding-bottom: calc(var(--spacing) * 6);
  }

  .pb-7 {
    padding-bottom: calc(var(--spacing) * 7);
  }

  .pb-8 {
    padding-bottom: calc(var(--spacing) * 8);
  }

  .pb-9 {
    padding-bottom: calc(var(--spacing) * 9);
  }

  .pb-10 {
    padding-bottom: calc(var(--spacing) * 10);
  }

  .pb-12 {
    padding-bottom: calc(var(--spacing) * 12);
  }

  .pb-14 {
    padding-bottom: calc(var(--spacing) * 14);
  }

  .pb-16 {
    padding-bottom: calc(var(--spacing) * 16);
  }

  .pb-20 {
    padding-bottom: calc(var(--spacing) * 20);
  }

  .pb-24 {
    padding-bottom: calc(var(--spacing) * 24);
  }

  .pb-28 {
    padding-bottom: calc(var(--spacing) * 28);
  }

  .pl-0 {
    padding-left: calc(var(--spacing) * 0);
  }

  .pl-0\.5 {
    padding-left: calc(var(--spacing) * .5);
  }

  .pl-1 {
    padding-left: calc(var(--spacing) * 1);
  }

  .pl-2 {
    padding-left: calc(var(--spacing) * 2);
  }

  .pl-2\.5 {
    padding-left: calc(var(--spacing) * 2.5);
  }

  .pl-3 {
    padding-left: calc(var(--spacing) * 3);
  }

  .pl-4 {
    padding-left: calc(var(--spacing) * 4);
  }

  .pl-5 {
    padding-left: calc(var(--spacing) * 5);
  }

  .pl-6 {
    padding-left: calc(var(--spacing) * 6);
  }

  .pl-7 {
    padding-left: calc(var(--spacing) * 7);
  }

  .pl-8 {
    padding-left: calc(var(--spacing) * 8);
  }

  .pl-9 {
    padding-left: calc(var(--spacing) * 9);
  }

  .pl-10 {
    padding-left: calc(var(--spacing) * 10);
  }

  .pl-\[52px\] {
    padding-left: 52px;
  }

  .text-center {
    text-align: center;
  }

  .text-justify {
    text-align: justify;
  }

  .text-left {
    text-align: left;
  }

  .text-right {
    text-align: right;
  }

  .align-bottom {
    vertical-align: bottom;
  }

  .align-top {
    vertical-align: top;
  }

  .font-heading {
    font-family: var(--font-heading);
  }

  .font-mono {
    font-family: var(--font-mono);
  }

  .font-sans {
    font-family: var(--font-sans);
  }

  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }

  .text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--line-height));
  }

  .text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
  }

  .text-5xl {
    font-size: var(--text-5xl);
    line-height: var(--tw-leading, var(--text-5xl--line-height));
  }

  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }

  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .text-\[0\.6rem\] {
    font-size: .6rem;
  }

  .text-\[0\.7rem\] {
    font-size: .7rem;
  }

  .text-\[0\.8rem\] {
    font-size: .8rem;
  }

  .text-\[0\.9rem\] {
    font-size: .9rem;
  }

  .text-\[0\.55rem\] {
    font-size: .55rem;
  }

  .text-\[0\.65rem\] {
    font-size: .65rem;
  }

  .text-\[0\.75rem\] {
    font-size: .75rem;
  }

  .text-\[0\.78rem\] {
    font-size: .78rem;
  }

  .text-\[0\.82rem\] {
    font-size: .82rem;
  }

  .text-\[0\.85rem\] {
    font-size: .85rem;
  }

  .text-\[0\.95rem\] {
    font-size: .95rem;
  }

  .text-\[1\.1rem\] {
    font-size: 1.1rem;
  }

  .text-\[1\.05rem\] {
    font-size: 1.05rem;
  }

  .text-\[1\.15rem\] {
    font-size: 1.15rem;
  }

  .text-\[1\.75rem\] {
    font-size: 1.75rem;
  }

  .text-\[1\.85rem\] {
    font-size: 1.85rem;
  }

  .text-\[1rem\] {
    font-size: 1rem;
  }

  .text-\[2\.2rem\] {
    font-size: 2.2rem;
  }

  .text-\[2\.5rem\] {
    font-size: 2.5rem;
  }

  .text-\[2\.75rem\] {
    font-size: 2.75rem;
  }

  .text-\[2\.85rem\] {
    font-size: 2.85rem;
  }

  .text-\[2rem\] {
    font-size: 2rem;
  }

  .text-\[3rem\] {
    font-size: 3rem;
  }

  .text-\[5\.5px\] {
    font-size: 5.5px;
  }

  .text-\[5px\] {
    font-size: 5px;
  }

  .text-\[5rem\] {
    font-size: 5rem;
  }

  .text-\[6\.5px\] {
    font-size: 6.5px;
  }

  .text-\[6px\] {
    font-size: 6px;
  }

  .text-\[7px\] {
    font-size: 7px;
  }

  .text-\[8px\] {
    font-size: 8px;
  }

  .text-\[9px\] {
    font-size: 9px;
  }

  .text-\[10px\] {
    font-size: 10px;
  }

  .text-\[11px\] {
    font-size: 11px;
  }

  .text-\[12px\] {
    font-size: 12px;
  }

  .text-\[13px\] {
    font-size: 13px;
  }

  .text-\[14px\] {
    font-size: 14px;
  }

  .text-\[15px\] {
    font-size: 15px;
  }

  .text-\[40px\] {
    font-size: 40px;
  }

  .text-\[52px\] {
    font-size: 52px;
  }

  .leading-5 {
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
  }

  .leading-7 {
    --tw-leading: calc(var(--spacing) * 7);
    line-height: calc(var(--spacing) * 7);
  }

  .leading-\[0\.92\] {
    --tw-leading: .92;
    line-height: .92;
  }

  .leading-\[0\.95\] {
    --tw-leading: .95;
    line-height: .95;
  }

  .leading-\[1\.1\] {
    --tw-leading: 1.1;
    line-height: 1.1;
  }

  .leading-\[1\.05\] {
    --tw-leading: 1.05;
    line-height: 1.05;
  }

  .leading-\[1\.08\] {
    --tw-leading: 1.08;
    line-height: 1.08;
  }

  .leading-\[1\.75\] {
    --tw-leading: 1.75;
    line-height: 1.75;
  }

  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }

  .leading-normal {
    --tw-leading: var(--leading-normal);
    line-height: var(--leading-normal);
  }

  .leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }

  .leading-snug {
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
  }

  .leading-tight {
    --tw-leading: var(--leading-tight);
    line-height: var(--leading-tight);
  }

  .font-black {
    --tw-font-weight: var(--font-weight-black);
    font-weight: var(--font-weight-black);
  }

  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }

  .font-light {
    --tw-font-weight: var(--font-weight-light);
    font-weight: var(--font-weight-light);
  }

  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }

  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .font-thin {
    --tw-font-weight: var(--font-weight-thin);
    font-weight: var(--font-weight-thin);
  }

  .tracking-\[-0\.01em\] {
    --tw-tracking: -.01em;
    letter-spacing: -.01em;
  }

  .tracking-\[-0\.02em\] {
    --tw-tracking: -.02em;
    letter-spacing: -.02em;
  }

  .tracking-\[-0\.03em\] {
    --tw-tracking: -.03em;
    letter-spacing: -.03em;
  }

  .tracking-\[-0\.025em\] {
    --tw-tracking: -.025em;
    letter-spacing: -.025em;
  }

  .tracking-\[0\.1em\] {
    --tw-tracking: .1em;
    letter-spacing: .1em;
  }

  .tracking-\[0\.2em\] {
    --tw-tracking: .2em;
    letter-spacing: .2em;
  }

  .tracking-\[0\.3em\] {
    --tw-tracking: .3em;
    letter-spacing: .3em;
  }

  .tracking-\[0\.08em\] {
    --tw-tracking: .08em;
    letter-spacing: .08em;
  }

  .tracking-\[0\.12em\] {
    --tw-tracking: .12em;
    letter-spacing: .12em;
  }

  .tracking-\[0\.15em\] {
    --tw-tracking: .15em;
    letter-spacing: .15em;
  }

  .tracking-\[0\.25em\] {
    --tw-tracking: .25em;
    letter-spacing: .25em;
  }

  .tracking-normal {
    --tw-tracking: var(--tracking-normal);
    letter-spacing: var(--tracking-normal);
  }

  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }

  .tracking-wide {
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
  }

  .tracking-wider {
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
  }

  .tracking-widest {
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
  }

  .text-nowrap {
    text-wrap: nowrap;
  }

  .break-all {
    word-break: break-all;
  }

  .whitespace-break-spaces {
    white-space: break-spaces;
  }

  .whitespace-normal {
    white-space: normal;
  }

  .whitespace-nowrap {
    white-space: nowrap;
  }

  .whitespace-pre {
    white-space: pre;
  }

  .whitespace-pre-line {
    white-space: pre-line;
  }

  .whitespace-pre-wrap {
    white-space: pre-wrap;
  }

  .text-accent {
    color: var(--color-accent);
  }

  .text-accent-light {
    color: var(--color-accent-light);
  }

  .text-accent\/15 {
    color: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/15 {
      color: color-mix(in oklab, var(--color-accent) 15%, transparent);
    }
  }

  .text-accent\/20 {
    color: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/20 {
      color: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .text-accent\/25 {
    color: #f8a05440;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/25 {
      color: color-mix(in oklab, var(--color-accent) 25%, transparent);
    }
  }

  .text-accent\/28 {
    color: #f8a05447;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/28 {
      color: color-mix(in oklab, var(--color-accent) 28%, transparent);
    }
  }

  .text-accent\/30 {
    color: #f8a0544d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/30 {
      color: color-mix(in oklab, var(--color-accent) 30%, transparent);
    }
  }

  .text-accent\/35 {
    color: #f8a05459;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/35 {
      color: color-mix(in oklab, var(--color-accent) 35%, transparent);
    }
  }

  .text-accent\/40 {
    color: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/40 {
      color: color-mix(in oklab, var(--color-accent) 40%, transparent);
    }
  }

  .text-accent\/45 {
    color: #f8a05473;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/45 {
      color: color-mix(in oklab, var(--color-accent) 45%, transparent);
    }
  }

  .text-accent\/50 {
    color: #f8a05480;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/50 {
      color: color-mix(in oklab, var(--color-accent) 50%, transparent);
    }
  }

  .text-accent\/55 {
    color: #f8a0548c;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/55 {
      color: color-mix(in oklab, var(--color-accent) 55%, transparent);
    }
  }

  .text-accent\/60 {
    color: #f8a05499;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/60 {
      color: color-mix(in oklab, var(--color-accent) 60%, transparent);
    }
  }

  .text-accent\/70 {
    color: #f8a054b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/70 {
      color: color-mix(in oklab, var(--color-accent) 70%, transparent);
    }
  }

  .text-accent\/80 {
    color: #f8a054cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/80 {
      color: color-mix(in oklab, var(--color-accent) 80%, transparent);
    }
  }

  .text-accent\/90 {
    color: #f8a054e6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-accent\/90 {
      color: color-mix(in oklab, var(--color-accent) 90%, transparent);
    }
  }

  .text-amber-400 {
    color: var(--color-amber-400);
  }

  .text-amber-400\/40 {
    color: #fcbb0066;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-amber-400\/40 {
      color: color-mix(in oklab, var(--color-amber-400) 40%, transparent);
    }
  }

  .text-amber-400\/50 {
    color: #fcbb0080;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-amber-400\/50 {
      color: color-mix(in oklab, var(--color-amber-400) 50%, transparent);
    }
  }

  .text-amber-400\/60 {
    color: #fcbb0099;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-amber-400\/60 {
      color: color-mix(in oklab, var(--color-amber-400) 60%, transparent);
    }
  }

  .text-amber-500\/70 {
    color: #f99c00b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-amber-500\/70 {
      color: color-mix(in oklab, var(--color-amber-500) 70%, transparent);
    }
  }

  .text-amber-500\/80 {
    color: #f99c00cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-amber-500\/80 {
      color: color-mix(in oklab, var(--color-amber-500) 80%, transparent);
    }
  }

  .text-black {
    color: var(--color-black);
  }

  .text-blue-300 {
    color: var(--color-blue-300);
  }

  .text-blue-300\/60 {
    color: #90c5ff99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-blue-300\/60 {
      color: color-mix(in oklab, var(--color-blue-300) 60%, transparent);
    }
  }

  .text-blue-400 {
    color: var(--color-blue-400);
  }

  .text-blue-400\/60 {
    color: #54a2ff99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-blue-400\/60 {
      color: color-mix(in oklab, var(--color-blue-400) 60%, transparent);
    }
  }

  .text-blue-500 {
    color: var(--color-blue-500);
  }

  .text-blue-500\/60 {
    color: #3080ff99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-blue-500\/60 {
      color: color-mix(in oklab, var(--color-blue-500) 60%, transparent);
    }
  }

  .text-blue-600 {
    color: var(--color-blue-600);
  }

  .text-blue-700 {
    color: var(--color-blue-700);
  }

  .text-blue-800 {
    color: var(--color-blue-800);
  }

  .text-body {
    color: var(--color-body);
  }

  .text-body\/30 {
    color: #52524e4d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/30 {
      color: color-mix(in oklab, var(--color-body) 30%, transparent);
    }
  }

  .text-body\/35 {
    color: #52524e59;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/35 {
      color: color-mix(in oklab, var(--color-body) 35%, transparent);
    }
  }

  .text-body\/40 {
    color: #52524e66;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/40 {
      color: color-mix(in oklab, var(--color-body) 40%, transparent);
    }
  }

  .text-body\/50 {
    color: #52524e80;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/50 {
      color: color-mix(in oklab, var(--color-body) 50%, transparent);
    }
  }

  .text-body\/55 {
    color: #52524e8c;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/55 {
      color: color-mix(in oklab, var(--color-body) 55%, transparent);
    }
  }

  .text-body\/60 {
    color: #52524e99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/60 {
      color: color-mix(in oklab, var(--color-body) 60%, transparent);
    }
  }

  .text-body\/70 {
    color: #52524eb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/70 {
      color: color-mix(in oklab, var(--color-body) 70%, transparent);
    }
  }

  .text-body\/80 {
    color: #52524ecc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-body\/80 {
      color: color-mix(in oklab, var(--color-body) 80%, transparent);
    }
  }

  .text-border\/60 {
    color: #e8e6e199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-border\/60 {
      color: color-mix(in oklab, var(--color-border) 60%, transparent);
    }
  }

  .text-emerald-300 {
    color: var(--color-emerald-300);
  }

  .text-emerald-400\/35 {
    color: #00d29459;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/35 {
      color: color-mix(in oklab, var(--color-emerald-400) 35%, transparent);
    }
  }

  .text-emerald-400\/40 {
    color: #00d29466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/40 {
      color: color-mix(in oklab, var(--color-emerald-400) 40%, transparent);
    }
  }

  .text-emerald-400\/45 {
    color: #00d29473;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/45 {
      color: color-mix(in oklab, var(--color-emerald-400) 45%, transparent);
    }
  }

  .text-emerald-400\/50 {
    color: #00d29480;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/50 {
      color: color-mix(in oklab, var(--color-emerald-400) 50%, transparent);
    }
  }

  .text-emerald-400\/55 {
    color: #00d2948c;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/55 {
      color: color-mix(in oklab, var(--color-emerald-400) 55%, transparent);
    }
  }

  .text-emerald-400\/60 {
    color: #00d29499;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/60 {
      color: color-mix(in oklab, var(--color-emerald-400) 60%, transparent);
    }
  }

  .text-emerald-400\/70 {
    color: #00d294b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/70 {
      color: color-mix(in oklab, var(--color-emerald-400) 70%, transparent);
    }
  }

  .text-emerald-500\/60 {
    color: #00bb7f99;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-500\/60 {
      color: color-mix(in oklab, var(--color-emerald-500) 60%, transparent);
    }
  }

  .text-emerald-500\/70 {
    color: #00bb7fb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-500\/70 {
      color: color-mix(in oklab, var(--color-emerald-500) 70%, transparent);
    }
  }

  .text-emerald-600 {
    color: var(--color-emerald-600);
  }

  .text-gray-200 {
    color: var(--color-gray-200);
  }

  .text-gray-300 {
    color: var(--color-gray-300);
  }

  .text-gray-400 {
    color: var(--color-gray-400);
  }

  .text-gray-500 {
    color: var(--color-gray-500);
  }

  .text-gray-600 {
    color: var(--color-gray-600);
  }

  .text-gray-700 {
    color: var(--color-gray-700);
  }

  .text-gray-800 {
    color: var(--color-gray-800);
  }

  .text-gray-900 {
    color: var(--color-gray-900);
  }

  .text-green-400\/40 {
    color: #05df7266;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-green-400\/40 {
      color: color-mix(in oklab, var(--color-green-400) 40%, transparent);
    }
  }

  .text-green-500 {
    color: var(--color-green-500);
  }

  .text-green-500\/60 {
    color: #00c75899;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-green-500\/60 {
      color: color-mix(in oklab, var(--color-green-500) 60%, transparent);
    }
  }

  .text-green-500\/80 {
    color: #00c758cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-green-500\/80 {
      color: color-mix(in oklab, var(--color-green-500) 80%, transparent);
    }
  }

  .text-green-600 {
    color: var(--color-green-600);
  }

  .text-green-600\/50 {
    color: #00a54480;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-green-600\/50 {
      color: color-mix(in oklab, var(--color-green-600) 50%, transparent);
    }
  }

  .text-green-600\/70 {
    color: #00a544b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-green-600\/70 {
      color: color-mix(in oklab, var(--color-green-600) 70%, transparent);
    }
  }

  .text-green-700 {
    color: var(--color-green-700);
  }

  .text-green-800 {
    color: var(--color-green-800);
  }

  .text-heading {
    color: var(--color-heading);
  }

  .text-heading\/20 {
    color: #0e1e3133;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/20 {
      color: color-mix(in oklab, var(--color-heading) 20%, transparent);
    }
  }

  .text-heading\/25 {
    color: #0e1e3140;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/25 {
      color: color-mix(in oklab, var(--color-heading) 25%, transparent);
    }
  }

  .text-heading\/30 {
    color: #0e1e314d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/30 {
      color: color-mix(in oklab, var(--color-heading) 30%, transparent);
    }
  }

  .text-heading\/35 {
    color: #0e1e3159;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/35 {
      color: color-mix(in oklab, var(--color-heading) 35%, transparent);
    }
  }

  .text-heading\/40 {
    color: #0e1e3166;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/40 {
      color: color-mix(in oklab, var(--color-heading) 40%, transparent);
    }
  }

  .text-heading\/45 {
    color: #0e1e3173;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/45 {
      color: color-mix(in oklab, var(--color-heading) 45%, transparent);
    }
  }

  .text-heading\/50 {
    color: #0e1e3180;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/50 {
      color: color-mix(in oklab, var(--color-heading) 50%, transparent);
    }
  }

  .text-heading\/55 {
    color: #0e1e318c;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/55 {
      color: color-mix(in oklab, var(--color-heading) 55%, transparent);
    }
  }

  .text-heading\/60 {
    color: #0e1e3199;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/60 {
      color: color-mix(in oklab, var(--color-heading) 60%, transparent);
    }
  }

  .text-heading\/70 {
    color: #0e1e31b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/70 {
      color: color-mix(in oklab, var(--color-heading) 70%, transparent);
    }
  }

  .text-heading\/75 {
    color: #0e1e31bf;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/75 {
      color: color-mix(in oklab, var(--color-heading) 75%, transparent);
    }
  }

  .text-heading\/80 {
    color: #0e1e31cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/80 {
      color: color-mix(in oklab, var(--color-heading) 80%, transparent);
    }
  }

  .text-heading\/\[0\.03\] {
    color: #0e1e3108;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-heading\/\[0\.03\] {
      color: color-mix(in oklab, var(--color-heading) 3%, transparent);
    }
  }

  .text-muted {
    color: var(--color-muted);
  }

  .text-muted\/20 {
    color: #9a989033;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/20 {
      color: color-mix(in oklab, var(--color-muted) 20%, transparent);
    }
  }

  .text-muted\/25 {
    color: #9a989040;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/25 {
      color: color-mix(in oklab, var(--color-muted) 25%, transparent);
    }
  }

  .text-muted\/30 {
    color: #9a98904d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/30 {
      color: color-mix(in oklab, var(--color-muted) 30%, transparent);
    }
  }

  .text-muted\/35 {
    color: #9a989059;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/35 {
      color: color-mix(in oklab, var(--color-muted) 35%, transparent);
    }
  }

  .text-muted\/40 {
    color: #9a989066;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/40 {
      color: color-mix(in oklab, var(--color-muted) 40%, transparent);
    }
  }

  .text-muted\/45 {
    color: #9a989073;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/45 {
      color: color-mix(in oklab, var(--color-muted) 45%, transparent);
    }
  }

  .text-muted\/50 {
    color: #9a989080;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/50 {
      color: color-mix(in oklab, var(--color-muted) 50%, transparent);
    }
  }

  .text-muted\/60 {
    color: #9a989099;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/60 {
      color: color-mix(in oklab, var(--color-muted) 60%, transparent);
    }
  }

  .text-muted\/70 {
    color: #9a9890b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/70 {
      color: color-mix(in oklab, var(--color-muted) 70%, transparent);
    }
  }

  .text-muted\/80 {
    color: #9a9890cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-muted\/80 {
      color: color-mix(in oklab, var(--color-muted) 80%, transparent);
    }
  }

  .text-orange-500 {
    color: var(--color-orange-500);
  }

  .text-orange-500\/70 {
    color: #fe6e00b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-orange-500\/70 {
      color: color-mix(in oklab, var(--color-orange-500) 70%, transparent);
    }
  }

  .text-orange-600 {
    color: var(--color-orange-600);
  }

  .text-orange-700 {
    color: var(--color-orange-700);
  }

  .text-orange-800 {
    color: var(--color-orange-800);
  }

  .text-primary {
    color: var(--color-primary);
  }

  .text-primary-dark {
    color: var(--color-primary-dark);
  }

  .text-primary-darker {
    color: var(--color-primary-darker);
  }

  .text-primary-light {
    color: var(--color-primary-light);
  }

  .text-primary\/40 {
    color: #0e1e3166;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-primary\/40 {
      color: color-mix(in oklab, var(--color-primary) 40%, transparent);
    }
  }

  .text-purple-300 {
    color: var(--color-purple-300);
  }

  .text-red-300\/50 {
    color: #ffa3a380;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-300\/50 {
      color: color-mix(in oklab, var(--color-red-300) 50%, transparent);
    }
  }

  .text-red-400 {
    color: var(--color-red-400);
  }

  .text-red-400\/25 {
    color: #ff656840;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/25 {
      color: color-mix(in oklab, var(--color-red-400) 25%, transparent);
    }
  }

  .text-red-400\/40 {
    color: #ff656866;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/40 {
      color: color-mix(in oklab, var(--color-red-400) 40%, transparent);
    }
  }

  .text-red-400\/45 {
    color: #ff656873;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/45 {
      color: color-mix(in oklab, var(--color-red-400) 45%, transparent);
    }
  }

  .text-red-400\/50 {
    color: #ff656880;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/50 {
      color: color-mix(in oklab, var(--color-red-400) 50%, transparent);
    }
  }

  .text-red-400\/60 {
    color: #ff656899;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/60 {
      color: color-mix(in oklab, var(--color-red-400) 60%, transparent);
    }
  }

  .text-red-400\/70 {
    color: #ff6568b3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/70 {
      color: color-mix(in oklab, var(--color-red-400) 70%, transparent);
    }
  }

  .text-red-400\/80 {
    color: #ff6568cc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/80 {
      color: color-mix(in oklab, var(--color-red-400) 80%, transparent);
    }
  }

  .text-red-500 {
    color: var(--color-red-500);
  }

  .text-sky-500\/70 {
    color: #00a5efb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-sky-500\/70 {
      color: color-mix(in oklab, var(--color-sky-500) 70%, transparent);
    }
  }

  .text-slate-300\/50 {
    color: #cad5e280;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-slate-300\/50 {
      color: color-mix(in oklab, var(--color-slate-300) 50%, transparent);
    }
  }

  .text-violet-500\/70 {
    color: #8d54ffb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-violet-500\/70 {
      color: color-mix(in oklab, var(--color-violet-500) 70%, transparent);
    }
  }

  .text-white {
    color: var(--color-white);
  }

  .text-white\/10 {
    color: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/10 {
      color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .text-white\/12 {
    color: #ffffff1f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/12 {
      color: color-mix(in oklab, var(--color-white) 12%, transparent);
    }
  }

  .text-white\/14 {
    color: #ffffff24;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/14 {
      color: color-mix(in oklab, var(--color-white) 14%, transparent);
    }
  }

  .text-white\/15 {
    color: #ffffff26;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/15 {
      color: color-mix(in oklab, var(--color-white) 15%, transparent);
    }
  }

  .text-white\/18 {
    color: #ffffff2e;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/18 {
      color: color-mix(in oklab, var(--color-white) 18%, transparent);
    }
  }

  .text-white\/20 {
    color: #fff3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/20 {
      color: color-mix(in oklab, var(--color-white) 20%, transparent);
    }
  }

  .text-white\/22 {
    color: #ffffff38;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/22 {
      color: color-mix(in oklab, var(--color-white) 22%, transparent);
    }
  }

  .text-white\/25 {
    color: #ffffff40;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/25 {
      color: color-mix(in oklab, var(--color-white) 25%, transparent);
    }
  }

  .text-white\/28 {
    color: #ffffff47;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/28 {
      color: color-mix(in oklab, var(--color-white) 28%, transparent);
    }
  }

  .text-white\/30 {
    color: #ffffff4d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/30 {
      color: color-mix(in oklab, var(--color-white) 30%, transparent);
    }
  }

  .text-white\/32 {
    color: #ffffff52;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/32 {
      color: color-mix(in oklab, var(--color-white) 32%, transparent);
    }
  }

  .text-white\/35 {
    color: #ffffff59;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/35 {
      color: color-mix(in oklab, var(--color-white) 35%, transparent);
    }
  }

  .text-white\/40 {
    color: #fff6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/40 {
      color: color-mix(in oklab, var(--color-white) 40%, transparent);
    }
  }

  .text-white\/45 {
    color: #ffffff73;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/45 {
      color: color-mix(in oklab, var(--color-white) 45%, transparent);
    }
  }

  .text-white\/50 {
    color: #ffffff80;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/50 {
      color: color-mix(in oklab, var(--color-white) 50%, transparent);
    }
  }

  .text-white\/55 {
    color: #ffffff8c;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/55 {
      color: color-mix(in oklab, var(--color-white) 55%, transparent);
    }
  }

  .text-white\/60 {
    color: #fff9;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/60 {
      color: color-mix(in oklab, var(--color-white) 60%, transparent);
    }
  }

  .text-white\/65 {
    color: #ffffffa6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/65 {
      color: color-mix(in oklab, var(--color-white) 65%, transparent);
    }
  }

  .text-white\/70 {
    color: #ffffffb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/70 {
      color: color-mix(in oklab, var(--color-white) 70%, transparent);
    }
  }

  .text-white\/75 {
    color: #ffffffbf;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/75 {
      color: color-mix(in oklab, var(--color-white) 75%, transparent);
    }
  }

  .text-white\/80 {
    color: #fffc;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/80 {
      color: color-mix(in oklab, var(--color-white) 80%, transparent);
    }
  }

  .text-white\/90 {
    color: #ffffffe6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/90 {
      color: color-mix(in oklab, var(--color-white) 90%, transparent);
    }
  }

  .text-white\/\[0\.02\] {
    color: #ffffff05;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/\[0\.02\] {
      color: color-mix(in oklab, var(--color-white) 2%, transparent);
    }
  }

  .text-white\/\[0\.03\] {
    color: #ffffff08;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/\[0\.03\] {
      color: color-mix(in oklab, var(--color-white) 3%, transparent);
    }
  }

  .text-white\/\[0\.04\] {
    color: #ffffff0a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/\[0\.04\] {
      color: color-mix(in oklab, var(--color-white) 4%, transparent);
    }
  }

  .text-white\/\[0\.06\] {
    color: #ffffff0f;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/\[0\.06\] {
      color: color-mix(in oklab, var(--color-white) 6%, transparent);
    }
  }

  .text-white\/\[0\.015\] {
    color: #ffffff04;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/\[0\.015\] {
      color: color-mix(in oklab, var(--color-white) 1.5%, transparent);
    }
  }

  .text-white\/\[0\.025\] {
    color: #ffffff06;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/\[0\.025\] {
      color: color-mix(in oklab, var(--color-white) 2.5%, transparent);
    }
  }

  .text-white\/\[0\.035\] {
    color: #ffffff09;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-white\/\[0\.035\] {
      color: color-mix(in oklab, var(--color-white) 3.5%, transparent);
    }
  }

  .capitalize {
    text-transform: capitalize;
  }

  .lowercase {
    text-transform: lowercase;
  }

  .normal-case {
    text-transform: none;
  }

  .uppercase {
    text-transform: uppercase;
  }

  .italic {
    font-style: italic;
  }

  .not-italic {
    font-style: normal;
  }

  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,  ) var(--tw-slashed-zero,  ) var(--tw-numeric-figure,  ) var(--tw-numeric-spacing,  ) var(--tw-numeric-fraction,  );
  }

  .line-through {
    text-decoration-line: line-through;
  }

  .no-underline {
    text-decoration-line: none;
  }

  .underline {
    text-decoration-line: underline;
  }

  .decoration-muted\/20 {
    text-decoration-color: #9a989033;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .decoration-muted\/20 {
      text-decoration-color: color-mix(in oklab, var(--color-muted) 20%, transparent);
    }
  }

  .decoration-red-400\/30 {
    text-decoration-color: #ff65684d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .decoration-red-400\/30 {
      text-decoration-color: color-mix(in oklab, var(--color-red-400) 30%, transparent);
    }
  }

  .decoration-white\/10 {
    text-decoration-color: #ffffff1a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .decoration-white\/10 {
      text-decoration-color: color-mix(in oklab, var(--color-white) 10%, transparent);
    }
  }

  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  .opacity-0 {
    opacity: 0;
  }

  .opacity-15 {
    opacity: .15;
  }

  .opacity-25 {
    opacity: .25;
  }

  .opacity-50 {
    opacity: .5;
  }

  .opacity-60 {
    opacity: .6;
  }

  .opacity-70 {
    opacity: .7;
  }

  .opacity-75 {
    opacity: .75;
  }

  .opacity-90 {
    opacity: .9;
  }

  .opacity-100 {
    opacity: 1;
  }

  .opacity-\[0\.018\] {
    opacity: .018;
  }

  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-2xl {
    --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, #00000040);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_0_6px_rgba\(74\,222\,128\,0\.4\)\] {
    --tw-shadow: 0 0 6px var(--tw-shadow-color, #4ade8066);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_0_16px_rgba\(248\,160\,84\,0\.08\)\] {
    --tw-shadow: 0 0 16px var(--tw-shadow-color, #f8a05414);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_4px_24px_rgba\(14\,30\,49\,0\.04\)\] {
    --tw-shadow: 0 4px 24px var(--tw-shadow-color, #0e1e310a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_8px_40px_rgba\(0\,0\,0\,0\.15\)\] {
    --tw-shadow: 0 8px 40px var(--tw-shadow-color, #00000026);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_16px_48px_rgba\(0\,0\,0\,0\.4\)\] {
    --tw-shadow: 0 16px 48px var(--tw-shadow-color, #0006);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_24px_80px_rgba\(0\,0\,0\,0\.3\)\] {
    --tw-shadow: 0 24px 80px var(--tw-shadow-color, #0000004d);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-md {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-sm {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-xl {
    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .ring, .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset,  ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .ring-2 {
    --tw-ring-shadow: var(--tw-ring-inset,  ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-accent\/15 {
    --tw-shadow-color: #f8a05426;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-accent\/15 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-accent) 15%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-accent\/20 {
    --tw-shadow-color: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-accent\/20 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-accent) 20%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-accent\/25 {
    --tw-shadow-color: #f8a05440;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-accent\/25 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-accent) 25%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-accent\/40 {
    --tw-shadow-color: #f8a05466;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-accent\/40 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-accent) 40%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-accent\/\[0\.04\] {
    --tw-shadow-color: #f8a0540a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-accent\/\[0\.04\] {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-accent) 4%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-black\/20 {
    --tw-shadow-color: #0003;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-black\/20 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 20%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-black\/30 {
    --tw-shadow-color: #0000004d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-black\/30 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 30%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-black\/40 {
    --tw-shadow-color: #0006;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-black\/40 {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 40%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-black\/\[0\.02\] {
    --tw-shadow-color: #00000005;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-black\/\[0\.02\] {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 2%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-black\/\[0\.04\] {
    --tw-shadow-color: #0000000a;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-black\/\[0\.04\] {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 4%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .shadow-black\/\[0\.08\] {
    --tw-shadow-color: #00000014;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-black\/\[0\.08\] {
      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 8%, transparent) var(--tw-shadow-alpha), transparent);
    }
  }

  .ring-black\/\[0\.03\] {
    --tw-ring-color: #00000008;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .ring-black\/\[0\.03\] {
      --tw-ring-color: color-mix(in oklab, var(--color-black) 3%, transparent);
    }
  }

  .ring-gray-300 {
    --tw-ring-color: var(--color-gray-300);
  }

  .ring-white {
    --tw-ring-color: var(--color-white);
  }

  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }

  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-2xl {
    --tw-blur: blur(var(--blur-2xl));
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-\[60px\] {
    --tw-blur: blur(60px);
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-\[80px\] {
    --tw-blur: blur(80px);
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-\[100px\] {
    --tw-blur: blur(100px);
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-\[120px\] {
    --tw-blur: blur(120px);
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-\[128px\] {
    --tw-blur: blur(128px);
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-\[140px\] {
    --tw-blur: blur(140px);
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-md {
    --tw-blur: blur(var(--blur-md));
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .blur-xl {
    --tw-blur: blur(var(--blur-xl));
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .\!filter {
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  ) !important;
  }

  .filter {
    filter: var(--tw-blur,  ) var(--tw-brightness,  ) var(--tw-contrast,  ) var(--tw-grayscale,  ) var(--tw-hue-rotate,  ) var(--tw-invert,  ) var(--tw-saturate,  ) var(--tw-sepia,  ) var(--tw-drop-shadow,  );
  }

  .backdrop-blur {
    --tw-backdrop-blur: blur(8px);
    -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,  );
  }

  .backdrop-blur-md {
    --tw-backdrop-blur: blur(var(--blur-md));
    -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,  );
  }

  .backdrop-blur-sm {
    --tw-backdrop-blur: blur(var(--blur-sm));
    -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,  );
  }

  .backdrop-blur-xl {
    --tw-backdrop-blur: blur(var(--blur-xl));
    -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,  );
  }

  .backdrop-filter {
    -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, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-shadow {
    transition-property: box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .duration-50 {
    --tw-duration: 50ms;
    transition-duration: 50ms;
  }

  .duration-75 {
    --tw-duration: 75ms;
    transition-duration: 75ms;
  }

  .duration-100 {
    --tw-duration: .1s;
    transition-duration: .1s;
  }

  .duration-150 {
    --tw-duration: .15s;
    transition-duration: .15s;
  }

  .duration-200 {
    --tw-duration: .2s;
    transition-duration: .2s;
  }

  .duration-300 {
    --tw-duration: .3s;
    transition-duration: .3s;
  }

  .duration-400 {
    --tw-duration: .4s;
    transition-duration: .4s;
  }

  .duration-500 {
    --tw-duration: .5s;
    transition-duration: .5s;
  }

  .duration-700 {
    --tw-duration: .7s;
    transition-duration: .7s;
  }

  .ease-in {
    --tw-ease: var(--ease-in);
    transition-timing-function: var(--ease-in);
  }

  .ease-in-out {
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }

  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }

  .select-none {
    -webkit-user-select: none;
    -moz-user-select: none;
         user-select: none;
  }

  .\[type\:id\] {
    type: id;
  }

  .\[workflows\:\'\.\$this-\>workflow-\>id\.\'\] {
    workflows: ".$this->workflow->id.";
  }

  @media (hover: hover) {
    .group-hover\:translate-x-0\.5:is(:where(.group):hover *) {
      --tw-translate-x: calc(var(--spacing) * .5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }

    .group-hover\:border-accent\/20:is(:where(.group):hover *) {
      border-color: #f8a05433;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:border-accent\/20:is(:where(.group):hover *) {
        border-color: color-mix(in oklab, var(--color-accent) 20%, transparent);
      }
    }

    .group-hover\:border-accent\/30:is(:where(.group):hover *) {
      border-color: #f8a0544d;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:border-accent\/30:is(:where(.group):hover *) {
        border-color: color-mix(in oklab, var(--color-accent) 30%, transparent);
      }
    }

    .group-hover\:border-white\/\[0\.12\]:is(:where(.group):hover *) {
      border-color: #ffffff1f;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:border-white\/\[0\.12\]:is(:where(.group):hover *) {
        border-color: color-mix(in oklab, var(--color-white) 12%, transparent);
      }
    }

    .group-hover\:border-white\/\[0\.15\]:is(:where(.group):hover *) {
      border-color: #ffffff26;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:border-white\/\[0\.15\]:is(:where(.group):hover *) {
        border-color: color-mix(in oklab, var(--color-white) 15%, transparent);
      }
    }

    .group-hover\:bg-accent\/5:is(:where(.group):hover *) {
      background-color: #f8a0540d;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/5:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 5%, transparent);
      }
    }

    .group-hover\:bg-accent\/10:is(:where(.group):hover *) {
      background-color: #f8a0541a;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/10:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
      }
    }

    .group-hover\:bg-accent\/14:is(:where(.group):hover *) {
      background-color: #f8a05424;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/14:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 14%, transparent);
      }
    }

    .group-hover\:bg-accent\/15:is(:where(.group):hover *) {
      background-color: #f8a05426;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/15:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 15%, transparent);
      }
    }

    .group-hover\:bg-accent\/25:is(:where(.group):hover *) {
      background-color: #f8a05440;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/25:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 25%, transparent);
      }
    }

    .group-hover\:bg-accent\/30:is(:where(.group):hover *) {
      background-color: #f8a0544d;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/30:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 30%, transparent);
      }
    }

    .group-hover\:bg-accent\/35:is(:where(.group):hover *) {
      background-color: #f8a05459;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/35:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 35%, transparent);
      }
    }

    .group-hover\:bg-accent\/50:is(:where(.group):hover *) {
      background-color: #f8a05480;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/50:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
      }
    }

    .group-hover\:bg-accent\/\[0\.1\]:is(:where(.group):hover *) {
      background-color: #f8a0541a;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/\[0\.1\]:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
      }
    }

    .group-hover\:bg-accent\/\[0\.06\]:is(:where(.group):hover *) {
      background-color: #f8a0540f;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/\[0\.06\]:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 6%, transparent);
      }
    }

    .group-hover\:bg-accent\/\[0\.12\]:is(:where(.group):hover *) {
      background-color: #f8a0541f;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/\[0\.12\]:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 12%, transparent);
      }
    }

    .group-hover\:bg-accent\/\[0\.14\]:is(:where(.group):hover *) {
      background-color: #f8a05424;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-accent\/\[0\.14\]:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 14.0%, transparent);
      }
    }

    .group-hover\:bg-heading\/15:is(:where(.group):hover *) {
      background-color: #0e1e3126;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:bg-heading\/15:is(:where(.group):hover *) {
        background-color: color-mix(in oklab, var(--color-heading) 15%, transparent);
      }
    }

    .group-hover\:text-accent:is(:where(.group):hover *) {
      color: var(--color-accent);
    }

    .group-hover\:text-primary:is(:where(.group):hover *) {
      color: var(--color-primary);
    }

    .group-hover\:text-red-400\/60:is(:where(.group):hover *) {
      color: #ff656899;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\:text-red-400\/60:is(:where(.group):hover *) {
        color: color-mix(in oklab, var(--color-red-400) 60%, transparent);
      }
    }

    .group-hover\:opacity-100:is(:where(.group):hover *) {
      opacity: 1;
    }

    .group-hover\/hub\:border-accent\/25:is(:where(.group\/hub):hover *) {
      border-color: #f8a05440;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\/hub\:border-accent\/25:is(:where(.group\/hub):hover *) {
        border-color: color-mix(in oklab, var(--color-accent) 25%, transparent);
      }
    }

    .group-hover\/hub\:bg-accent\/15:is(:where(.group\/hub):hover *) {
      background-color: #f8a05426;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .group-hover\/hub\:bg-accent\/15:is(:where(.group\/hub):hover *) {
        background-color: color-mix(in oklab, var(--color-accent) 15%, transparent);
      }
    }

    .group-hover\/hub\:text-heading:is(:where(.group\/hub):hover *) {
      color: var(--color-heading);
    }

    .group-hover\/hub\:shadow-md:is(:where(.group\/hub):hover *) {
      --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }

  .placeholder\:text-white\/20::-moz-placeholder {
    color: #fff3;
  }

  .placeholder\:text-white\/20::placeholder {
    color: #fff3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .placeholder\:text-white\/20::-moz-placeholder {
      color: color-mix(in oklab, var(--color-white) 20%, transparent);
    }
    .placeholder\:text-white\/20::placeholder {
      color: color-mix(in oklab, var(--color-white) 20%, transparent);
    }
  }

  .first\:pt-0:first-child {
    padding-top: calc(var(--spacing) * 0);
  }

  @media (hover: hover) {
    .hover\:-translate-y-0\.5:hover {
      --tw-translate-y: calc(var(--spacing) * -.5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }

    .hover\:border-accent:hover {
      border-color: var(--color-accent);
    }

    .hover\:border-accent\/15:hover {
      border-color: #f8a05426;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-accent\/15:hover {
        border-color: color-mix(in oklab, var(--color-accent) 15%, transparent);
      }
    }

    .hover\:border-accent\/20:hover {
      border-color: #f8a05433;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-accent\/20:hover {
        border-color: color-mix(in oklab, var(--color-accent) 20%, transparent);
      }
    }

    .hover\:border-accent\/25:hover {
      border-color: #f8a05440;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-accent\/25:hover {
        border-color: color-mix(in oklab, var(--color-accent) 25%, transparent);
      }
    }

    .hover\:border-accent\/30:hover {
      border-color: #f8a0544d;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-accent\/30:hover {
        border-color: color-mix(in oklab, var(--color-accent) 30%, transparent);
      }
    }

    .hover\:border-accent\/60:hover {
      border-color: #f8a05499;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-accent\/60:hover {
        border-color: color-mix(in oklab, var(--color-accent) 60%, transparent);
      }
    }

    .hover\:border-border:hover {
      border-color: var(--color-border);
    }

    .hover\:border-border-dark\/30:hover {
      border-color: #374a681c;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-border-dark\/30:hover {
        border-color: color-mix(in oklab, var(--color-border-dark) 30%, transparent);
      }
    }

    .hover\:border-heading\/15:hover {
      border-color: #0e1e3126;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-heading\/15:hover {
        border-color: color-mix(in oklab, var(--color-heading) 15%, transparent);
      }
    }

    .hover\:border-red-200\/50:hover {
      border-color: #ffcaca80;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-red-200\/50:hover {
        border-color: color-mix(in oklab, var(--color-red-200) 50%, transparent);
      }
    }

    .hover\:border-white\/25:hover {
      border-color: #ffffff40;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/25:hover {
        border-color: color-mix(in oklab, var(--color-white) 25%, transparent);
      }
    }

    .hover\:border-white\/30:hover {
      border-color: #ffffff4d;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/30:hover {
        border-color: color-mix(in oklab, var(--color-white) 30%, transparent);
      }
    }

    .hover\:border-white\/40:hover {
      border-color: #fff6;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/40:hover {
        border-color: color-mix(in oklab, var(--color-white) 40%, transparent);
      }
    }

    .hover\:border-white\/60:hover {
      border-color: #fff9;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/60:hover {
        border-color: color-mix(in oklab, var(--color-white) 60%, transparent);
      }
    }

    .hover\:border-white\/\[0\.1\]:hover {
      border-color: #ffffff1a;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/\[0\.1\]:hover {
        border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
      }
    }

    .hover\:border-white\/\[0\.10\]:hover {
      border-color: #ffffff1a;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/\[0\.10\]:hover {
        border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
      }
    }

    .hover\:border-white\/\[0\.12\]:hover {
      border-color: #ffffff1f;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/\[0\.12\]:hover {
        border-color: color-mix(in oklab, var(--color-white) 12%, transparent);
      }
    }

    .hover\:border-white\/\[0\.15\]:hover {
      border-color: #ffffff26;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-white\/\[0\.15\]:hover {
        border-color: color-mix(in oklab, var(--color-white) 15%, transparent);
      }
    }

    .hover\:border-l-accent\/50:hover {
      border-left-color: #f8a05480;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:border-l-accent\/50:hover {
        border-left-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
      }
    }

    .hover\:bg-accent-hover:hover {
      background-color: var(--color-accent-hover);
    }

    .hover\:bg-accent\/\[0\.03\]:hover {
      background-color: #f8a05408;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-accent\/\[0\.03\]:hover {
        background-color: color-mix(in oklab, var(--color-accent) 3%, transparent);
      }
    }

    .hover\:bg-primary:hover {
      background-color: var(--color-primary);
    }

    .hover\:bg-primary-dark:hover {
      background-color: var(--color-primary-dark);
    }

    .hover\:bg-primary-darker:hover {
      background-color: var(--color-primary-darker);
    }

    .hover\:bg-primary-light:hover {
      background-color: var(--color-primary-light);
    }

    .hover\:bg-surface-alt\/20:hover {
      background-color: #f5f4f133;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-surface-alt\/20:hover {
        background-color: color-mix(in oklab, var(--color-surface-alt) 20%, transparent);
      }
    }

    .hover\:bg-surface-alt\/40:hover {
      background-color: #f5f4f166;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-surface-alt\/40:hover {
        background-color: color-mix(in oklab, var(--color-surface-alt) 40%, transparent);
      }
    }

    .hover\:bg-surface-alt\/50:hover {
      background-color: #f5f4f180;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-surface-alt\/50:hover {
        background-color: color-mix(in oklab, var(--color-surface-alt) 50%, transparent);
      }
    }

    .hover\:bg-white:hover {
      background-color: var(--color-white);
    }

    .hover\:bg-white\/\[0\.02\]:hover {
      background-color: #ffffff05;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/\[0\.02\]:hover {
        background-color: color-mix(in oklab, var(--color-white) 2%, transparent);
      }
    }

    .hover\:bg-white\/\[0\.04\]:hover {
      background-color: #ffffff0a;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/\[0\.04\]:hover {
        background-color: color-mix(in oklab, var(--color-white) 4%, transparent);
      }
    }

    .hover\:bg-white\/\[0\.05\]:hover {
      background-color: #ffffff0d;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/\[0\.05\]:hover {
        background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
      }
    }

    .hover\:bg-white\/\[0\.06\]:hover {
      background-color: #ffffff0f;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/\[0\.06\]:hover {
        background-color: color-mix(in oklab, var(--color-white) 6%, transparent);
      }
    }

    .hover\:bg-white\/\[0\.07\]:hover {
      background-color: #ffffff12;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/\[0\.07\]:hover {
        background-color: color-mix(in oklab, var(--color-white) 7.0%, transparent);
      }
    }

    .hover\:bg-white\/\[0\.08\]:hover {
      background-color: #ffffff14;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/\[0\.08\]:hover {
        background-color: color-mix(in oklab, var(--color-white) 8%, transparent);
      }
    }

    .hover\:bg-white\/\[0\.09\]:hover {
      background-color: #ffffff17;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-white\/\[0\.09\]:hover {
        background-color: color-mix(in oklab, var(--color-white) 9%, transparent);
      }
    }

    .hover\:text-accent:hover {
      color: var(--color-accent);
    }

    .hover\:text-accent-hover:hover {
      color: var(--color-accent-hover);
    }

    .hover\:text-accent\/40:hover {
      color: #f8a05466;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:text-accent\/40:hover {
        color: color-mix(in oklab, var(--color-accent) 40%, transparent);
      }
    }

    .hover\:text-accent\/50:hover {
      color: #f8a05480;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:text-accent\/50:hover {
        color: color-mix(in oklab, var(--color-accent) 50%, transparent);
      }
    }

    .hover\:text-accent\/70:hover {
      color: #f8a054b3;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:text-accent\/70:hover {
        color: color-mix(in oklab, var(--color-accent) 70%, transparent);
      }
    }

    .hover\:text-accent\/80:hover {
      color: #f8a054cc;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:text-accent\/80:hover {
        color: color-mix(in oklab, var(--color-accent) 80%, transparent);
      }
    }

    .hover\:text-heading:hover {
      color: var(--color-heading);
    }

    .hover\:text-primary:hover {
      color: var(--color-primary);
    }

    .hover\:text-primary-dark:hover {
      color: var(--color-primary-dark);
    }

    .hover\:text-white:hover {
      color: var(--color-white);
    }

    .hover\:text-white\/60:hover {
      color: #fff9;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:text-white\/60:hover {
        color: color-mix(in oklab, var(--color-white) 60%, transparent);
      }
    }

    .hover\:no-underline:hover {
      text-decoration-line: none;
    }

    .hover\:underline:hover {
      text-decoration-line: underline;
    }

    .hover\:opacity-90:hover {
      opacity: .9;
    }

    .hover\:opacity-100:hover {
      opacity: 1;
    }

    .hover\:shadow-\[0_2px_12px_rgba\(14\,30\,49\,0\.05\)\]:hover {
      --tw-shadow: 0 2px 12px var(--tw-shadow-color, #0e1e310d);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_2px_16px_rgba\(14\,30\,49\,0\.05\)\]:hover {
      --tw-shadow: 0 2px 16px var(--tw-shadow-color, #0e1e310d);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_4px_24px_rgba\(14\,30\,49\,0\.06\)\]:hover {
      --tw-shadow: 0 4px 24px var(--tw-shadow-color, #0e1e310f);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_4px_24px_rgba\(14\,30\,49\,0\.08\)\]:hover {
      --tw-shadow: 0 4px 24px var(--tw-shadow-color, #0e1e3114);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_6px_28px_rgba\(14\,30\,49\,0\.07\)\]:hover {
      --tw-shadow: 0 6px 28px var(--tw-shadow-color, #0e1e3112);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_8px_28px_rgba\(14\,30\,49\,0\.07\)\]:hover {
      --tw-shadow: 0 8px 28px var(--tw-shadow-color, #0e1e3112);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_8px_32px_rgba\(14\,30\,49\,0\.1\)\]:hover {
      --tw-shadow: 0 8px 32px var(--tw-shadow-color, #0e1e311a);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_8px_32px_rgba\(14\,30\,49\,0\.08\)\]:hover {
      --tw-shadow: 0 8px 32px var(--tw-shadow-color, #0e1e3114);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-\[0_12px_40px_rgba\(14\,30\,49\,0\.08\)\]:hover {
      --tw-shadow: 0 12px 40px var(--tw-shadow-color, #0e1e3114);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-lg:hover {
      --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-md:hover {
      --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }

    .hover\:shadow-sm:hover {
      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    }
  }

  .focus\:border-accent\/30:focus {
    border-color: #f8a0544d;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .focus\:border-accent\/30:focus {
      border-color: color-mix(in oklab, var(--color-accent) 30%, transparent);
    }
  }

  .focus\:border-indigo-500:focus {
    border-color: var(--color-indigo-500);
  }

  .focus\:ring-2:focus {
    --tw-ring-shadow: var(--tw-ring-inset,  ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .focus\:ring-accent\/20:focus {
    --tw-ring-color: #f8a05433;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .focus\:ring-accent\/20:focus {
      --tw-ring-color: color-mix(in oklab, var(--color-accent) 20%, transparent);
    }
  }

  .focus\:outline-none:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  @media (min-width: 40rem) {
    .sm\:visible {
      visibility: visible;
    }

    .sm\:col-span-2 {
      grid-column: span 2 / span 2;
    }

    .sm\:mt-4 {
      margin-top: calc(var(--spacing) * 4);
    }

    .sm\:mt-5 {
      margin-top: calc(var(--spacing) * 5);
    }

    .sm\:mt-6 {
      margin-top: calc(var(--spacing) * 6);
    }

    .sm\:mt-8 {
      margin-top: calc(var(--spacing) * 8);
    }

    .sm\:mt-12 {
      margin-top: calc(var(--spacing) * 12);
    }

    .sm\:mb-0 {
      margin-bottom: calc(var(--spacing) * 0);
    }

    .sm\:mb-4 {
      margin-bottom: calc(var(--spacing) * 4);
    }

    .sm\:mb-6 {
      margin-bottom: calc(var(--spacing) * 6);
    }

    .sm\:mb-7 {
      margin-bottom: calc(var(--spacing) * 7);
    }

    .sm\:mb-8 {
      margin-bottom: calc(var(--spacing) * 8);
    }

    .sm\:mb-10 {
      margin-bottom: calc(var(--spacing) * 10);
    }

    .sm\:mb-12 {
      margin-bottom: calc(var(--spacing) * 12);
    }

    .sm\:mb-14 {
      margin-bottom: calc(var(--spacing) * 14);
    }

    .sm\:ml-2 {
      margin-left: calc(var(--spacing) * 2);
    }

    .sm\:ml-2\.5 {
      margin-left: calc(var(--spacing) * 2.5);
    }

    .sm\:ml-5 {
      margin-left: calc(var(--spacing) * 5);
    }

    .sm\:block {
      display: block;
    }

    .sm\:flex {
      display: flex;
    }

    .sm\:hidden {
      display: none;
    }

    .sm\:h-auto {
      height: auto;
    }

    .sm\:w-20 {
      width: calc(var(--spacing) * 20);
    }

    .sm\:w-\[140px\] {
      width: 140px;
    }

    .sm\:w-auto {
      width: auto;
    }

    .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\:grid-cols-6 {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .sm\:flex-row {
      flex-direction: row;
    }

    .sm\:items-center {
      align-items: center;
    }

    .sm\:items-end {
      align-items: flex-end;
    }

    .sm\:justify-between {
      justify-content: space-between;
    }

    .sm\:justify-start {
      justify-content: flex-start;
    }

    .sm\:gap-3 {
      gap: calc(var(--spacing) * 3);
    }

    .sm\:gap-6 {
      gap: calc(var(--spacing) * 6);
    }

    .sm\:gap-8 {
      gap: calc(var(--spacing) * 8);
    }

    .sm\:gap-10 {
      gap: calc(var(--spacing) * 10);
    }

    .sm\:border-t-0 {
      border-top-style: var(--tw-border-style);
      border-top-width: 0;
    }

    .sm\:border-r {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }

    .sm\:border-b-0 {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0;
    }

    .sm\:p-5 {
      padding: calc(var(--spacing) * 5);
    }

    .sm\:p-7 {
      padding: calc(var(--spacing) * 7);
    }

    .sm\:p-8 {
      padding: calc(var(--spacing) * 8);
    }

    .sm\:p-9 {
      padding: calc(var(--spacing) * 9);
    }

    .sm\:px-2 {
      padding-inline: calc(var(--spacing) * 2);
    }

    .sm\:px-2\.5 {
      padding-inline: calc(var(--spacing) * 2.5);
    }

    .sm\:px-3\.5 {
      padding-inline: calc(var(--spacing) * 3.5);
    }

    .sm\:px-5 {
      padding-inline: calc(var(--spacing) * 5);
    }

    .sm\:px-6 {
      padding-inline: calc(var(--spacing) * 6);
    }

    .sm\:px-7 {
      padding-inline: calc(var(--spacing) * 7);
    }

    .sm\:py-0 {
      padding-block: calc(var(--spacing) * 0);
    }

    .sm\:py-2\.5 {
      padding-block: calc(var(--spacing) * 2.5);
    }

    .sm\:py-3\.5 {
      padding-block: calc(var(--spacing) * 3.5);
    }

    .sm\:py-16 {
      padding-block: calc(var(--spacing) * 16);
    }

    .sm\:py-20 {
      padding-block: calc(var(--spacing) * 20);
    }

    .sm\:pt-0 {
      padding-top: calc(var(--spacing) * 0);
    }

    .sm\:pt-16 {
      padding-top: calc(var(--spacing) * 16);
    }

    .sm\:pt-20 {
      padding-top: calc(var(--spacing) * 20);
    }

    .sm\:pb-16 {
      padding-bottom: calc(var(--spacing) * 16);
    }

    .sm\:pb-20 {
      padding-bottom: calc(var(--spacing) * 20);
    }

    .sm\:pl-2 {
      padding-left: calc(var(--spacing) * 2);
    }

    .sm\:text-left {
      text-align: left;
    }

    .sm\:text-3xl {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }

    .sm\:text-4xl {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }

    .sm\:text-5xl {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }

    .sm\:text-base {
      font-size: var(--text-base);
      line-height: var(--tw-leading, var(--text-base--line-height));
    }

    .sm\:text-sm {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }

    .sm\:text-\[0\.95rem\] {
      font-size: .95rem;
    }

    .sm\:text-\[1\.05rem\] {
      font-size: 1.05rem;
    }

    .sm\:text-\[1rem\] {
      font-size: 1rem;
    }

    .sm\:text-\[2\.5rem\] {
      font-size: 2.5rem;
    }

    .sm\:text-\[2\.8rem\] {
      font-size: 2.8rem;
    }

    .sm\:text-\[2\.75rem\] {
      font-size: 2.75rem;
    }

    .sm\:text-\[2rem\] {
      font-size: 2rem;
    }

    .sm\:text-\[3\.5rem\] {
      font-size: 3.5rem;
    }

    .sm\:text-\[3\.25rem\] {
      font-size: 3.25rem;
    }

    .sm\:text-\[3\.75rem\] {
      font-size: 3.75rem;
    }

    .sm\:text-\[3rem\] {
      font-size: 3rem;
    }
  }

  @media (min-width: 48rem) {
    .md\:visible {
      visibility: visible;
    }

    .md\:absolute {
      position: absolute;
    }

    .md\:col-span-2 {
      grid-column: span 2 / span 2;
    }

    .md\:col-span-4 {
      grid-column: span 4 / span 4;
    }

    .md\:mx-0 {
      margin-inline: calc(var(--spacing) * 0);
    }

    .md\:mx-1 {
      margin-inline: calc(var(--spacing) * 1);
    }

    .md\:mx-2 {
      margin-inline: calc(var(--spacing) * 2);
    }

    .md\:mx-3 {
      margin-inline: calc(var(--spacing) * 3);
    }

    .md\:my-6 {
      margin-block: calc(var(--spacing) * 6);
    }

    .md\:mt-0 {
      margin-top: calc(var(--spacing) * 0);
    }

    .md\:mt-1 {
      margin-top: calc(var(--spacing) * 1);
    }

    .md\:mt-2\.5 {
      margin-top: calc(var(--spacing) * 2.5);
    }

    .md\:mr-0 {
      margin-right: calc(var(--spacing) * 0);
    }

    .md\:mr-2 {
      margin-right: calc(var(--spacing) * 2);
    }

    .md\:mr-2\.5 {
      margin-right: calc(var(--spacing) * 2.5);
    }

    .md\:mr-3 {
      margin-right: calc(var(--spacing) * 3);
    }

    .md\:mr-4 {
      margin-right: calc(var(--spacing) * 4);
    }

    .md\:mr-5 {
      margin-right: calc(var(--spacing) * 5);
    }

    .md\:mr-10 {
      margin-right: calc(var(--spacing) * 10);
    }

    .md\:mb-0 {
      margin-bottom: calc(var(--spacing) * 0);
    }

    .md\:mb-2\.5 {
      margin-bottom: calc(var(--spacing) * 2.5);
    }

    .md\:mb-5 {
      margin-bottom: calc(var(--spacing) * 5);
    }

    .md\:mb-10 {
      margin-bottom: calc(var(--spacing) * 10);
    }

    .md\:ml-2\.5 {
      margin-left: calc(var(--spacing) * 2.5);
    }

    .md\:ml-4 {
      margin-left: calc(var(--spacing) * 4);
    }

    .md\:ml-10 {
      margin-left: calc(var(--spacing) * 10);
    }

    .md\:block {
      display: block;
    }

    .md\:flex {
      display: flex;
    }

    .md\:hidden {
      display: none;
    }

    .md\:inline {
      display: inline;
    }

    .md\:inline-block {
      display: inline-block;
    }

    .md\:table-cell {
      display: table-cell;
    }

    .md\:min-h-screen {
      min-height: 100vh;
    }

    .md\:w-1\/2 {
      width: 50%;
    }

    .md\:w-\[100px\] {
      width: 100px;
    }

    .md\:flex-1 {
      flex: 1;
    }

    .md\:flex-shrink-0 {
      flex-shrink: 0;
    }

    .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-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr));
    }

    .md\:flex-col {
      flex-direction: column;
    }

    .md\:flex-row {
      flex-direction: row;
    }

    .md\:items-end {
      align-items: flex-end;
    }

    .md\:items-start {
      align-items: flex-start;
    }

    .md\:justify-center {
      justify-content: center;
    }

    .md\:justify-end {
      justify-content: flex-end;
    }

    .md\:justify-start {
      justify-content: flex-start;
    }

    .md\:gap-0 {
      gap: calc(var(--spacing) * 0);
    }

    .md\:gap-6 {
      gap: calc(var(--spacing) * 6);
    }

    :where(.md\:space-y-5 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
    }

    .md\:overflow-hidden {
      overflow: hidden;
    }

    .md\:overflow-x-hidden {
      overflow-x: hidden;
    }

    .md\:border-r {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }

    .md\:border-b-0 {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0;
    }

    .md\:px-0 {
      padding-inline: calc(var(--spacing) * 0);
    }

    .md\:px-2\.5 {
      padding-inline: calc(var(--spacing) * 2.5);
    }

    .md\:px-5 {
      padding-inline: calc(var(--spacing) * 5);
    }

    .md\:px-10 {
      padding-inline: calc(var(--spacing) * 10);
    }

    .md\:py-0 {
      padding-block: calc(var(--spacing) * 0);
    }

    .md\:py-6 {
      padding-block: calc(var(--spacing) * 6);
    }

    .md\:pt-5 {
      padding-top: calc(var(--spacing) * 5);
    }

    .md\:pr-0 {
      padding-right: calc(var(--spacing) * 0);
    }

    .md\:pr-1 {
      padding-right: calc(var(--spacing) * 1);
    }

    .md\:pr-2 {
      padding-right: calc(var(--spacing) * 2);
    }

    .md\:pr-2\.5 {
      padding-right: calc(var(--spacing) * 2.5);
    }

    .md\:pr-4 {
      padding-right: calc(var(--spacing) * 4);
    }

    .md\:pb-0 {
      padding-bottom: calc(var(--spacing) * 0);
    }

    .md\:pb-2 {
      padding-bottom: calc(var(--spacing) * 2);
    }

    .md\:pl-1 {
      padding-left: calc(var(--spacing) * 1);
    }

    .md\:pl-2 {
      padding-left: calc(var(--spacing) * 2);
    }

    .md\:pl-2\.5 {
      padding-left: calc(var(--spacing) * 2.5);
    }

    .md\:pl-10 {
      padding-left: calc(var(--spacing) * 10);
    }

    .md\:text-left {
      text-align: left;
    }

    .md\:text-right {
      text-align: right;
    }

    .md\:text-3xl {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }
  }

  @media (min-width: 64rem) {
    .lg\:visible {
      visibility: visible;
    }

    .lg\:right-2 {
      right: calc(var(--spacing) * 2);
    }

    .lg\:left-2 {
      left: calc(var(--spacing) * 2);
    }

    .lg\:order-none {
      order: 0;
    }

    .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\:mx-0 {
      margin-inline: calc(var(--spacing) * 0);
    }

    .lg\:my-10 {
      margin-block: calc(var(--spacing) * 10);
    }

    .lg\:mt-0 {
      margin-top: calc(var(--spacing) * 0);
    }

    .lg\:mt-1 {
      margin-top: calc(var(--spacing) * 1);
    }

    .lg\:mt-1\.5 {
      margin-top: calc(var(--spacing) * 1.5);
    }

    .lg\:mt-2 {
      margin-top: calc(var(--spacing) * 2);
    }

    .lg\:mt-6 {
      margin-top: calc(var(--spacing) * 6);
    }

    .lg\:mt-8 {
      margin-top: calc(var(--spacing) * 8);
    }

    .lg\:mt-9 {
      margin-top: calc(var(--spacing) * 9);
    }

    .lg\:mt-10 {
      margin-top: calc(var(--spacing) * 10);
    }

    .lg\:mt-12 {
      margin-top: calc(var(--spacing) * 12);
    }

    .lg\:mt-14 {
      margin-top: calc(var(--spacing) * 14);
    }

    .lg\:mt-16 {
      margin-top: calc(var(--spacing) * 16);
    }

    .lg\:mt-18 {
      margin-top: calc(var(--spacing) * 18);
    }

    .lg\:mt-20 {
      margin-top: calc(var(--spacing) * 20);
    }

    .lg\:mt-28 {
      margin-top: calc(var(--spacing) * 28);
    }

    .lg\:mr-2 {
      margin-right: calc(var(--spacing) * 2);
    }

    .lg\:mr-2\.5 {
      margin-right: calc(var(--spacing) * 2.5);
    }

    .lg\:mr-6 {
      margin-right: calc(var(--spacing) * 6);
    }

    .lg\:mr-10 {
      margin-right: calc(var(--spacing) * 10);
    }

    .lg\:mb-0 {
      margin-bottom: calc(var(--spacing) * 0);
    }

    .lg\:mb-8 {
      margin-bottom: calc(var(--spacing) * 8);
    }

    .lg\:mb-14 {
      margin-bottom: calc(var(--spacing) * 14);
    }

    .lg\:mb-16 {
      margin-bottom: calc(var(--spacing) * 16);
    }

    .lg\:mb-18 {
      margin-bottom: calc(var(--spacing) * 18);
    }

    .lg\:mb-20 {
      margin-bottom: calc(var(--spacing) * 20);
    }

    .lg\:mb-24 {
      margin-bottom: calc(var(--spacing) * 24);
    }

    .lg\:ml-2 {
      margin-left: calc(var(--spacing) * 2);
    }

    .lg\:ml-2\.5 {
      margin-left: calc(var(--spacing) * 2.5);
    }

    .lg\:ml-auto {
      margin-left: auto;
    }

    .lg\:block {
      display: block;
    }

    .lg\:flex {
      display: flex;
    }

    .lg\:grid {
      display: grid;
    }

    .lg\:hidden {
      display: none;
    }

    .lg\:inline-block {
      display: inline-block;
    }

    .lg\:inline-flex {
      display: inline-flex;
    }

    .lg\:table-cell {
      display: table-cell;
    }

    .lg\:h-12 {
      height: calc(var(--spacing) * 12);
    }

    .lg\:h-60 {
      height: calc(var(--spacing) * 60);
    }

    .lg\:h-\[700px\] {
      height: 700px;
    }

    .lg\:h-\[750px\] {
      height: 750px;
    }

    .lg\:h-\[1100px\] {
      height: 1100px;
    }

    .lg\:w-12 {
      width: calc(var(--spacing) * 12);
    }

    .lg\:w-40 {
      width: calc(var(--spacing) * 40);
    }

    .lg\:w-60 {
      width: calc(var(--spacing) * 60);
    }

    .lg\:w-\[750px\] {
      width: 750px;
    }

    .lg\:w-\[900px\] {
      width: 900px;
    }

    .lg\:w-\[1100px\] {
      width: 1100px;
    }

    .lg\:w-auto {
      width: auto;
    }

    .lg\:max-w-none {
      max-width: none;
    }

    .lg\:min-w-\[320px\] {
      min-width: 320px;
    }

    .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-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr));
    }

    .lg\:flex-row {
      flex-direction: row;
    }

    .lg\:items-center {
      align-items: center;
    }

    .lg\:items-start {
      align-items: flex-start;
    }

    .lg\:justify-center {
      justify-content: center;
    }

    .lg\:justify-end {
      justify-content: flex-end;
    }

    .lg\:justify-start {
      justify-content: flex-start;
    }

    .lg\:gap-0 {
      gap: calc(var(--spacing) * 0);
    }

    .lg\:gap-5 {
      gap: calc(var(--spacing) * 5);
    }

    .lg\:gap-6 {
      gap: calc(var(--spacing) * 6);
    }

    .lg\:gap-8 {
      gap: calc(var(--spacing) * 8);
    }

    .lg\:gap-10 {
      gap: calc(var(--spacing) * 10);
    }

    .lg\:gap-12 {
      gap: calc(var(--spacing) * 12);
    }

    .lg\:gap-14 {
      gap: calc(var(--spacing) * 14);
    }

    .lg\:gap-16 {
      gap: calc(var(--spacing) * 16);
    }

    :where(.lg\:space-y-8 > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
    }

    .lg\:gap-x-20 {
      -moz-column-gap: calc(var(--spacing) * 20);
           column-gap: calc(var(--spacing) * 20);
    }

    .lg\:self-center {
      align-self: center;
    }

    .lg\:border-t-0 {
      border-top-style: var(--tw-border-style);
      border-top-width: 0;
    }

    .lg\:border-r {
      border-right-style: var(--tw-border-style);
      border-right-width: 1px;
    }

    .lg\:border-b-0 {
      border-bottom-style: var(--tw-border-style);
      border-bottom-width: 0;
    }

    .lg\:border-l {
      border-left-style: var(--tw-border-style);
      border-left-width: 1px;
    }

    .lg\:border-border\/20 {
      border-color: #e8e6e133;
    }

    @supports (color: color-mix(in lab, red, red)) {
      .lg\:border-border\/20 {
        border-color: color-mix(in oklab, var(--color-border) 20%, transparent);
      }
    }

    .lg\:p-6 {
      padding: calc(var(--spacing) * 6);
    }

    .lg\:p-7 {
      padding: calc(var(--spacing) * 7);
    }

    .lg\:p-8 {
      padding: calc(var(--spacing) * 8);
    }

    .lg\:p-9 {
      padding: calc(var(--spacing) * 9);
    }

    .lg\:p-10 {
      padding: calc(var(--spacing) * 10);
    }

    .lg\:px-0 {
      padding-inline: calc(var(--spacing) * 0);
    }

    .lg\:px-1 {
      padding-inline: calc(var(--spacing) * 1);
    }

    .lg\:px-2 {
      padding-inline: calc(var(--spacing) * 2);
    }

    .lg\:px-2\.5 {
      padding-inline: calc(var(--spacing) * 2.5);
    }

    .lg\:px-4 {
      padding-inline: calc(var(--spacing) * 4);
    }

    .lg\:px-5 {
      padding-inline: calc(var(--spacing) * 5);
    }

    .lg\:px-8 {
      padding-inline: calc(var(--spacing) * 8);
    }

    .lg\:px-9 {
      padding-inline: calc(var(--spacing) * 9);
    }

    .lg\:px-10 {
      padding-inline: calc(var(--spacing) * 10);
    }

    .lg\:px-16 {
      padding-inline: calc(var(--spacing) * 16);
    }

    .lg\:py-2 {
      padding-block: calc(var(--spacing) * 2);
    }

    .lg\:py-2\.5 {
      padding-block: calc(var(--spacing) * 2.5);
    }

    .lg\:py-5 {
      padding-block: calc(var(--spacing) * 5);
    }

    .lg\:py-7 {
      padding-block: calc(var(--spacing) * 7);
    }

    .lg\:py-10 {
      padding-block: calc(var(--spacing) * 10);
    }

    .lg\:py-12 {
      padding-block: calc(var(--spacing) * 12);
    }

    .lg\:py-14 {
      padding-block: calc(var(--spacing) * 14);
    }

    .lg\:py-16 {
      padding-block: calc(var(--spacing) * 16);
    }

    .lg\:py-20 {
      padding-block: calc(var(--spacing) * 20);
    }

    .lg\:py-24 {
      padding-block: calc(var(--spacing) * 24);
    }

    .lg\:py-28 {
      padding-block: calc(var(--spacing) * 28);
    }

    .lg\:py-32 {
      padding-block: calc(var(--spacing) * 32);
    }

    .lg\:py-36 {
      padding-block: calc(var(--spacing) * 36);
    }

    .lg\:pt-4 {
      padding-top: calc(var(--spacing) * 4);
    }

    .lg\:pt-16 {
      padding-top: calc(var(--spacing) * 16);
    }

    .lg\:pt-20 {
      padding-top: calc(var(--spacing) * 20);
    }

    .lg\:pt-24 {
      padding-top: calc(var(--spacing) * 24);
    }

    .lg\:pt-28 {
      padding-top: calc(var(--spacing) * 28);
    }

    .lg\:pt-32 {
      padding-top: calc(var(--spacing) * 32);
    }

    .lg\:pt-36 {
      padding-top: calc(var(--spacing) * 36);
    }

    .lg\:pt-64 {
      padding-top: calc(var(--spacing) * 64);
    }

    .lg\:pr-1 {
      padding-right: calc(var(--spacing) * 1);
    }

    .lg\:pr-2 {
      padding-right: calc(var(--spacing) * 2);
    }

    .lg\:pr-2\.5 {
      padding-right: calc(var(--spacing) * 2.5);
    }

    .lg\:pr-4 {
      padding-right: calc(var(--spacing) * 4);
    }

    .lg\:pr-5 {
      padding-right: calc(var(--spacing) * 5);
    }

    .lg\:pr-8 {
      padding-right: calc(var(--spacing) * 8);
    }

    .lg\:pr-16 {
      padding-right: calc(var(--spacing) * 16);
    }

    .lg\:pb-10 {
      padding-bottom: calc(var(--spacing) * 10);
    }

    .lg\:pb-12 {
      padding-bottom: calc(var(--spacing) * 12);
    }

    .lg\:pb-14 {
      padding-bottom: calc(var(--spacing) * 14);
    }

    .lg\:pb-16 {
      padding-bottom: calc(var(--spacing) * 16);
    }

    .lg\:pb-20 {
      padding-bottom: calc(var(--spacing) * 20);
    }

    .lg\:pb-24 {
      padding-bottom: calc(var(--spacing) * 24);
    }

    .lg\:pb-28 {
      padding-bottom: calc(var(--spacing) * 28);
    }

    .lg\:pb-32 {
      padding-bottom: calc(var(--spacing) * 32);
    }

    .lg\:pb-36 {
      padding-bottom: calc(var(--spacing) * 36);
    }

    .lg\:pb-40 {
      padding-bottom: calc(var(--spacing) * 40);
    }

    .lg\:pl-0 {
      padding-left: calc(var(--spacing) * 0);
    }

    .lg\:pl-1 {
      padding-left: calc(var(--spacing) * 1);
    }

    .lg\:pl-2 {
      padding-left: calc(var(--spacing) * 2);
    }

    .lg\:pl-2\.5 {
      padding-left: calc(var(--spacing) * 2.5);
    }

    .lg\:pl-3 {
      padding-left: calc(var(--spacing) * 3);
    }

    .lg\:pl-4 {
      padding-left: calc(var(--spacing) * 4);
    }

    .lg\:pl-5 {
      padding-left: calc(var(--spacing) * 5);
    }

    .lg\:pl-8 {
      padding-left: calc(var(--spacing) * 8);
    }

    .lg\:pl-10 {
      padding-left: calc(var(--spacing) * 10);
    }

    .lg\:pl-16 {
      padding-left: calc(var(--spacing) * 16);
    }

    .lg\:text-left {
      text-align: left;
    }

    .lg\:text-right {
      text-align: right;
    }

    .lg\:text-2xl {
      font-size: var(--text-2xl);
      line-height: var(--tw-leading, var(--text-2xl--line-height));
    }

    .lg\:text-3xl {
      font-size: var(--text-3xl);
      line-height: var(--tw-leading, var(--text-3xl--line-height));
    }

    .lg\:text-4xl {
      font-size: var(--text-4xl);
      line-height: var(--tw-leading, var(--text-4xl--line-height));
    }

    .lg\:text-5xl {
      font-size: var(--text-5xl);
      line-height: var(--tw-leading, var(--text-5xl--line-height));
    }

    .lg\:text-6xl {
      font-size: var(--text-6xl);
      line-height: var(--tw-leading, var(--text-6xl--line-height));
    }

    .lg\:text-sm {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }

    .lg\:text-xl {
      font-size: var(--text-xl);
      line-height: var(--tw-leading, var(--text-xl--line-height));
    }

    .lg\:text-\[0\.9rem\] {
      font-size: .9rem;
    }

    .lg\:text-\[1\.1rem\] {
      font-size: 1.1rem;
    }

    .lg\:text-\[1\.2rem\] {
      font-size: 1.2rem;
    }

    .lg\:text-\[1\.4rem\] {
      font-size: 1.4rem;
    }

    .lg\:text-\[1\.05rem\] {
      font-size: 1.05rem;
    }

    .lg\:text-\[1\.15rem\] {
      font-size: 1.15rem;
    }

    .lg\:text-\[1\.25rem\] {
      font-size: 1.25rem;
    }

    .lg\:text-\[1\.75rem\] {
      font-size: 1.75rem;
    }

    .lg\:text-\[2\.5rem\] {
      font-size: 2.5rem;
    }

    .lg\:text-\[2\.25rem\] {
      font-size: 2.25rem;
    }

    .lg\:text-\[2\.75rem\] {
      font-size: 2.75rem;
    }

    .lg\:text-\[3\.5rem\] {
      font-size: 3.5rem;
    }

    .lg\:text-\[3\.75rem\] {
      font-size: 3.75rem;
    }

    .lg\:text-\[3rem\] {
      font-size: 3rem;
    }

    .lg\:text-\[4\.25rem\] {
      font-size: 4.25rem;
    }

    .lg\:text-\[4\.75rem\] {
      font-size: 4.75rem;
    }

    .lg\:text-\[4rem\] {
      font-size: 4rem;
    }

    .lg\:text-\[6rem\] {
      font-size: 6rem;
    }
  }

  @media (min-width: 80rem) {
    .xl\:visible {
      visibility: visible;
    }

    .xl\:right-4 {
      right: calc(var(--spacing) * 4);
    }

    .xl\:right-8 {
      right: calc(var(--spacing) * 8);
    }

    .xl\:left-8 {
      left: calc(var(--spacing) * 8);
    }

    .xl\:col-span-6 {
      grid-column: span 6 / span 6;
    }

    .xl\:mt-0 {
      margin-top: calc(var(--spacing) * 0);
    }

    .xl\:mb-0 {
      margin-bottom: calc(var(--spacing) * 0);
    }

    .xl\:block {
      display: block;
    }

    .xl\:flex {
      display: flex;
    }

    .xl\:grid-cols-7 {
      grid-template-columns: repeat(7, minmax(0, 1fr));
    }

    .xl\:flex-row {
      flex-direction: row;
    }

    .xl\:justify-center {
      justify-content: center;
    }

    .xl\:px-0 {
      padding-inline: calc(var(--spacing) * 0);
    }

    .xl\:px-2\.5 {
      padding-inline: calc(var(--spacing) * 2.5);
    }

    .xl\:px-5 {
      padding-inline: calc(var(--spacing) * 5);
    }

    .xl\:px-10 {
      padding-inline: calc(var(--spacing) * 10);
    }

    .xl\:pr-2\.5 {
      padding-right: calc(var(--spacing) * 2.5);
    }

    .xl\:pr-4 {
      padding-right: calc(var(--spacing) * 4);
    }

    .xl\:pr-5 {
      padding-right: calc(var(--spacing) * 5);
    }

    .xl\:pl-2\.5 {
      padding-left: calc(var(--spacing) * 2.5);
    }

    .xl\:pl-10 {
      padding-left: calc(var(--spacing) * 10);
    }

    .xl\:text-\[5\.75rem\] {
      font-size: 5.75rem;
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:bg-gray-700 {
      background-color: var(--color-gray-700);
    }

    .dark\:bg-gray-800 {
      background-color: var(--color-gray-800);
    }

    .dark\:bg-gray-900 {
      background-color: var(--color-gray-900);
    }

    .dark\:text-gray-200 {
      color: var(--color-gray-200);
    }

    .dark\:text-gray-400 {
      color: var(--color-gray-400);
    }

    .dark\:text-gray-500 {
      color: var(--color-gray-500);
    }

    .dark\:ring-gray-600 {
      --tw-ring-color: var(--color-gray-600);
    }
  }
}

html {
  overflow-x: hidden;
}

.mk-nav-panel {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s, transform .2s, visibility .2s;
  transform: translateY(4px);
}

.mk-nav-dropdown:hover .mk-nav-panel, .mk-nav-dropdown:focus-within .mk-nav-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.mk-nav-dropdown:hover .mk-nav-chevron {
  opacity: .8;
  transform: rotate(180deg);
}

.mk-nav-dropdown:hover .mk-nav-trigger {
  color: #fff;
  background: #ffffff0f;
}

.mk-nav-cta-outline {
  --btn-scale: .82;
}

.mk-nav-cta-inner {
  font-weight: 600;
  padding: 8px 20px !important;
  font-size: .8rem !important;
}

.mk-mobile-btn-wrap {
  width: 100%;
  display: flex;
}

.mk-mobile-btn-inner {
  text-align: center;
  justify-content: center;
  width: 100%;
  font-weight: 600;
  padding: 14px 24px !important;
  font-size: .9rem !important;
}

.mk-mobile-fab {
  z-index: 9992;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  background: #0e1e31e0;
  border: none;
  border-radius: 14px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0;
  transition: opacity .15s ease-out, transform .15s ease-out, background .1s;
  display: flex;
  position: fixed;
  top: 14px;
  right: 14px;
  transform: scale(.85)translateY(-4px);
  box-shadow: inset 0 0 0 1px #ffffff14, 0 2px 8px #0003, 0 8px 24px #0000001f;
}

.mk-mobile-fab.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1)translateY(0);
}

.mk-mobile-fab:after {
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, #0000, #ffffff1a 50%, #0000);
  border-radius: 14px 14px 0 0;
  height: 1px;
  position: absolute;
  top: 0;
  left: 20%;
  right: 20%;
}

.mk-mobile-fab:active {
  background: #0e1e31b3;
  transform: scale(.95);
  box-shadow: inset 0 0 0 1px #ffffff1a, 0 1px 4px #0000004d;
}

.mk-mobile-fab.is-open {
  background: #0e1e31b3;
}

.mk-mobile-fab.is-open .mk-mobile-toggle-bar:first-child {
  width: 18px;
  transform: translateY(7px)rotate(45deg);
}

.mk-mobile-fab.is-open .mk-mobile-toggle-bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.mk-mobile-fab.is-open .mk-mobile-toggle-bar:nth-child(3) {
  width: 18px;
  transform: translateY(-7px)rotate(-45deg);
}

.mk-mobile-fab .mk-mobile-toggle-bar {
  width: 18px;
}

.mk-mobile-fab .mk-mobile-toggle-bar:nth-child(2) {
  width: 13px;
}

.mk-mobile-fab .mk-mobile-toggle-bar:nth-child(3) {
  width: 15px;
}

.mk-mobile-toggle-inline.is-open .mk-mobile-toggle-bar:first-child {
  width: 22px;
  transform: translateY(7px)rotate(45deg);
}

.mk-mobile-toggle-inline.is-open .mk-mobile-toggle-bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.mk-mobile-toggle-inline.is-open .mk-mobile-toggle-bar:nth-child(3) {
  width: 22px;
  transform: translateY(-7px)rotate(-45deg);
}

.mk-mobile-toggle {
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 6px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 36px;
  height: 36px;
  padding: 4px;
  transition: background .2s;
  display: flex;
}

.mk-mobile-toggle:active {
  background: #ffffff14;
}

.mk-mobile-toggle-bar {
  transform-origin: center;
  background: #fffc;
  border-radius: 1px;
  width: 22px;
  height: 1.5px;
  transition: transform .15s ease-out, opacity .1s, width .15s ease-out;
  display: block;
}

.mk-mobile-toggle-bar:nth-child(2) {
  width: 16px;
}

.mk-mobile-toggle-bar:nth-child(3) {
  width: 19px;
}

.mk-mobile-toggle.is-open .mk-mobile-toggle-bar:first-child {
  width: 22px;
  transform: translateY(7px)rotate(45deg);
}

.mk-mobile-toggle.is-open .mk-mobile-toggle-bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.mk-mobile-toggle.is-open .mk-mobile-toggle-bar:nth-child(3) {
  width: 22px;
  transform: translateY(-7px)rotate(-45deg);
}

.mk-mobile-menu {
  z-index: 9991;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  will-change: opacity;
  flex-direction: column;
  transition: opacity .15s ease-out, visibility .15s;
  display: flex;
  position: fixed;
  inset: 0;
}

.mk-mobile-menu.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.mk-mobile-menu-bg {
  background: linear-gradient(170deg, var(--color-primary) 0%, var(--color-primary-dark) 40%, #060d18 100%);
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-mobile-menu-glow {
  pointer-events: none;
  border-radius: 50%;
  position: absolute;
}

.mk-mobile-menu-glow-1 {
  background: radial-gradient(#f8a0540f 0%, #0000 60%);
  width: 400px;
  height: 400px;
  top: -100px;
  right: -120px;
}

.mk-mobile-menu-glow-2 {
  background: radial-gradient(#f8a0540a 0%, #0000 60%);
  width: 350px;
  height: 350px;
  bottom: 10%;
  left: -100px;
}

.mk-mobile-menu-glow-3 {
  background: radial-gradient(#64a0f008 0%, #0000 60%);
  width: 280px;
  height: 280px;
  top: 38%;
  right: -60px;
}

.mk-mobile-menu-grid {
  opacity: .6;
  background-image: radial-gradient(circle, #ffffff04 1px, #0000 1px);
  background-size: 28px 28px;
  position: absolute;
  inset: 0;
}

.mk-mobile-menu-header {
  z-index: 10;
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  padding: 14px 20px;
  display: flex;
  position: relative;
}

.mk-mobile-menu-close {
  cursor: pointer;
  color: #ffffff80;
  background: #ffffff0a;
  border: none;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  transition: color .2s, background .2s;
  display: flex;
}

.mk-mobile-menu-close:active {
  color: #ffffffe6;
  background: #ffffff14;
}

.mk-mobile-menu-content {
  z-index: 5;
  -webkit-overflow-scrolling: touch;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  max-height: 100dvh;
  padding: 0 28px 40px;
  display: flex;
  position: relative;
  overflow-y: auto;
}

.mk-mobile-menu-links {
  flex-direction: column;
  gap: 2px;
  display: flex;
}

.mk-mobile-link {
  border-radius: 10px;
  align-items: center;
  padding: 14px 8px;
  text-decoration: none;
  transition: background .2s;
  display: flex;
}

.mk-mobile-link:active {
  background: #ffffff0a;
}

.mk-mobile-link-main {
  transition: background .15s;
}

.mk-mobile-link-text {
  font-family: var(--font-heading);
  letter-spacing: -.01em;
  color: #ffffffd9;
  font-size: 1.6rem;
  font-weight: 400;
  transition: color .2s;
}

.mk-mobile-link:hover .mk-mobile-link-text, .mk-mobile-accordion-btn:hover .mk-mobile-link-text {
  color: #fff;
}

.mk-mobile-chevron {
  color: #ffffff4d;
  margin-left: auto;
  transition: transform .2s ease-out, color .15s;
}

.mk-mobile-accordion.is-open .mk-mobile-chevron {
  color: var(--color-accent);
  transform: rotate(180deg);
}

.mk-mobile-accordion-btn {
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  width: 100%;
}

.mk-mobile-accordion-inner {
  flex-direction: column;
  gap: 1px;
  padding: 0 8px 8px;
  display: flex;
}

.mk-mobile-sub-link {
  color: #ffffff73;
  border-radius: 8px;
  padding: 9px 16px;
  font-size: .85rem;
  text-decoration: none;
  transition: color .2s, background .2s;
  display: block;
  position: relative;
}

.mk-mobile-sub-link:hover, .mk-mobile-sub-link:active {
  color: #fffc;
  background: #ffffff0a;
}

.mk-mobile-sub-link-accent {
  color: var(--color-accent);
  font-weight: 500;
}

.mk-mobile-sub-link-accent:hover, .mk-mobile-sub-link-accent:active {
  color: var(--color-accent-hover);
}

.mk-mobile-menu-rule {
  align-items: center;
  gap: 10px;
  padding: 20px 8px 16px;
  display: flex;
}

.mk-mobile-menu-rule-line {
  background: linear-gradient(90deg, #ffffff0f, #f8a0541a, #ffffff0f);
  flex: 1;
  height: 1px;
}

.mk-mobile-menu-rule-diamond {
  background: #f8a05466;
  border-radius: 1px;
  width: 5px;
  height: 5px;
  transform: rotate(45deg);
}

.mk-mobile-menu-cta {
  flex-direction: column;
  gap: 10px;
  padding: 0 8px;
  display: flex;
}

.mk-mobile-btn {
  text-align: center;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 14px 24px;
  font-size: .9rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .25s cubic-bezier(.22, 1, .36, 1);
  display: flex;
}

.mk-mobile-btn-ghost {
  color: #ffffffb3;
  background: #ffffff0a;
  border: 1px solid #ffffff1a;
}

.mk-mobile-btn-ghost:active {
  background: #ffffff14;
  border-color: #ffffff2e;
}

@media (prefers-reduced-motion: reduce) {
  .mk-mobile-fab, .mk-mobile-toggle-bar, .mk-mobile-menu {
    transition: none;
  }

  .mk-mobile-link-main, .mk-mobile-accordion {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-mobile-menu-rule {
    opacity: 1;
    transition: none;
  }

  .mk-mobile-menu-cta {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-mobile-btn-wrap, .mk-mobile-accordion-panel {
    transition: none;
  }
}

@keyframes mk-fade-up {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mk-rise {
  from {
    opacity: 0;
    transform: translateY(48px)scale(.985);
  }

  to {
    opacity: 1;
    transform: translateY(0)scale(1);
  }
}

.mk-hero-enter {
  animation: 1.2s cubic-bezier(.22, 1, .36, 1) both mk-fade-up;
}

.mk-hero-enter-d1 {
  animation-delay: .1s;
}

.mk-hero-enter-d2 {
  animation-delay: .25s;
}

.mk-hero-enter-d3 {
  animation-delay: .45s;
}

.mk-hero-enter-d4 {
  animation-delay: .6s;
}

.mk-hero-enter-d5 {
  animation-delay: .85s;
}

.mk-hero-surface {
  background: #0e1828d9;
  border: 1px solid #ffffff0f;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 32px #0006;
}

.mk-hero-surface:before {
  content: "";
  z-index: 1;
  background: linear-gradient(90deg, #0000, #ffffff1a, #0000);
  height: 1px;
  position: absolute;
  top: 0;
  left: 12%;
  right: 12%;
}

.mk-hero-card-1 .mk-hero-surface {
  background: #101b2ceb;
  border-color: #ffffff14;
  box-shadow: 0 16px 48px #00000080, 0 4px 12px #0000004d;
}

.mk-hero-card-1 .mk-hero-surface:before {
  background: linear-gradient(90deg, #0000, #ffffff1f, #0000);
  left: 8%;
  right: 8%;
}

.mk-hero-card {
  opacity: 0;
  position: absolute;
}

.mk-hero-card-1 {
  animation: .9s cubic-bezier(.22, 1, .36, 1) .6s both mk-hero-in-1, 8s ease-in-out 2s infinite mk-hero-float-1;
}

.mk-hero-card-2 {
  animation: .85s cubic-bezier(.22, 1, .36, 1) .85s both mk-hero-in-2, 9s ease-in-out 2.3s infinite mk-hero-float-2;
}

.mk-hero-card-3 {
  animation: .85s cubic-bezier(.22, 1, .36, 1) 1s both mk-hero-in-3, 7s ease-in-out 2.6s infinite mk-hero-float-3;
}

.mk-hero-card-4 {
  animation: .75s cubic-bezier(.22, 1, .36, 1) 1.15s both mk-hero-in-4, 8.5s ease-in-out 2.5s infinite mk-hero-float-4;
}

.mk-hero-card-5 {
  animation: .75s cubic-bezier(.22, 1, .36, 1) 1.3s both mk-hero-in-5, 6.5s ease-in-out 2.8s infinite mk-hero-float-5;
}

@keyframes mk-hero-in-1 {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%)rotate(-1deg)translateY(30px)scale(.92);
  }

  100% {
    opacity: 1;
    transform: translate(-50%, -50%)rotate(-1deg);
  }
}

@keyframes mk-hero-in-2 {
  0% {
    opacity: 0;
    transform: rotate(2.5deg)translateX(25px)scale(.92);
  }

  100% {
    opacity: 1;
    transform: rotate(2.5deg);
  }
}

@keyframes mk-hero-in-3 {
  0% {
    opacity: 0;
    transform: rotate(-2deg)translateX(-25px)scale(.92);
  }

  100% {
    opacity: 1;
    transform: rotate(-2deg);
  }
}

@keyframes mk-hero-in-4 {
  0% {
    opacity: 0;
    transform: rotate(1deg)translateY(20px)scale(.9);
  }

  100% {
    opacity: 1;
    transform: rotate(1deg);
  }
}

@keyframes mk-hero-in-5 {
  0% {
    opacity: 0;
    transform: rotate(-1.5deg)translateY(-20px)scale(.9);
  }

  100% {
    opacity: 1;
    transform: rotate(-1.5deg);
  }
}

@keyframes mk-hero-float-1 {
  0%, 100% {
    transform: translate(-50%, -50%)rotate(-1deg);
  }

  50% {
    transform: translate(-50%, -50%)rotate(-1deg)translate(1px, -4px);
  }
}

@keyframes mk-hero-float-2 {
  0%, 100% {
    transform: rotate(2.5deg);
  }

  50% {
    transform: rotate(2.5deg)translate(-2px, 3px);
  }
}

@keyframes mk-hero-float-3 {
  0%, 100% {
    transform: rotate(-2deg);
  }

  50% {
    transform: rotate(-2deg)translate(2px, -3px);
  }
}

@keyframes mk-hero-float-4 {
  0%, 100% {
    transform: rotate(1deg);
  }

  50% {
    transform: rotate(1deg)translate(-1px, 3px);
  }
}

@keyframes mk-hero-float-5 {
  0%, 100% {
    transform: rotate(-1.5deg);
  }

  50% {
    transform: rotate(-1.5deg)translate(1px, -3px);
  }
}

.mk-hero-inbox {
  overflow: hidden;
}

.mk-hero-inbox-track {
  animation: 10s cubic-bezier(.4, 0, .2, 1) 3s infinite mk-hero-inbox-slide;
}

@keyframes mk-hero-inbox-slide {
  0%, 25% {
    transform: translateY(-34px);
  }

  32%, 78% {
    transform: translateY(0);
  }

  88%, 100% {
    transform: translateY(-34px);
  }
}

.mk-hero-inbox-new {
  opacity: 0;
  animation: 10s ease-in-out 3s infinite mk-hero-inbox-new-fade;
}

@keyframes mk-hero-inbox-new-fade {
  0%, 25% {
    opacity: 0;
  }

  35% {
    opacity: 1;
  }

  78% {
    opacity: 1;
  }

  88%, 100% {
    opacity: 0;
  }
}

.mk-hero-inbox-dot {
  animation: 10s ease-in-out 3s infinite mk-hero-inbox-dot-pulse;
}

@keyframes mk-hero-inbox-dot-pulse {
  0%, 30% {
    box-shadow: none;
    transform: scale(1);
  }

  36% {
    transform: scale(1.3);
    box-shadow: 0 0 6px #f8a05466;
  }

  42%, 100% {
    box-shadow: none;
    transform: scale(1);
  }
}

.mk-hero-task-check-box {
  animation: 9s ease-in-out 4s infinite mk-hero-task-box-fill;
}

@keyframes mk-hero-task-box-fill {
  0%, 18% {
    background: none;
    border-color: #f8a0544d;
  }

  22%, 60% {
    background: #34d3991f;
    border-color: #34d39940;
  }

  70%, 100% {
    background: none;
    border-color: #f8a0544d;
  }
}

.mk-hero-task-check-svg {
  stroke-dasharray: 22;
  stroke-dashoffset: 22px;
  animation: 9s ease-in-out 4s infinite mk-hero-task-check-draw;
}

@keyframes mk-hero-task-check-draw {
  0%, 18% {
    stroke-dashoffset: 22px;
    opacity: 0;
  }

  20% {
    opacity: 1;
  }

  26% {
    stroke-dashoffset: 0;
  }

  60% {
    stroke-dashoffset: 0;
    opacity: 1;
  }

  68% {
    stroke-dashoffset: 22px;
    opacity: 0;
  }

  100% {
    stroke-dashoffset: 22px;
    opacity: 0;
  }
}

.mk-hero-task-strike {
  display: inline;
  position: relative;
}

.mk-hero-task-strike:after {
  content: "";
  background: #ffffff40;
  height: 1px;
  animation: 9s ease-in-out 4s infinite mk-hero-task-strike-sweep;
  position: absolute;
  top: 50%;
  left: 0;
}

@keyframes mk-hero-task-strike-sweep {
  0%, 22% {
    width: 0;
  }

  28% {
    width: 100%;
  }

  60% {
    width: 100%;
  }

  68%, 100% {
    width: 0;
  }
}

.mk-hero-task-next {
  animation: 9s ease-in-out 4s infinite mk-hero-task-next-pulse;
}

@keyframes mk-hero-task-next-pulse {
  0%, 55% {
    border-color: #ffffff0d;
  }

  65%, 85% {
    border-color: #f8a05440;
  }

  95%, 100% {
    border-color: #ffffff0d;
  }
}

.mk-hero-task-count-old {
  animation: 9s ease-in-out 4s infinite mk-hero-count-out;
}

.mk-hero-task-count-new {
  animation: 9s ease-in-out 4s infinite mk-hero-count-in;
}

@keyframes mk-hero-count-out {
  0%, 20% {
    opacity: 1;
  }

  26%, 65% {
    opacity: 0;
  }

  72%, 100% {
    opacity: 1;
  }
}

@keyframes mk-hero-count-in {
  0%, 20% {
    opacity: 0;
  }

  26%, 65% {
    opacity: 1;
  }

  72%, 100% {
    opacity: 0;
  }
}

.mk-hero-tpl-var {
  animation: 8s ease-in-out 3.5s infinite mk-hero-tpl-var-out;
}

@keyframes mk-hero-tpl-var-out {
  0%, 20% {
    opacity: 1;
  }

  28%, 68% {
    opacity: 0;
  }

  78%, 100% {
    opacity: 1;
  }
}

.mk-hero-tpl-val {
  animation: 8s ease-in-out 3.5s infinite mk-hero-tpl-val-in;
}

@keyframes mk-hero-tpl-val-in {
  0%, 20% {
    opacity: 0;
    transform: translateY(2px);
  }

  28% {
    opacity: 1;
    transform: translateY(0);
  }

  68% {
    opacity: 1;
    transform: translateY(0);
  }

  78%, 100% {
    opacity: 0;
    transform: translateY(2px);
  }
}

.mk-hero-tpl-var-2 {
  animation: 8s ease-in-out 4.5s infinite mk-hero-tpl-var-out;
}

.mk-hero-tpl-val-2 {
  animation: 8s ease-in-out 4.5s infinite mk-hero-tpl-val-in;
}

.mk-hero-tpl-flash {
  border-radius: inherit;
  pointer-events: none;
  animation: 8s ease-in-out 3.5s infinite mk-hero-tpl-flash-pulse;
  position: absolute;
  inset: -1px;
}

@keyframes mk-hero-tpl-flash-pulse {
  0%, 24% {
    box-shadow: none;
  }

  27% {
    box-shadow: 0 0 8px #f8a05426;
  }

  32%, 100% {
    box-shadow: none;
  }
}

.mk-hero-doc-line {
  transform-origin: 0;
  animation: 8s ease-in-out 3s infinite mk-hero-doc-line-in;
}

.mk-hero-doc-line:nth-child(2) {
  animation-delay: 3.15s;
}

.mk-hero-doc-line:nth-child(3) {
  animation-delay: 3.3s;
}

.mk-hero-doc-line:nth-child(4) {
  animation-delay: 3.45s;
}

.mk-hero-doc-line:nth-child(5) {
  animation-delay: 3.6s;
}

.mk-hero-doc-line:nth-child(6) {
  animation-delay: 3.75s;
}

@keyframes mk-hero-doc-line-in {
  0%, 5% {
    opacity: 0;
    transform: scaleX(0);
  }

  12%, 85% {
    opacity: 1;
    transform: scaleX(1);
  }

  92%, 100% {
    opacity: 0;
    transform: scaleX(0);
  }
}

.mk-hero-bar {
  transform-origin: bottom;
  animation: 7s ease-in-out infinite mk-hero-bar-grow;
}

.mk-hero-bar:first-child {
  animation-delay: 2s;
}

.mk-hero-bar:nth-child(2) {
  animation-delay: 2.15s;
}

.mk-hero-bar:nth-child(3) {
  animation-delay: 2.3s;
}

.mk-hero-bar:nth-child(4) {
  animation-delay: 2.45s;
}

.mk-hero-bar:nth-child(5) {
  animation-delay: 2.6s;
}

@keyframes mk-hero-bar-grow {
  0%, 5% {
    opacity: .2;
    transform: scaleY(.15);
  }

  18%, 78% {
    opacity: 1;
    transform: scaleY(1);
  }

  90%, 100% {
    opacity: .2;
    transform: scaleY(.15);
  }
}

.mk-hero-trend-line {
  stroke-dasharray: 60;
  stroke-dashoffset: 60px;
  animation: 7s ease-in-out 2.8s infinite mk-hero-trend-draw;
}

@keyframes mk-hero-trend-draw {
  0%, 10% {
    stroke-dashoffset: 60px;
    opacity: 0;
  }

  15% {
    opacity: 1;
  }

  30%, 75% {
    stroke-dashoffset: 0;
    opacity: 1;
  }

  85%, 100% {
    stroke-dashoffset: 60px;
    opacity: 0;
  }
}

.mk-hero-trend-label {
  animation: 7s ease-in-out 2.8s infinite mk-hero-trend-label-in;
}

@keyframes mk-hero-trend-label-in {
  0%, 25% {
    opacity: 0;
    transform: translateY(3px);
  }

  35%, 70% {
    opacity: 1;
    transform: translateY(0);
  }

  82%, 100% {
    opacity: 0;
    transform: translateY(3px);
  }
}

.mk-hero-progress {
  animation: 12s ease-in-out 2s infinite mk-hero-progress-fill;
  position: relative;
  overflow: hidden;
}

@keyframes mk-hero-progress-fill {
  0%, 10% {
    width: 58%;
  }

  50%, 60% {
    width: 72%;
  }

  90%, 100% {
    width: 58%;
  }
}

.mk-hero-progress:after {
  content: "";
  background: linear-gradient(90deg, #0000, #fff3, #0000);
  width: 100%;
  height: 100%;
  animation: 3.5s ease-in-out 3s infinite mk-hero-shimmer;
  position: absolute;
  top: 0;
  left: -100%;
}

@keyframes mk-hero-shimmer {
  0% {
    left: -100%;
  }

  40% {
    left: 100%;
  }

  100% {
    left: 100%;
  }
}

.mk-hero-progress-pct-a {
  animation: 12s ease-in-out 2s infinite mk-hero-count-out;
}

.mk-hero-progress-pct-b {
  animation: 12s ease-in-out 2s infinite mk-hero-count-in;
}

.mk-hero-status {
  animation: 3s ease-in-out 2s infinite mk-hero-status-glow;
}

@keyframes mk-hero-status-glow {
  0%, 100% {
    box-shadow: 0 0 3px #34d3994d;
  }

  50% {
    box-shadow: 0 0 6px #34d39980, 0 0 12px #34d39926;
  }
}

.mk-hero-activity-1 {
  animation: 6s ease-in-out 3s infinite mk-hero-activity-pop;
}

.mk-hero-activity-2 {
  animation: 6s ease-in-out 4s infinite mk-hero-activity-pop;
}

@keyframes mk-hero-activity-pop {
  0%, 10%, 100% {
    opacity: .3;
    transform: scale(1);
  }

  5% {
    opacity: .9;
    transform: scale(1.8);
  }

  8% {
    opacity: .5;
    transform: scale(1);
  }
}

.mk-hero-scan {
  border-radius: inherit;
  overflow: hidden;
}

.mk-hero-scan-line {
  opacity: 0;
  animation: 6s cubic-bezier(.4, 0, .2, 1) 3s infinite mk-hero-scan-sweep;
  top: 0;
}

@keyframes mk-hero-scan-sweep {
  0% {
    opacity: 0;
    top: 0%;
  }

  4% {
    opacity: .6;
  }

  28% {
    opacity: .3;
    top: 100%;
  }

  32% {
    opacity: 0;
  }

  100% {
    opacity: 0;
    top: 100%;
  }
}

.mk-hero-particle {
  opacity: 0;
  pointer-events: none;
  border-radius: 50%;
  position: absolute;
}

.mk-hero-particle-1 {
  animation: 9s ease-in-out 3s infinite mk-hero-drift-1;
}

.mk-hero-particle-2 {
  animation: 11s ease-in-out 4.5s infinite mk-hero-drift-2;
}

.mk-hero-particle-3 {
  animation: 13s ease-in-out 6s infinite mk-hero-drift-3;
}

.mk-hero-particle-4 {
  animation: 10s ease-in-out 3.5s infinite mk-hero-drift-4;
}

@keyframes mk-hero-drift-1 {
  0%, 100% {
    opacity: 0;
    transform: translate(0);
  }

  15% {
    opacity: .5;
  }

  50% {
    opacity: .6;
    transform: translate(12px, -35px);
  }

  85% {
    opacity: .2;
  }
}

@keyframes mk-hero-drift-2 {
  0%, 100% {
    opacity: 0;
    transform: translate(0);
  }

  15% {
    opacity: .35;
  }

  50% {
    opacity: .45;
    transform: translate(-18px, -28px);
  }

  85% {
    opacity: .1;
  }
}

@keyframes mk-hero-drift-3 {
  0%, 100% {
    opacity: 0;
    transform: translate(0);
  }

  15% {
    opacity: .3;
  }

  50% {
    opacity: .4;
    transform: translate(8px, -40px);
  }

  85% {
    opacity: .1;
  }
}

@keyframes mk-hero-drift-4 {
  0%, 100% {
    opacity: 0;
    transform: translate(0);
  }

  15% {
    opacity: .4;
  }

  50% {
    opacity: .5;
    transform: translate(-10px, 25px);
  }

  85% {
    opacity: .15;
  }
}

.mk-hero-connect {
  stroke-dasharray: 3 5;
  animation: 4s linear infinite mk-hero-connect-flow;
}

@keyframes mk-hero-connect-flow {
  0% {
    stroke-dashoffset: 0;
  }

  100% {
    stroke-dashoffset: -16px;
  }
}

.mk-hero-ground {
  animation: 6s ease-in-out 2s infinite mk-hero-ground-breathe;
}

@keyframes mk-hero-ground-breathe {
  0%, 100% {
    opacity: .7;
    transform: translateX(-50%)scaleX(1);
  }

  50% {
    opacity: 1;
    transform: translateX(-50%)scaleX(1.06);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-hero-card {
    opacity: 1 !important;
    animation: none !important;
  }

  .mk-hero-card-1 {
    transform: translate(-50%, -50%)rotate(-1deg);
  }

  .mk-hero-card-2 {
    transform: rotate(2.5deg);
  }

  .mk-hero-card-3 {
    transform: rotate(-2deg);
  }

  .mk-hero-card-4 {
    transform: rotate(1deg);
  }

  .mk-hero-card-5 {
    transform: rotate(-1.5deg);
  }

  .mk-hero-scan-line, .mk-hero-task-check-svg, .mk-hero-task-strike:after, .mk-hero-inbox-track, .mk-hero-inbox-new, .mk-hero-inbox-dot, .mk-hero-tpl-flash, .mk-hero-trend-line, .mk-hero-trend-label, .mk-hero-doc-line {
    animation: none !important;
  }

  .mk-hero-task-check-box {
    border-color: #f8a0544d;
    animation: none;
  }

  .mk-hero-task-next {
    animation: none;
  }

  .mk-hero-task-count-old {
    opacity: 1;
  }

  .mk-hero-task-count-new {
    opacity: 0;
  }

  .mk-hero-tpl-var {
    opacity: 1;
  }

  .mk-hero-tpl-val {
    opacity: 0;
  }

  .mk-hero-tpl-var-2 {
    opacity: 1;
  }

  .mk-hero-tpl-val-2 {
    opacity: 0;
  }

  .mk-hero-progress {
    width: 68%;
    animation: none;
  }

  .mk-hero-progress:after {
    animation: none;
    display: none;
  }

  .mk-hero-progress-pct-a {
    opacity: 1;
  }

  .mk-hero-progress-pct-b {
    opacity: 0;
  }

  .mk-hero-status {
    animation: none;
    box-shadow: 0 0 3px #34d3994d;
  }

  .mk-hero-activity-1, .mk-hero-activity-2 {
    opacity: .3;
    animation: none;
  }

  .mk-hero-bar {
    animation: none;
    transform: scaleY(1);
  }

  .mk-hero-connect {
    animation: none;
  }

  .mk-hero-ground {
    opacity: 1;
    animation: none;
  }

  .mk-hero-particle {
    display: none;
  }

  .mk-hero-task-strike:after {
    width: 0;
  }

  .mk-hero-doc-line {
    opacity: 1;
    transform: scaleX(1);
  }

  .mk-hero-task-check-svg {
    stroke-dashoffset: 22px;
    opacity: 0;
  }
}

.mk-reveal {
  opacity: 0;
  transition: opacity 1s, transform 1s;
  transform: translateY(24px);
}

.mk-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.mk-delay-1 {
  transition-delay: .1s;
}

.mk-delay-2 {
  transition-delay: .2s;
}

.mk-delay-3 {
  transition-delay: .3s;
}

.mk-delay-4 {
  transition-delay: .4s;
}

.mk-delay-5 {
  transition-delay: .5s;
}

.mk-hero-immersive {
  padding-bottom: 108px;
  position: relative;
  overflow: visible;
}

@media (min-width: 768px) {
  .mk-hero-immersive {
    padding-bottom: 128px;
  }
}

@media (min-width: 1024px) {
  .mk-hero-immersive {
    padding-bottom: 164px;
  }
}

.mk-hero-backdrop {
  z-index: 0;
  pointer-events: none;
  -webkit-mask-composite: source-over;
  -webkit-mask-composite: source-over;
  background: radial-gradient(60% 50% at 22% 10%, #f8b97821 0%, #0000 70%), radial-gradient(50% 45% at 78% 8%, #a0c8fa17 0%, #0000 65%), radial-gradient(at 80% 70%, #0f234180 0%, #0000 50%), radial-gradient(at 25% 40%, #1c325059 0%, #0000 45%), radial-gradient(100% 40% at 50% 105%, #f8a0541a 0%, #0000 70%), linear-gradient(168deg, #0b1624 0%, #070e1a 45%, #030810 100%);
  position: absolute;
  inset: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(#000, #000), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L1440,0 L1440,10 Q1080,80 720,40 Q360,0 0,100 Z' fill='white'/%3E%3C/svg%3E");
  mask-image: linear-gradient(#000, #000), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L1440,0 L1440,10 Q1080,80 720,40 Q360,0 0,100 Z' fill='white'/%3E%3C/svg%3E");
  -webkit-mask-position: top, bottom;
  mask-position: top, bottom;
  -webkit-mask-size: 100% calc(100% - 58px), 100% 60px;
  mask-size: 100% calc(100% - 58px), 100% 60px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-composite: source-over;
  mask-composite: add;
}

@media (min-width: 768px) {
  .mk-hero-backdrop {
    -webkit-mask-size: 100% calc(100% - 78px), 100% 80px;
    mask-size: 100% calc(100% - 78px), 100% 80px;
  }
}

@media (min-width: 1024px) {
  .mk-hero-backdrop {
    -webkit-mask-size: 100% calc(100% - 98px), 100% 100px;
    mask-size: 100% calc(100% - 98px), 100% 100px;
  }
}

.mk-hero-backdrop:after {
  content: "";
  pointer-events: none;
  background: radial-gradient(at 40% 45%, #0000 35%, #02050a80 100%);
  position: absolute;
  inset: 0;
}

.mk-hero-grain {
  z-index: 1;
  pointer-events: none;
  opacity: .07;
  mix-blend-mode: overlay;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-hero-grain svg {
  width: 100%;
  height: 100%;
}

.mk-hero-nebula {
  z-index: 2;
  pointer-events: none;
  position: absolute;
  inset: -10%;
  overflow: hidden;
}

.mk-hero-blob {
  pointer-events: none;
  will-change: transform;
  border-radius: 50%;
  position: absolute;
}

.mk-hero-blob-1 {
  background: radial-gradient(65% 55% at 65% 45%, #f8a55a29 0%, #f8964b17 20%, #dc8c460a 40%, #c8783c04 60%, #0000 80%);
  width: 70%;
  height: 80%;
  animation: 36s cubic-bezier(.37, 0, .63, 1) infinite alternate mk-wisp-1;
  top: 5%;
  right: -8%;
}

.mk-hero-blob-2 {
  background: radial-gradient(60% 60% at 55% 55%, #12326438 0%, #0f28501f 22%, #0a1e410d 42%, #0000 65%);
  width: 65%;
  height: 70%;
  animation: 44s cubic-bezier(.37, 0, .63, 1) infinite alternate mk-wisp-2;
  bottom: -5%;
  right: -5%;
}

.mk-hero-blob-3 {
  background: radial-gradient(70% 40% at 65%, #f8aa6414 0%, #1e3c640f 25%, #142d5006 50%, #0000 72%);
  width: 80%;
  height: 45%;
  animation: 32s cubic-bezier(.37, 0, .63, 1) infinite alternate mk-wisp-3;
  top: 25%;
  left: 15%;
}

.mk-hero-blob-4 {
  background: radial-gradient(50% 50% at 50% 45%, #193c731f 0%, #14325f0f 25%, #0f284b05 50%, #0000 70%);
  width: 45%;
  height: 50%;
  animation: 28s cubic-bezier(.37, 0, .63, 1) infinite alternate mk-wisp-4;
  top: -8%;
  right: 5%;
}

@keyframes mk-wisp-1 {
  0% {
    opacity: .55;
    transform: translate(0)scale(1);
  }

  40% {
    opacity: .85;
  }

  100% {
    opacity: .5;
    transform: translate(-40px, 25px)scale(1.08);
  }
}

@keyframes mk-wisp-2 {
  0% {
    opacity: .5;
    transform: translate(0)scale(1);
  }

  50% {
    opacity: .8;
  }

  100% {
    opacity: .55;
    transform: translate(-20px, -30px)scale(1.06);
  }
}

@keyframes mk-wisp-3 {
  0% {
    opacity: .4;
    transform: translate(0)scaleX(1);
  }

  50% {
    opacity: .75;
  }

  100% {
    opacity: .35;
    transform: translate(-50px, 10px)scaleX(1.1);
  }
}

@keyframes mk-wisp-4 {
  0% {
    opacity: .45;
    transform: translate(0)scale(1);
  }

  50% {
    opacity: .7;
  }

  100% {
    opacity: .5;
    transform: translate(-15px, 20px)scale(1.05);
  }
}

.mk-hero-haze {
  z-index: 2;
  pointer-events: none;
  background: radial-gradient(40% 25%, #f8aa6417 0%, #f8a0540a 40%, #0000 70%) 0 0 / 180% 200%, radial-gradient(20% 45%, #193c6e1a 0%, #122d550d 40%, #0000 70%) 0 0 / 160% 250%, radial-gradient(55% 30%, #dc96500f 0%, #c8824106 45%, #0000 75%) 0 0 / 220% 180%, radial-gradient(25% 30%, #1437691a 0%, #0f28500a 45%, #0000 70%) 0 0 / 140% 190%, radial-gradient(50% 40%, #f8b4780b 0%, #f8a56405 40%, #0000 70%) 0 0 / 200% 220%;
  animation: 50s cubic-bezier(.37, 0, .63, 1) infinite mk-haze-drift;
  position: absolute;
  inset: 0;
}

@keyframes mk-haze-drift {
  0% {
    background-position: 80% 20%, 20% 80%, 10%, 75% 30%, 50% 60%;
  }

  25% {
    background-position: 30% 60%, 70% 30%, 60% 20%, 25% 70%, 80% 35%;
  }

  50% {
    background-position: 60% 80%, 40% 60%, 85% 70%, 55% 20%, 20% 75%;
  }

  75% {
    background-position: 20% 40%, 80% 45%, 35% 85%, 70% 60%, 60% 25%;
  }

  100% {
    background-position: 80% 20%, 20% 80%, 10%, 75% 30%, 50% 60%;
  }
}

.mk-hero-washes {
  z-index: 3;
  pointer-events: none;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-hero-washes:before {
  content: "";
  transform-origin: 50% 0;
  will-change: transform;
  background: radial-gradient(70% 50% at 50% 15%, #f8b9781f 0%, #f8a55f0f 25%, #f8a05405 50%, #0000 72%);
  width: 65%;
  height: 110%;
  animation: 26s cubic-bezier(.37, 0, .63, 1) infinite mk-wash-warm;
  position: absolute;
  top: -20%;
  left: -5%;
}

.mk-hero-washes:after {
  content: "";
  transform-origin: 50% 0;
  will-change: transform;
  background: radial-gradient(55% 45% at 50% 18%, #a0c8fa1a 0%, #82afe60d 25%, #6496d205 50%, #0000 68%);
  width: 55%;
  height: 105%;
  animation: 32s cubic-bezier(.37, 0, .63, 1) infinite mk-wash-cool;
  position: absolute;
  top: -15%;
  right: -5%;
}

@keyframes mk-wash-warm {
  0% {
    opacity: .6;
    transform: rotate(-1deg)translateX(0);
  }

  25% {
    opacity: .85;
  }

  50% {
    opacity: .7;
    transform: rotate(1.5deg)translateX(15px);
  }

  75% {
    opacity: .9;
  }

  100% {
    opacity: .6;
    transform: rotate(-1deg)translateX(0);
  }
}

@keyframes mk-wash-cool {
  0% {
    opacity: .5;
    transform: rotate(1deg)translateX(0);
  }

  50% {
    opacity: .8;
    transform: rotate(-1.5deg)translateX(-12px);
  }

  100% {
    opacity: .5;
    transform: rotate(1deg)translateX(0);
  }
}

.mk-hero-region {
  z-index: 2;
  position: relative;
  overflow: clip visible;
}

.mk-hero-dust {
  z-index: 4;
  pointer-events: none;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-mask-image: linear-gradient(#000 0% 92%, #0000 100%);
  mask-image: linear-gradient(#000 0% 92%, #0000 100%);
}

.mk-mockup-shimmer {
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(115deg, #0000 20%, #ffffff0a 35%, #ffffff1a 43%, #f8d2a012 47%, #ffffff24 50%, #f8d2a012 53%, #ffffff1a 57%, #ffffff0a 65%, #0000 80%) 0 0 / 400% 100%;
  border-radius: 10px;
  animation: 16s linear 2s infinite mk-mockup-shimmer-sweep;
  position: absolute;
  inset: 0;
}

@keyframes mk-mockup-shimmer-sweep {
  0% {
    background-position: 300% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.mk-mockup-sheen {
  z-index: 4;
  pointer-events: none;
  opacity: 1;
  background: linear-gradient(105deg, #0000 0%, #ffffff05 35%, #ffffff14 42%, #f8d2a00f 46%, #ffffff24 50%, #f8d2a00f 54%, #ffffff14 58%, #ffffff05 65%, #0000 100%) -30% 0 / 250% 100%;
  border-radius: 10px;
  transition: background-position 1s, opacity .4s .7s;
  position: absolute;
  inset: 0;
}

.mk-hero-mockup-shell:hover .mk-mockup-sheen {
  opacity: 1;
  background-position: 130% 0;
  transition: background-position 1s, opacity .1s;
}

.mk-hero-product-frame {
  position: relative;
}

.mk-hero-headline-lit {
  color: #f0f2f5;
}

.mk-hero-headline-lit .text-accent {
  color: #0000;
  -webkit-text-fill-color: transparent;
  background: linear-gradient(145deg, #f0c878 0%, #fad898 35%, #e8b460 65%, #f4cc88 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.mk-hero-headline-lit .mk-hero-dim {
  color: #dcdad799;
}

.mk-hero-product-wrap {
  z-index: 10;
  margin-bottom: -80px;
  position: relative;
}

@media (min-width: 640px) {
  .mk-hero-product-wrap {
    margin-bottom: -120px;
  }
}

.mk-hero-product-frame {
  border: 1px solid #ffffff0f;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 8px #00000026, 0 16px 32px #0003, 0 48px 96px #00000040;
}

.mk-hero-product-frame img {
  width: 100%;
  display: block;
}

.mk-hero-mockup-3d {
  perspective: 1000px;
  margin-top: -50px;
  margin-bottom: -70px;
  margin-right: -140px;
  animation: 14s cubic-bezier(.37, 0, .63, 1) infinite mk-mockup-showcase;
  position: relative;
}

.mk-hero-mockup-3d:hover {
  animation-play-state: paused;
}

@keyframes mk-mockup-showcase {
  0% {
    transform: translateY(0)rotateZ(0);
  }

  25% {
    transform: translateY(-6px)rotateZ(.3deg);
  }

  50% {
    transform: translateY(0)rotateZ(0);
  }

  75% {
    transform: translateY(4px)rotateZ(-.2deg);
  }

  100% {
    transform: translateY(0)rotateZ(0);
  }
}

@media (min-width: 1280px) {
  .mk-hero-mockup-3d {
    margin-right: -200px;
  }
}

.mk-hero-mockup-shell {
  transform-origin: 0;
  isolation: isolate;
  border-radius: 12px;
  padding: 2px;
  transition: transform 1s, box-shadow 1s;
  position: relative;
  overflow: hidden;
  transform: rotateY(-14deg)rotateX(3deg)scale(1.18);
  box-shadow: -6px 6px 16px #0000004d, -16px 16px 40px #00000059, -32px 32px 80px #00000040, 0 0 15px #f8a05426, 0 0 50px #f8a05414, 0 0 100px #f8a0540a;
}

.mk-hero-mockup-shell:before {
  content: "";
  z-index: 0;
  background: conic-gradient(#f8a054d9, #ffdcb44d, #f8a05426, #ffffff0d, #f8a0541a, #ffffff08, #f8a05499, #ffdcb440, #f8a054d9);
  width: 200%;
  height: 200%;
  animation: 10s linear infinite mk-mockup-border-spin;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes mk-mockup-border-spin {
  from {
    transform: translate(-50%, -50%)rotate(0);
  }

  to {
    transform: translate(-50%, -50%)rotate(360deg);
  }
}

.mk-hero-mockup-shell img {
  z-index: 1;
  border-radius: 10px;
  width: 100%;
  display: block;
  position: relative;
}

.mk-hero-mockup-shell:after {
  content: "";
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(90deg, #0000 5%, #fff3 20%, #fff6 50%, #fff3 80%, #0000 95%);
  border-radius: 10px 10px 0 0;
  height: 1px;
  position: absolute;
  top: 2px;
  left: 2px;
  right: 2px;
}

.mk-hero-mockup-shell:hover {
  transform: rotateY(-8deg)rotateX(2deg)scale(1.18);
  box-shadow: -4px 4px 12px #00000040, -12px 12px 32px #0000004d, -24px 24px 64px #0003, 0 0 20px #f8a05433, 0 0 60px #f8a0541f, 0 0 120px #f8a0540f;
}

.mk-hero-mockup-glow {
  pointer-events: none;
  background: radial-gradient(60% 55% at 55%, #f8a05424 0%, #f8964614 20%, #f88c3c0a 40%, #121e2c08 55%, #0000 72%);
  width: 140%;
  height: 110%;
  animation: 18s cubic-bezier(.37, 0, .63, 1) infinite mk-mockup-glow-breathe;
  position: absolute;
  bottom: -20%;
  left: -20%;
}

@keyframes mk-mockup-glow-breathe {
  0%, 100% {
    opacity: .5;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.1);
  }
}

.mk-hero-btn {
  isolation: isolate;
  cursor: pointer;
  border-radius: 12px;
  padding: 1px;
  text-decoration: none;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.mk-hero-btn:before {
  content: "";
  aspect-ratio: 1;
  z-index: 0;
  will-change: transform;
  width: 300%;
  position: absolute;
  top: 50%;
  left: 50%;
}

@keyframes mk-btn-spin {
  from {
    transform: translate(-50%, -50%)rotate(0);
  }

  to {
    transform: translate(-50%, -50%)rotate(360deg);
  }
}

.mk-hero-btn-inner {
  z-index: 1;
  border-radius: 11px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 14px 32px;
  font-size: .95rem;
  font-weight: 600;
  transition: background .3s cubic-bezier(.22, 1, .36, 1), color .25s, box-shadow .3s cubic-bezier(.22, 1, .36, 1), transform .2s cubic-bezier(.22, 1, .36, 1);
  display: inline-flex;
  position: relative;
}

.mk-hero-btn-primary:before {
  background: conic-gradient(#0000 0% 68%, #ffdcaa4d 74%, #fff0c899 80%, #ffdcaa4d 86%, #0000 92% 100%);
  animation: 5s linear infinite mk-btn-spin;
}

.mk-hero-btn-primary:after {
  content: "";
  z-index: 3;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(to right, #0000, #ffffff0d 30%, #ffffff1f 50%, #ffffff0d 70%, #0000);
  width: 25%;
  height: 200%;
  transition: none;
  position: absolute;
  top: -50%;
  left: -15%;
  transform: skewX(-20deg)translateX(-200%);
}

.mk-hero-btn-primary:hover:after {
  opacity: 1;
  transition: transform .75s cubic-bezier(.23, 1, .32, 1), opacity .1s;
  transform: skewX(-20deg)translateX(500%);
}

.mk-hero-btn-primary .mk-hero-btn-inner {
  background: linear-gradient(170deg, var(--color-accent) 0%, #e8924a 100%);
  color: var(--color-primary);
  box-shadow: inset 0 1px #fff3, inset 0 -1px #0000001a, 0 2px 4px #f8a05433, 0 4px 12px #f8a05426, 0 8px 24px #f8a05414;
}

.mk-hero-btn-primary .mk-hero-btn-inner:before {
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, #0000, #ffffff40 25%, #ffffff59 50%, #ffffff40 75%, #0000);
  height: 1px;
  transition: opacity .3s;
  position: absolute;
  top: 0;
  left: 8%;
  right: 8%;
}

.mk-hero-btn-primary:hover .mk-hero-btn-inner {
  background: linear-gradient(170deg, var(--color-accent-hover) 0%, #d88540 100%);
  transform: translateY(-1px);
  box-shadow: inset 0 1px #ffffff40, inset 0 -1px #00000014, 0 4px 8px #f8a05440, 0 8px 20px #f8a0542e, 0 16px 40px #f8a0541a;
}

.mk-hero-btn-primary:hover .mk-hero-btn-inner:before {
  opacity: 1.3;
}

.mk-hero-btn-primary:active .mk-hero-btn-inner {
  background: linear-gradient(170deg, #d88540 0%, #c87838 100%);
  transition-duration: 60ms;
  transform: translateY(0)scale(.975);
  box-shadow: inset 0 2px 4px #00000026, inset 0 1px 2px #0000001a, 0 1px 3px #f8a05426;
}

.mk-hero-btn-primary:active .mk-hero-btn-inner:before {
  opacity: .4;
  transition-duration: 60ms;
}

.mk-hero-btn-primary {
  animation: 6s ease-in-out infinite mk-primary-breathe;
}

@keyframes mk-primary-breathe {
  0%, 100% {
    box-shadow: 0 0 12px #f8a0541a, 0 0 40px #f8a0540a;
  }

  50% {
    box-shadow: 0 0 20px #f8a0542e, 0 0 60px #f8a0540f;
  }
}

.mk-hero-btn-primary:hover {
  animation: none;
  box-shadow: 0 0 24px #f8a05438, 0 0 72px #f8a05414;
}

.mk-hero-btn-ghost {
  background: linear-gradient(135deg, #0e1e310f, #0e1e3108);
  animation: 5s ease-in-out infinite mk-ghost-breathe;
}

@keyframes mk-ghost-breathe {
  0%, 100% {
    box-shadow: 0 0 0 .5px #0e1e310f, 0 2px 8px #0e1e310f;
  }

  50% {
    box-shadow: 0 0 0 .5px #0e1e311a, 0 0 16px #f8a05408, 0 2px 8px #0e1e310f;
  }
}

.mk-hero-btn-ghost:before {
  background: conic-gradient(#0000 0% 70%, #f8a0541a 76%, #f8a05438 80%, #f8a0541a 84%, #0000 90% 100%);
  animation: 4s linear infinite mk-btn-spin;
}

.mk-hero-btn-ghost:after {
  content: "";
  z-index: 3;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(to right, #0000, #f8a05408 30%, #f8a05414 50%, #f8a05408 70%, #0000);
  width: 25%;
  height: 200%;
  transition: none;
  position: absolute;
  top: -50%;
  left: -15%;
  transform: skewX(-20deg)translateX(-200%);
}

.mk-hero-btn-ghost:hover:after {
  opacity: 1;
  transition: transform .75s cubic-bezier(.23, 1, .32, 1), opacity .1s;
  transform: skewX(-20deg)translateX(500%);
}

.mk-hero-btn-ghost .mk-hero-btn-inner {
  color: #ffffffbf;
  letter-spacing: .01em;
  background: linear-gradient(170deg, #0e1e31eb 0%, #0a1626f2 100%);
  box-shadow: inset 0 1px #ffffff14, inset 0 -1px #00000026, 0 1px 3px #0e1e311f, 0 4px 12px #0e1e3114;
}

.mk-hero-btn-ghost .mk-hero-btn-inner:before {
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, #0000, #ffffff0f 20%, #ffffff1f 50%, #ffffff0f 80%, #0000);
  height: 1px;
  transition: opacity .3s;
  position: absolute;
  top: 0;
  left: 8%;
  right: 8%;
}

.mk-hero-btn-ghost:hover {
  animation: none;
  box-shadow: 0 0 0 .5px #f8a0541f, 0 0 16px #f8a0540a, 0 4px 16px #0e1e311f;
}

.mk-hero-btn-ghost:hover .mk-hero-btn-inner {
  color: #fffffff2;
  background: linear-gradient(170deg, #122236eb 0%, #0e1c2ef2 100%);
  transform: translateY(-1px);
  box-shadow: inset 0 1px #ffffff1f, inset 0 -1px #0000001f, 0 2px 6px #0e1e3126, 0 8px 24px #0e1e311a;
}

.mk-hero-btn-ghost:hover .mk-hero-btn-inner:before {
  opacity: 1.5;
}

.mk-hero-btn-ghost:hover:before {
  background: conic-gradient(#0000 0% 65%, #f8a05429 73%, #f8a05459 80%, #f8a05429 87%, #0000 93% 100%);
}

.mk-hero-btn-ghost:active {
  animation: none;
  box-shadow: 0 0 0 .5px #0e1e3114, 0 1px 2px #0e1e311f;
}

.mk-hero-btn-ghost:active .mk-hero-btn-inner {
  color: #ffffff8c;
  background: linear-gradient(170deg, #08121ef5 0%, #060e18fa 100%);
  transition-duration: 60ms;
  transform: translateY(0)scale(.975);
  box-shadow: inset 0 2px 6px #0003, inset 0 1px 2px #00000026;
}

.mk-hero-btn-ghost:active .mk-hero-btn-inner:before {
  opacity: .3;
  transition-duration: 60ms;
}

.mk-hero-btn-outline {
  background: none;
  transition: box-shadow .3s cubic-bezier(.22, 1, .36, 1), transform .2s cubic-bezier(.22, 1, .36, 1);
  box-shadow: inset 0 0 0 1px #ffffff1f;
}

.mk-hero-btn-outline:before, .mk-hero-btn-outline:after {
  display: none;
}

.mk-hero-btn-outline .mk-hero-btn-inner {
  color: #ffffffa6;
  letter-spacing: .01em;
  box-shadow: none;
  -webkit-backdrop-filter: blur(12px);
  background: linear-gradient(170deg, #ffffff0a 0%, #ffffff05 100%);
}

.mk-hero-btn-outline .mk-hero-btn-inner:before {
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, #0000, #ffffff0f 25%, #ffffff1a 50%, #ffffff0f 75%, #0000);
  height: 1px;
  transition: opacity .3s;
  position: absolute;
  top: 0;
  left: 12%;
  right: 12%;
}

.mk-hero-btn-outline:hover {
  box-shadow: inset 0 0 0 1px #ffffff38;
}

.mk-hero-btn-outline:hover .mk-hero-btn-inner {
  color: #ffffffeb;
  background: linear-gradient(170deg, #ffffff12 0%, #ffffff0a 100%);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px #0000001f, 0 8px 24px #0000000f;
}

.mk-hero-btn-outline:hover .mk-hero-btn-inner:before {
  opacity: 1.4;
}

.mk-hero-btn-outline:active {
  box-shadow: inset 0 0 0 1px #ffffff14;
}

.mk-hero-btn-outline:active .mk-hero-btn-inner {
  color: #ffffff80;
  background: linear-gradient(170deg, #ffffff05 0%, #00000005 100%);
  transition-duration: 60ms;
  transform: translateY(0)scale(.975);
  box-shadow: inset 0 1px 4px #00000026;
}

.mk-hero-btn-outline:active .mk-hero-btn-inner:before {
  opacity: .3;
  transition-duration: 60ms;
}

.mk-hero-btn-outline.on-light {
  box-shadow: inset 0 0 0 1px #0e1e311f;
}

.mk-hero-btn-outline.on-light .mk-hero-btn-inner {
  color: #0e1e3199;
  -webkit-backdrop-filter: blur(8px);
  background: linear-gradient(170deg, #0e1e3108 0%, #0e1e3103 100%);
}

.mk-hero-btn-outline.on-light .mk-hero-btn-inner:before {
  background: linear-gradient(90deg, #0000, #0e1e310a 25%, #0e1e310f 50%, #0e1e310a 75%, #0000);
}

.mk-hero-btn-outline.on-light:hover {
  box-shadow: inset 0 0 0 1px #0e1e3138;
}

.mk-hero-btn-outline.on-light:hover .mk-hero-btn-inner {
  color: #0e1e31d9;
  background: linear-gradient(170deg, #0e1e310f 0%, #0e1e3108 100%);
  box-shadow: 0 2px 8px #0e1e3114, 0 8px 24px #0e1e310a;
}

.mk-hero-btn-outline.on-light:active {
  box-shadow: inset 0 0 0 1px #0e1e3114;
}

.mk-hero-btn-outline.on-light:active .mk-hero-btn-inner {
  color: #0e1e3173;
  background: linear-gradient(170deg, #0e1e3105 0%, #0e1e310a 100%);
}

@media (prefers-reduced-motion: reduce) {
  .mk-hero-btn:before, .mk-hero-btn-primary, .mk-hero-btn-ghost {
    animation: none !important;
  }

  .mk-hero-btn-ghost:hover:after, .mk-hero-btn-primary:hover:after {
    opacity: 0;
    transition: none;
    transform: skewX(-20deg)translateX(-200%);
  }
}

@media (max-width: 639px) {
  .mk-hero-btn-inner {
    padding: 12px 24px;
    font-size: .88rem;
  }
}

.mk-stage {
  border-radius: 16px;
  min-height: 420px;
  position: relative;
  overflow: hidden;
}

.mk-stage-img {
  border-radius: 16px;
  width: 100%;
  display: block;
}

@media (min-width: 1024px) {
  .mk-stage {
    min-height: 500px;
  }

  .mk-stage-img {
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: right center;
       object-position: right center;
    border-radius: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
  }

  .mk-stage-overlay {
    z-index: 1;
    background: linear-gradient(to right, #fafaf8f7 0%, #fafaf8e0 35%, #fafaf866 60%, #0000 80%);
    position: absolute;
    inset: 0;
  }

  .mk-stage-overlay-right {
    background: linear-gradient(to left, #fafaf8f7 0%, #fafaf8e0 35%, #fafaf866 60%, #0000 80%);
  }

  .mk-stage-card {
    z-index: 2;
    max-width: 480px;
    padding: 3rem 2.5rem;
    position: relative;
  }

  .mk-stage-card-right {
    margin-left: auto;
  }

  .mk-stage-right .mk-stage-img {
    -o-object-position: left center;
       object-position: left center;
  }
}

@media (max-width: 1023px) {
  .mk-stage {
    min-height: auto;
  }

  .mk-stage-img {
    border-radius: 12px;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 16px #0e1e310f;
  }

  .mk-stage-overlay {
    display: none;
  }

  .mk-stage-card {
    padding: 0 .5rem;
  }
}

.mk-reveal-section {
  background: var(--color-surface);
  position: relative;
  overflow: hidden;
}

.mk-reveal-dust {
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-reveal-dust-back {
  z-index: 1;
}

.mk-reveal-dust-front {
  z-index: 6;
}

.mk-reveal-atmosphere {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  inset: 0;
}

.mk-reveal-atmo-1 {
  filter: blur(80px);
  background: radial-gradient(#f8a0540d 0%, #0000 70%);
  width: 90%;
  height: 45%;
  animation: 9s cubic-bezier(.45, 0, .55, 1) infinite mk-ratmo-breathe;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.mk-reveal-atmo-2 {
  filter: blur(100px);
  background: radial-gradient(70% 50%, #f8a0540a 0%, #0000 65%);
  width: 100%;
  height: 55%;
  animation: 11s cubic-bezier(.45, 0, .55, 1) 3s infinite mk-ratmo-breathe;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
}

.mk-reveal-atmo-3 {
  filter: blur(60px);
  background: radial-gradient(#0e1e3104 0%, #0000 60%);
  width: 120%;
  height: 30%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

@keyframes mk-ratmo-breathe {
  0%, 100% {
    opacity: .5;
    transform: translateX(-50%)scale(1);
  }

  50% {
    opacity: 1;
    transform: translateX(-50%)scale(1.06);
  }
}

.mk-reveal-grain {
  pointer-events: none;
  z-index: 1;
  opacity: .012;
  mix-blend-mode: multiply;
  position: absolute;
  inset: 0;
}

.mk-reveal-grain svg {
  width: 100%;
  height: 100%;
  display: block;
}

.mk-reveal-texture {
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  animation: 2s .3s forwards mk-texture-fadein;
  position: absolute;
  inset: 0;
}

.mk-reveal-texture:before {
  content: "";
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E") 0 0 / 300px 300px;
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(#0000 0% 5%, #00000014 12%, #00000040 22%, #0009 35%, #000 50% 65%, #00000080 80%, #0000 100%);
  mask-image: linear-gradient(#0000 0% 5%, #00000014 12%, #00000040 22%, #0009 35%, #000 50% 65%, #00000080 80%, #0000 100%);
}

@keyframes mk-texture-fadein {
  to {
    opacity: 1;
  }
}

.mk-reveal-rays {
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  width: 140%;
  height: 70%;
  animation: 3s .8s forwards mk-rays-fadein;
  position: absolute;
  top: 0;
  left: 50%;
  overflow: hidden;
  transform: translateX(-50%);
}

@keyframes mk-rays-fadein {
  to {
    opacity: 1;
  }
}

.mk-reveal-ray {
  transform-origin: bottom;
  background: linear-gradient(#0000 0%, #f8a05408 30%, #f8a0540d 60%, #f8a05405 85%, #0000 100%);
  width: 1px;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 50%;
}

.mk-reveal-ray-1 {
  opacity: .7;
  transform: translateX(-50%)rotate(-22deg);
}

.mk-reveal-ray-2 {
  opacity: .9;
  transform: translateX(-50%)rotate(-11deg);
}

.mk-reveal-ray-3 {
  opacity: 1;
  transform: translateX(-50%)rotate(-3deg);
}

.mk-reveal-ray-4 {
  opacity: 1;
  transform: translateX(-50%)rotate(3deg);
}

.mk-reveal-ray-5 {
  opacity: .9;
  transform: translateX(-50%)rotate(11deg);
}

.mk-reveal-ray-6 {
  opacity: .7;
  transform: translateX(-50%)rotate(22deg);
}

.mk-reveal-ray-1, .mk-reveal-ray-3, .mk-reveal-ray-5 {
  animation: 10s cubic-bezier(.45, 0, .55, 1) infinite mk-ray-breathe;
}

.mk-reveal-ray-2, .mk-reveal-ray-4, .mk-reveal-ray-6 {
  animation: 10s cubic-bezier(.45, 0, .55, 1) 5s infinite mk-ray-breathe;
}

@keyframes mk-ray-breathe {
  0%, 100% {
    opacity: .5;
  }

  50% {
    opacity: 1;
  }
}

.mk-reveal-accents {
  pointer-events: none;
  z-index: 1;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-reveal-accent {
  opacity: 0;
  animation: 20s ease-in-out infinite mk-accent-drift;
  display: block;
  position: absolute;
}

.mk-ra-diamond {
  background: #f8a05426;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
}

.mk-ra-circle {
  background: #f8a0541f;
  border-radius: 50%;
  width: 5px;
  height: 5px;
}

.mk-ra-cross {
  background: none;
  width: 8px;
  height: 8px;
}

.mk-ra-cross:before, .mk-ra-cross:after {
  content: "";
  background: #0e1e3114;
  position: absolute;
}

.mk-ra-cross:before {
  width: 100%;
  height: 1px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.mk-ra-cross:after {
  width: 1px;
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.mk-ra-dot {
  background: #0e1e311a;
  border-radius: 50%;
  width: 3px;
  height: 3px;
}

.mk-ra-ring {
  background: none;
  border: 1px solid #f8a0541a;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.mk-ra-1 {
  animation-duration: 22s;
  animation-delay: 0s;
  top: 12%;
  left: 8%;
}

.mk-ra-2 {
  animation-duration: 18s;
  animation-delay: -4s;
  top: 8%;
  right: 12%;
}

.mk-ra-3 {
  animation-duration: 24s;
  animation-delay: -8s;
  top: 25%;
  left: 5%;
}

.mk-ra-4 {
  animation-duration: 20s;
  animation-delay: -2s;
  top: 35%;
  right: 7%;
}

.mk-ra-5 {
  animation-duration: 26s;
  animation-delay: -12s;
  top: 50%;
  left: 4%;
}

.mk-ra-6 {
  animation-duration: 19s;
  animation-delay: -6s;
  top: 45%;
  right: 5%;
}

.mk-ra-7 {
  animation-duration: 21s;
  animation-delay: -15s;
  top: 60%;
  left: 9%;
}

.mk-ra-8 {
  animation-duration: 25s;
  animation-delay: -3s;
  top: 70%;
  right: 10%;
}

.mk-ra-9 {
  animation-duration: 23s;
  animation-delay: -10s;
  top: 18%;
  left: 14%;
}

.mk-ra-10 {
  animation-duration: 17s;
  animation-delay: -7s;
  top: 55%;
  right: 14%;
}

.mk-ra-11 {
  animation-duration: 28s;
  animation-delay: -1s;
  top: 30%;
  left: 11%;
}

.mk-ra-12 {
  animation-duration: 22s;
  animation-delay: -9s;
  top: 65%;
  right: 9%;
}

@keyframes mk-accent-drift {
  0% {
    opacity: 0;
    transform: translateY(0)translateX(0);
  }

  10% {
    opacity: .8;
  }

  50% {
    opacity: .6;
    transform: translateY(-15px)translateX(6px);
  }

  90% {
    opacity: .8;
  }

  100% {
    opacity: 0;
    transform: translateY(-30px)translateX(-4px);
  }
}

.mk-ra-diamond.mk-reveal-accent {
  animation-name: mk-accent-drift-diamond;
}

@keyframes mk-accent-drift-diamond {
  0% {
    opacity: 0;
    transform: rotate(45deg)translateY(0)translateX(0);
  }

  10% {
    opacity: .8;
  }

  50% {
    opacity: .6;
    transform: rotate(45deg)translateY(-15px)translateX(6px);
  }

  90% {
    opacity: .8;
  }

  100% {
    opacity: 0;
    transform: rotate(45deg)translateY(-30px)translateX(-4px);
  }
}

@media (max-width: 767px) {
  .mk-reveal-accents {
    opacity: .6;
    transform: scale(.6);
  }

  .mk-reveal-rays {
    opacity: .4;
  }
}

.mk-reveal-declaration {
  z-index: 8;
  padding: 3.5rem 0 3rem;
  position: relative;
}

@media (min-width: 1024px) {
  .mk-reveal-declaration {
    padding: 5rem 0 3.5rem;
  }
}

.mk-reveal-eyebrow {
  align-items: center;
  gap: 14px;
  display: inline-flex;
}

.mk-reveal-eyebrow-line {
  background: linear-gradient(90deg, transparent, var(--color-accent), transparent);
  opacity: 0;
  width: 0;
  height: 1px;
  transition: width 1.2s cubic-bezier(.16, 1, .3, 1) .2s, opacity .8s .2s;
  display: block;
}

.mk-reveal.is-visible .mk-reveal-eyebrow-line {
  opacity: .6;
  width: 48px;
}

@media (min-width: 1024px) {
  .mk-reveal.is-visible .mk-reveal-eyebrow-line {
    width: 72px;
  }
}

.mk-reveal-eyebrow-label {
  text-transform: uppercase;
  letter-spacing: .25em;
  color: var(--color-accent);
  text-shadow: 0 0 24px #f8a05400;
  font-size: .6rem;
  font-weight: 600;
  transition: text-shadow 1s .4s;
}

.mk-reveal.is-visible .mk-reveal-eyebrow-label {
  text-shadow: 0 0 24px #f8a05433;
}

.mk-reveal-headline {
  font-family: var(--font-heading);
  letter-spacing: -.02em;
  color: var(--color-heading);
  font-size: 2.8rem;
  font-weight: 400;
  line-height: 1.04;
}

@media (min-width: 768px) {
  .mk-reveal-headline {
    font-size: 3.8rem;
  }
}

@media (min-width: 1024px) {
  .mk-reveal-headline {
    font-size: 4.8rem;
  }
}

.mk-reveal-beat {
  opacity: 0;
  transition: opacity .7s cubic-bezier(.16, 1, .3, 1), transform .7s cubic-bezier(.16, 1, .3, 1);
  display: block;
  transform: translateY(18px);
}

.mk-reveal.is-visible .mk-reveal-beat-1 {
  opacity: 1;
  transition-delay: .1s;
  transform: none;
}

.mk-reveal.is-visible .mk-reveal-beat-2 {
  opacity: 1;
  transition-delay: .35s;
  transform: none;
}

.mk-reveal-keyword {
  color: var(--color-accent);
  text-shadow: 0 0 60px #f8a05400;
  transition: text-shadow 1.2s .5s;
  display: inline;
  position: relative;
}

.mk-reveal.is-visible .mk-reveal-keyword {
  text-shadow: 0 0 30px #f8a05426, 0 0 80px #f8a0540f;
}

.mk-reveal-keyword:after {
  content: "";
  background: linear-gradient(90deg, var(--color-accent), #f8a05433);
  border-radius: 1px;
  width: 0;
  height: 2px;
  transition: width .9s cubic-bezier(.16, 1, .3, 1) .8s;
  position: absolute;
  bottom: 4px;
  left: 0;
}

.mk-reveal.is-visible .mk-reveal-keyword:after {
  width: 100%;
}

.mk-reveal-subtext {
  color: var(--color-body);
  max-width: 620px;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1.75;
}

@media (min-width: 768px) {
  .mk-reveal-subtext {
    font-size: 1.05rem;
  }
}

.mk-reveal-btn {
  letter-spacing: .01em;
  white-space: nowrap;
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  padding: 13px 28px;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  transition: all .22s cubic-bezier(.16, 1, .3, 1);
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.mk-reveal-btn-primary {
  background: var(--color-accent);
  color: #fff;
  box-shadow: 0 1px 3px #f8a05433, 0 4px 16px #f8a0541f, inset 0 1px #ffffff26;
}

.mk-reveal-btn-primary:before {
  content: "";
  pointer-events: none;
  background: linear-gradient(105deg, #0000 30%, #ffffff1f 45%, #fff3 50%, #ffffff1f 55%, #0000 70%);
  width: 60%;
  height: 100%;
  transition: left .5s;
  position: absolute;
  top: 0;
  left: -100%;
}

.mk-reveal-btn-primary:hover:before {
  left: 130%;
}

.mk-reveal-btn-primary:hover {
  background: var(--color-accent-hover);
  transform: translateY(-1px);
  box-shadow: 0 2px 6px #f8a0544d, 0 8px 24px #f8a05426, 0 0 40px #f8a05414, inset 0 1px #fff3;
}

.mk-reveal-btn-primary svg {
  transition: transform .22s cubic-bezier(.16, 1, .3, 1);
}

.mk-reveal-btn-primary:hover svg {
  transform: translateX(3px);
}

.mk-reveal-btn-ghost {
  color: var(--color-heading);
  border: 1px solid var(--color-border);
  background: none;
}

.mk-reveal-btn-ghost:hover {
  background: #0e1e3108;
  border-color: #0e1e3126;
}

.mk-reveal-btn-ghost svg {
  transition: transform .22s cubic-bezier(.16, 1, .3, 1);
}

.mk-reveal-btn-ghost:hover svg {
  transform: translateX(2px);
}

.mk-reveal-product-zone {
  padding: 0 0 1.5rem;
  position: relative;
}

.mk-reveal-backlight {
  filter: blur(70px);
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(55% 45%, #f8a05412 0%, #0000 60%), radial-gradient(75% 55% at 50% 55%, #f8a05408 0%, #0000 70%);
  width: 85%;
  height: 90%;
  animation: 8s cubic-bezier(.45, 0, .55, 1) infinite mk-backlight-pulse;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes mk-backlight-pulse {
  0%, 100% {
    opacity: .6;
    transform: translate(-50%, -50%)scale(1);
  }

  50% {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1.05);
  }
}

.mk-reveal-showcase {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.25rem;
  position: relative;
}

@media (min-width: 768px) {
  .mk-reveal-showcase {
    padding: 0 2.5rem;
  }
}

.mk-reveal-hero-wrap {
  z-index: 2;
  position: relative;
}

.mk-reveal-hero-frame {
  opacity: 0;
  border-radius: 16px;
  transition: transform 1s cubic-bezier(.16, 1, .3, 1), opacity .9s cubic-bezier(.16, 1, .3, 1);
  position: relative;
  transform: scale(.94)translateY(28px);
}

.mk-reveal.is-visible .mk-reveal-hero-frame {
  opacity: 1;
  transform: scale(1)translateY(0);
}

.mk-border-glow {
  z-index: 0;
  opacity: 0;
  border-radius: 18px;
  transition: opacity 1.5s .6s;
  position: absolute;
  inset: -2px;
  overflow: hidden;
}

.mk-reveal.is-visible .mk-border-glow {
  opacity: 1;
}

.mk-border-glow:before {
  content: "";
  background: conic-gradient(#0000 0deg 55deg, #f8a05459 70deg, #f8aa5a8c 85deg, #f8b464bf 100deg, #f8aa5a8c 112deg, #f8a05459 125deg, #0000 140deg 235deg, #f8a05459 250deg, #f8aa5a8c 265deg, #f8b464bf 280deg, #f8aa5a8c 292deg, #f8a05459 305deg, #0000 320deg 360deg);
  animation: 8s linear infinite mk-border-rotate;
  position: absolute;
  inset: 0;
}

@keyframes mk-border-rotate {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

.mk-border-glow:after {
  content: "";
  background: var(--color-surface);
  border-radius: 16px;
  position: absolute;
  inset: 2px;
}

.mk-reveal-hero-img {
  z-index: 1;
  border-radius: 14px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 2px #0e1e310a, 0 4px 12px #0e1e310d, 0 16px 40px #0e1e310f, 0 32px 80px #0e1e310d, 0 0 0 1px #0e1e310f;
}

.mk-reveal-screenshot {
  z-index: 1;
  width: 100%;
  height: auto;
  display: block;
  position: relative;
}

.mk-reveal-img-shimmer {
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(115deg, #0000 20%, #ffffff05 35%, #ffffff0f 45%, #ffffff1a 50%, #ffffff0f 55%, #ffffff05 65%, #0000 80%) 0 0 / 300% 100%;
  animation: 12s cubic-bezier(.45, 0, .55, 1) 2s infinite mk-img-shimmer;
  position: absolute;
  inset: 0;
}

@keyframes mk-img-shimmer {
  0%, 100% {
    background-position: 200% 0;
  }

  50% {
    background-position: -100% 0;
  }
}

.mk-reveal-ground-shadow {
  z-index: 0;
  pointer-events: none;
  filter: blur(12px);
  background: radial-gradient(100% 100%, #0e1e3147 0%, #0e1e312e 35%, #0e1e3112 65%, #0000 100%);
  border-radius: 50%;
  width: 60%;
  height: 24px;
  position: absolute;
  bottom: -80px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-reveal-ground-shadow.is-visible {
  transform: translateX(-50%);
}

.mk-sat {
  z-index: 7;
  pointer-events: none;
  position: absolute;
}

.mk-sat-inner {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px #0e1e310f, 0 8px 24px #0e1e3114, 0 24px 48px #0e1e310f, 0 0 0 1px #0e1e310a;
}

.mk-sat-img {
  width: 100%;
  height: auto;
  display: block;
}

.mk-tasks {
  padding: .65rem;
  font-family: inherit;
}

.mk-tasks-header {
  border-bottom: 1px solid #0e1e310f;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: .45rem;
  padding: 0 .2rem .5rem;
  display: flex;
}

.mk-tasks-title {
  color: #1a2332;
  font-size: .65rem;
  font-weight: 700;
}

.mk-tasks-count {
  color: #94a3b8;
  font-size: .48rem;
  font-weight: 500;
}

.mk-tasks-list {
  flex-direction: column;
  gap: .3rem;
  display: flex;
}

.mk-task {
  opacity: 0;
  background: #fff;
  border: 1px solid #0e1e310f;
  border-radius: 6px;
  align-items: flex-start;
  gap: .4rem;
  padding: .4rem .45rem;
  display: flex;
  transform: translateY(8px);
}

.mk-task-overdue {
  background: #dc262605;
  border-color: #dc262633;
}

.mk-task-check {
  border: 1.5px solid #cbd5e1;
  border-radius: 3px;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  margin-top: 1px;
}

.mk-task-check-done {
  color: #fff;
  background: #3b82f6;
  border-color: #3b82f6;
  justify-content: center;
  align-items: center;
  display: flex;
}

.mk-task-body {
  flex: 1;
  min-width: 0;
}

.mk-task-name {
  color: #1e293b;
  font-size: .52rem;
  font-weight: 500;
  line-height: 1.3;
  display: block;
}

.mk-task-done .mk-task-name {
  color: #94a3b8;
  text-decoration: line-through;
}

.mk-task-meta {
  align-items: center;
  gap: .4rem;
  margin-top: .15rem;
  display: flex;
}

.mk-task-priority {
  border-radius: 3px;
  padding: .08rem .3rem;
  font-size: .42rem;
  font-weight: 600;
}

.mk-task-priority-medium {
  color: #ea580c;
  background: #ea580c14;
}

.mk-task-priority-high {
  color: #dc2626;
  background: #dc262614;
}

.mk-task-due {
  color: #94a3b8;
  align-items: center;
  gap: .2rem;
  font-size: .42rem;
  display: flex;
}

.mk-task-due-overdue {
  color: #dc2626;
  font-weight: 600;
}

.mk-task-done {
  background: #3b82f605;
  border-color: #0000;
  align-items: center;
}

.mk-reveal.is-visible .mk-task-stagger-1 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) .8s both mk-task-enter;
}

.mk-reveal.is-visible .mk-task-stagger-2 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1s both mk-task-enter;
}

.mk-reveal.is-visible .mk-task-stagger-3 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1.2s both mk-task-enter;
}

.mk-reveal.is-visible .mk-task-stagger-4 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1.4s both mk-task-enter;
}

.mk-reveal.is-visible .mk-task-stagger-5 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1.55s both mk-task-enter;
}

@keyframes mk-task-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-weather {
  padding: .55rem .65rem;
  font-family: inherit;
}

.mk-weather-header {
  border-bottom: 1px solid #0e1e310f;
  align-items: center;
  gap: .4rem;
  padding-bottom: .45rem;
  display: flex;
}

.mk-weather-icon {
  color: #b91c1c;
  background: #dc262614;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
}

.mk-weather-title {
  color: #1a2332;
  font-size: .55rem;
  font-weight: 700;
  line-height: 1.2;
  display: block;
}

.mk-weather-sub {
  color: #94a3b8;
  font-size: .4rem;
  line-height: 1.3;
  display: block;
}

.mk-weather-evidence {
  border-radius: 4px;
  flex-shrink: 0;
  margin-left: auto;
  padding: .12rem .4rem;
  font-size: .42rem;
  font-weight: 600;
}

.mk-weather-evidence-strong {
  color: #16a34a;
  background: #16a34a14;
}

.mk-weather-metrics {
  grid-template-columns: repeat(4, 1fr);
  gap: .35rem;
  padding-top: .5rem;
  display: grid;
}

.mk-weather-metric {
  text-align: center;
  opacity: 0;
  background: #0e1e3104;
  border-radius: 5px;
  padding: .3rem .15rem;
  transform: translateY(6px);
}

.mk-weather-metric-label {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #94a3b8;
  margin-bottom: .15rem;
  font-size: .38rem;
  font-weight: 600;
  display: block;
}

.mk-weather-metric-value {
  color: #1a2332;
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.1;
  display: block;
}

.mk-weather-metric-value small {
  color: #64748b;
  font-size: .45rem;
  font-weight: 500;
}

.mk-weather-metric-date {
  color: #94a3b8;
  margin-top: .1rem;
  font-size: .36rem;
  display: block;
}

.mk-reveal.is-visible .mk-weather-stagger-1 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1s both mk-weather-enter;
}

.mk-reveal.is-visible .mk-weather-stagger-2 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1.2s both mk-weather-enter;
}

.mk-reveal.is-visible .mk-weather-stagger-3 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1.4s both mk-weather-enter;
}

.mk-reveal.is-visible .mk-weather-stagger-4 {
  animation: .5s cubic-bezier(.16, 1, .3, 1) 1.6s both mk-weather-enter;
}

@keyframes mk-weather-enter {
  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-sat-ai {
  width: 34%;
  top: 0;
  bottom: 0;
  right: -2%;
}

.mk-reveal.mk-sat-ai {
  opacity: 1;
  transition: none;
  transform: none;
}

.mk-sat-ai .mk-sat-inner {
  opacity: 0;
  background: none;
  border-radius: 12px 14px 14px 12px;
  height: 100%;
  transition: opacity 1s cubic-bezier(.16, 1, .3, 1), transform 1s cubic-bezier(.16, 1, .3, 1);
  transform: translateX(100px);
  box-shadow: -6px 0 20px #0e1e311a, -2px 0 40px #0e1e310f, 0 8px 32px #0e1e311f;
}

.mk-sat-ai.is-visible .mk-sat-inner {
  opacity: 1;
  transition-delay: 2.5s;
  transform: translateX(0);
}

.mk-chat {
  color: #ffffffd9;
  -webkit-backdrop-filter: blur(12px);
  background: radial-gradient(60% 40% at 30% 0, #f8b97814 0%, #f8a05405 50%, #0000 75%), radial-gradient(50% 45% at 85% 5%, #a0c8fa0d 0%, #0000 65%), radial-gradient(at 50% 100%, #f8a0540a 0%, #0000 50%), linear-gradient(170deg, #1c1818f2 0%, #10131cf7 50%, #0b1018fa 100%);
  border-radius: 12px 14px 14px 12px;
  flex-direction: column;
  height: 100%;
  font-size: .65rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.mk-chat:before {
  content: "";
  opacity: .04;
  pointer-events: none;
  z-index: 0;
  border-radius: inherit;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='5' type='fractalNoise'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E");
  position: absolute;
  inset: 0;
}

.mk-chat:after {
  content: "";
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(60% 50% at 20% -10%, #f8b9780f 0%, #0000 65%), radial-gradient(50% 40% at 85% -15%, #a0c8fa08 0%, #0000 65%);
  width: 100%;
  height: 50%;
  animation: 10s ease-in-out infinite alternate mk-cs-ambient;
  position: absolute;
  top: 0;
  left: 0;
}

.mk-chat-header {
  z-index: 1;
  background: #ffffff06;
  border-bottom: 1px solid #ffffff0f;
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  padding: .6rem .8rem;
  display: flex;
  position: relative;
}

.mk-chat-header-left {
  align-items: center;
  gap: .5rem;
  display: flex;
}

.mk-chat-brand {
  color: #fff;
  letter-spacing: -.01em;
  font-size: .7rem;
  font-weight: 700;
}

.mk-chat-context {
  color: #ffffffad;
  letter-spacing: .02em;
  background: #f8a05412;
  border: 1px solid #f8a05424;
  border-radius: 4px;
  padding: .1rem .4rem;
  font-size: .55rem;
  font-weight: 500;
}

.mk-chat-header-actions {
  align-items: center;
  gap: .35rem;
  display: flex;
}

.mk-chat-icon-btn {
  color: #ffffff80;
  background: #ffffff0f;
  border: 1px solid #ffffff14;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
}

.mk-chat-conversation {
  z-index: 1;
  flex: 1;
  display: grid;
  position: relative;
  overflow: hidden;
}

.mk-chat-scene {
  opacity: 0;
  flex-direction: column;
  grid-area: 1 / 1;
  gap: .5rem;
  padding: 1rem .8rem;
  display: flex;
}

.mk-chat-scene-1 {
  --scene-delay: 4s;
}

.mk-chat-scene-2 {
  --scene-delay: 16s;
}

.mk-chat-scene-3 {
  --scene-delay: 28s;
}

.mk-chat-msg {
  opacity: 0;
  border-radius: 10px;
  max-width: 90%;
  padding: .5rem .7rem;
  font-size: .6rem;
  line-height: 1.5;
}

.mk-chat-msg-user {
  color: #fffffff2;
  background: #f8b9780f;
  border: 1px solid #f8a0541a;
  border-bottom-right-radius: 2px;
  align-self: flex-end;
  font-weight: 500;
  box-shadow: 0 1px 3px #00000029, 0 1px 2px #00000014;
}

.mk-chat-msg-text {
  display: block;
}

.mk-chat-msg-ai {
  color: #ffffffbf;
  background: #ffffff0d;
  border: 1px solid #ffffff14;
  border-bottom-left-radius: 2px;
  align-self: flex-start;
  box-shadow: 0 1px 4px #0003, 0 0 1px #ffffff0a;
}

.mk-chat-response-strong {
  color: #ffffffeb;
  font-weight: 600;
}

.mk-chat-thinking {
  opacity: 0;
  background: #ffffff0d;
  border: 1px solid #ffffff14;
  border-radius: 10px;
  align-self: flex-start;
  align-items: center;
  gap: .3rem;
  padding: .5rem .7rem;
  display: flex;
  box-shadow: 0 1px 4px #0003;
}

.mk-chat-spinner {
  border: 1.5px solid #f8b97840;
  border-top-color: #f8b978b3;
  border-radius: 50%;
  flex-shrink: 0;
  width: 9px;
  height: 9px;
}

.mk-sat-ai.is-visible .mk-chat-spinner {
  animation: .8s linear infinite mk-cs-spin;
}

.mk-chat-thinking-text {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #ffffff8c;
  font-size: .48rem;
  font-weight: 600;
}

.mk-sat-ai.is-visible .mk-chat-thinking-text {
  animation: 2s ease-in-out infinite mk-cs-think-pulse;
}

.mk-chat-activity {
  opacity: 0;
  flex-wrap: wrap;
  align-self: flex-start;
  gap: .3rem;
  display: flex;
}

.mk-chat-badge {
  color: #78d296;
  background: #47b37424;
  border: 1px solid #47b37440;
  border-radius: 999px;
  align-items: center;
  gap: .25rem;
  padding: .15rem .45rem;
  font-size: .48rem;
  font-weight: 500;
  display: inline-flex;
  box-shadow: 0 1px 2px #0000001f;
}

.mk-chat-badge-check {
  flex-shrink: 0;
  display: flex;
}

.mk-chat-badge-name {
  white-space: nowrap;
}

.mk-chat-email {
  opacity: 0;
  background: #00000029;
  border: 1px solid #ffffff17;
  border-left: 2px solid #f8a0542e;
  border-radius: 8px;
  flex-direction: column;
  align-self: flex-start;
  gap: .25rem;
  max-width: 95%;
  padding: .5rem .65rem;
  display: flex;
  box-shadow: 0 1px 3px #0000002e, 0 1px 1px #0000001a, inset 0 1px #ffffff0a;
}

.mk-chat-footer {
  z-index: 1;
  background: #ffffff09;
  border-top: 1px solid #ffffff0f;
  flex-direction: column;
  flex-shrink: 0;
  gap: .35rem;
  padding: .6rem .8rem;
  display: flex;
  position: relative;
  box-shadow: 0 -1px #ffffff0f, 0 -2px 1rem #0000001f;
}

.mk-chat-input {
  background: #ffffff0f;
  border: 1px solid #ffffff14;
  border-radius: 10px;
  overflow: hidden;
}

.mk-chat-input-text {
  color: #ffffff4d;
  padding: .45rem .6rem .15rem;
  font-size: .55rem;
  display: block;
}

.mk-chat-input-bar {
  justify-content: space-between;
  align-items: center;
  padding: 0 .5rem .35rem;
  display: flex;
}

.mk-chat-input-icons {
  color: #ffffff40;
  align-items: center;
  gap: .3rem;
  display: flex;
}

.mk-chat-input-hint {
  color: #fff3;
  font-size: .4rem;
}

.mk-chat-send {
  color: #0b1018d9;
  background: #fff;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 1.3rem;
  height: 1.3rem;
  display: flex;
  box-shadow: 0 1px 3px #0000002e;
}

.mk-chat-disclaimer {
  color: #ffffff38;
  text-align: center;
  font-size: .42rem;
}

.mk-chat-email-row {
  align-items: center;
  gap: .4rem;
  font-size: .5rem;
  line-height: 1.3;
  display: flex;
}

.mk-chat-email-label {
  color: #fff6;
  flex-shrink: 0;
  min-width: 2.6rem;
  font-weight: 500;
}

.mk-chat-email-value {
  color: #ffffffbf;
}

.mk-chat-email-body {
  color: #ffffff8c;
  border-top: 1px solid #ffffff0d;
  margin-top: .15rem;
  padding: .35rem 0;
  font-size: .48rem;
  line-height: 1.5;
}

.mk-chat-email-action {
  justify-content: flex-end;
  padding-top: .2rem;
  display: flex;
}

.mk-chat-email-btn {
  color: #fff;
  background: var(--color-accent);
  opacity: 0;
  border-radius: 5px;
  align-items: center;
  gap: .3rem;
  padding: .3rem .7rem;
  font-size: .5rem;
  font-weight: 600;
  display: inline-flex;
}

.mk-sat-ai.is-visible .mk-chat-scene {
  animation: mk-cs-scene 36s ease var(--scene-delay) infinite both;
}

.mk-sat-ai.is-visible .mk-cs-1 {
  animation: mk-cs-slot-1 36s ease var(--scene-delay) infinite both;
}

.mk-sat-ai.is-visible .mk-cs-2 {
  animation: mk-cs-slot-2 36s ease var(--scene-delay) infinite both;
}

.mk-sat-ai.is-visible .mk-cs-3 {
  animation: mk-cs-slot-3 36s ease var(--scene-delay) infinite both;
}

.mk-sat-ai.is-visible .mk-cs-4 {
  animation: mk-cs-slot-4 36s ease var(--scene-delay) infinite both;
}

.mk-sat-ai.is-visible .mk-cs-5 {
  animation: mk-cs-slot-5 36s ease var(--scene-delay) infinite both;
}

.mk-sat-ai.is-visible .mk-chat-scene-2 .mk-cs-5 {
  animation-name: mk-cs-slot-think2;
}

.mk-sat-ai.is-visible .mk-cs-6 {
  animation: mk-cs-slot-6 36s ease var(--scene-delay) infinite both;
}

.mk-sat-ai.is-visible .mk-cs-7 {
  animation: mk-cs-slot-7 36s ease var(--scene-delay) infinite both;
}

@keyframes mk-cs-scene {
  0% {
    opacity: 0;
  }

  1% {
    opacity: 1;
  }

  29% {
    opacity: 1;
  }

  33.3% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-1 {
  0%, 1.4% {
    opacity: 0;
    transform: translateY(6px);
  }

  3% {
    opacity: 1;
    transform: translateY(0);
  }

  29% {
    opacity: 1;
    transform: translateY(0);
  }

  33.3% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-2 {
  0%, 3.8% {
    opacity: 0;
    transform: translateY(4px);
  }

  5% {
    opacity: 1;
    transform: translateY(0);
  }

  7.5% {
    opacity: 1;
    transform: translateY(0);
  }

  8.8% {
    opacity: 0;
    transform: translateY(-3px);
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-3 {
  0%, 8% {
    opacity: 0;
    transform: translateY(6px);
  }

  10% {
    opacity: 1;
    transform: translateY(0);
  }

  29% {
    opacity: 1;
    transform: translateY(0);
  }

  33.3% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-4 {
  0%, 13.5% {
    opacity: 0;
    transform: translateY(6px);
  }

  15.5% {
    opacity: 1;
    transform: translateY(0);
  }

  29% {
    opacity: 1;
    transform: translateY(0);
  }

  33.3% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-5 {
  0%, 19% {
    opacity: 0;
    transform: translateY(6px);
  }

  21% {
    opacity: 1;
    transform: translateY(0);
  }

  29% {
    opacity: 1;
    transform: translateY(0);
  }

  33.3% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-think2 {
  0%, 18.5% {
    opacity: 0;
    transform: translateY(4px);
  }

  20% {
    opacity: 1;
    transform: translateY(0);
  }

  22% {
    opacity: 1;
    transform: translateY(0);
  }

  23.5% {
    opacity: 0;
    transform: translateY(-3px);
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-6 {
  0%, 21.5% {
    opacity: 0;
    transform: translateY(6px);
  }

  23.5% {
    opacity: 1;
    transform: translateY(0);
  }

  29% {
    opacity: 1;
    transform: translateY(0);
  }

  33.3% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-slot-7 {
  0%, 25.5% {
    opacity: 0;
    transform: scale(.95);
  }

  27% {
    opacity: 1;
    transform: scale(1);
    box-shadow: 0 0 12px #f8b46466;
  }

  29% {
    opacity: 1;
    transform: scale(1);
    box-shadow: 0 0 6px #f8b46433;
  }

  33.3% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes mk-cs-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes mk-cs-think-pulse {
  0%, 100% {
    opacity: .5;
  }

  50% {
    opacity: 1;
  }
}

@keyframes mk-cs-ambient {
  0% {
    opacity: .8;
    transform: scale(1);
  }

  100% {
    opacity: 1;
    transform: scale(1.05);
  }
}

.mk-sat-tasks {
  width: 240px;
  bottom: 8%;
  left: -10%;
}

.mk-sat-weather {
  width: 340px;
  bottom: -8%;
  left: -6%;
}

.mk-sat-float-2 {
  animation: 9s cubic-bezier(.45, 0, .55, 1) infinite mk-sat-drift-2;
}

.mk-sat-float-3 {
  animation: 10s cubic-bezier(.45, 0, .55, 1) 1s infinite mk-sat-drift-3;
}

@keyframes mk-sat-drift-2 {
  0%, 100% {
    transform: translate(0)rotate(0);
  }

  40% {
    transform: translate(-4px, -5px)rotate(-.3deg);
  }

  70% {
    transform: translate(3px, -6px)rotate(.2deg);
  }
}

@keyframes mk-sat-drift-3 {
  0%, 100% {
    transform: translate(0);
  }

  35% {
    transform: translate(4px, -3px);
  }

  65% {
    transform: translate(-3px, -2px);
  }
}

.mk-sat .mk-sat-inner {
  opacity: 0;
  transition: opacity .8s cubic-bezier(.16, 1, .3, 1), transform .8s cubic-bezier(.16, 1, .3, 1);
  transform: scale(.85)translateY(20px);
}

.mk-sat-tasks .mk-sat-inner {
  transition-delay: .3s;
}

.mk-sat-weather .mk-sat-inner {
  transition-delay: .45s;
}

.mk-reveal.is-visible .mk-sat-inner {
  opacity: 1;
  transform: scale(1)translateY(0);
}

.mk-reveal-proof {
  z-index: 8;
  padding: 5.5rem 0 4.5rem;
  position: relative;
}

@media (min-width: 1024px) {
  .mk-reveal-proof {
    padding: 6.5rem 0 5.5rem;
  }
}

.mk-reveal-proof-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  display: grid;
}

@media (min-width: 640px) {
  .mk-reveal-proof-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
  }
}

.mk-reveal-proof-item {
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 1rem .5rem;
  display: flex;
  position: relative;
}

@media (min-width: 640px) {
  .mk-reveal-proof-item + .mk-reveal-proof-item:before {
    content: "";
    background: var(--color-border);
    width: 1px;
    position: absolute;
    top: 20%;
    bottom: 20%;
    left: 0;
  }
}

.mk-rp-num {
  font-family: var(--font-heading);
  color: var(--color-heading);
  letter-spacing: -.02em;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1;
}

.mk-rp-label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--color-muted);
  font-size: .6rem;
  font-weight: 500;
}

@media (max-width: 1023px) {
  .mk-sat-ai {
    width: 32%;
    right: -1%;
  }

  .mk-sat-tasks {
    width: 180px;
    left: -4%;
  }

  .mk-sat-weather {
    width: 260px;
    bottom: -4%;
    left: -3%;
  }
}

@media (max-width: 639px) {
  .mk-reveal-dust {
    opacity: .6;
  }

  .mk-reveal-grain {
    opacity: .5;
  }

  .mk-sat {
    display: none;
  }

  .mk-border-glow {
    opacity: .7;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-reveal-beat {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-reveal-eyebrow-line {
    transition: none;
    opacity: .5 !important;
    width: 48px !important;
  }

  .mk-reveal-keyword {
    text-shadow: none !important;
    color: var(--color-accent) !important;
  }

  .mk-reveal-keyword:after {
    transition: none;
    width: 100% !important;
  }

  .mk-reveal-hero-frame {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-reveal-img-shimmer, .mk-reveal-backlight, .mk-reveal-atmo-1, .mk-reveal-atmo-2 {
    animation: none;
  }

  .mk-reveal-dust {
    display: none;
  }

  .mk-border-glow:before, .mk-sat-float-2, .mk-sat-float-3 {
    animation: none;
  }

  .mk-sat .mk-sat-inner {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-chat-scene {
    opacity: 0;
    animation: none !important;
  }

  .mk-chat-scene-1 {
    opacity: 1;
  }

  .mk-chat-scene-1 .mk-cs-1, .mk-chat-scene-1 .mk-cs-3, .mk-chat-scene-1 .mk-cs-4 {
    opacity: 1;
    transform: none;
    animation: none !important;
  }

  .mk-chat-scene-1 .mk-cs-2 {
    display: none;
  }

  .mk-chat-spinner, .mk-chat-thinking-text, .mk-chat:after {
    animation: none !important;
  }

  .mk-chat-email-btn {
    opacity: 1;
    animation: none !important;
  }

  .mk-task, .mk-weather-metric {
    opacity: 1;
    transform: none;
    animation: none !important;
  }
}

.mk-intel {
  padding-top: 2rem;
  position: relative;
}

.mk-intel-ambient {
  pointer-events: none;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-intel-wash {
  border-radius: 50%;
  position: absolute;
}

.mk-intel-wash-1 {
  background: radial-gradient(#f8a0540a 0%, #0000 70%);
  width: 500px;
  height: 400px;
  top: -5%;
  left: 50%;
  transform: translateX(-50%);
}

.mk-intel-wash-2 {
  background: radial-gradient(#0e1e3105 0%, #0000 70%);
  width: 400px;
  height: 300px;
  bottom: 10%;
  right: -5%;
}

.mk-intel-motif {
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-bottom: 1.5rem;
  display: flex;
}

.mk-intel-motif-line {
  width: 28px;
  height: 1px;
  display: block;
}

.mk-intel-motif-line:first-child {
  background: linear-gradient(to right, #0000, #f8a05459);
}

.mk-intel-motif-line:last-child {
  background: linear-gradient(to left, #0000, #f8a05459);
}

.mk-intel-motif-diamond {
  background: #f8a05466;
  border-radius: 1px;
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  transform: rotate(45deg);
}

.mk-intel-hero {
  align-items: center;
  gap: 2.5rem;
  display: flex;
  position: relative;
}

@media (min-width: 768px) {
  .mk-intel-hero {
    gap: 3.5rem;
  }
}

.mk-intel-hero-illus {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 160px;
  height: 120px;
  display: flex;
  position: relative;
}

.mk-hub-glow {
  pointer-events: none;
  background: radial-gradient(#f8a0540f 0%, #0000 65%);
  width: 180px;
  height: 140px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mk-intel-hub {
  width: 160px;
  height: 110px;
  position: relative;
}

.mk-hub-ring {
  border: 1px solid #f8a05426;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  animation: 5s ease-in-out infinite hubBreathe;
  position: absolute;
  top: 50%;
  left: 30px;
  transform: translate(-50%, -50%);
}

@keyframes hubBreathe {
  0%, 100% {
    border-color: #f8a05426;
    transform: translate(-50%, -50%)scale(1);
  }

  50% {
    border-color: #f8a05414;
    transform: translate(-50%, -50%)scale(1.15);
  }
}

.mk-hub-core {
  background: #f8a0541a;
  border: 1px solid #f8a05447;
  border-radius: 2px;
  width: 14px;
  height: 14px;
  position: absolute;
  top: 50%;
  left: 30px;
  transform: translate(-50%, -50%)rotate(45deg);
}

.mk-hub-core:after {
  content: "";
  background: #f8a05480;
  border-radius: 50%;
  width: 4px;
  height: 4px;
  animation: 3s ease-in-out infinite hubCorePulse;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)rotate(-45deg);
}

@keyframes hubCorePulse {
  0%, 100% {
    opacity: .5;
  }

  50% {
    opacity: 1;
  }
}

.mk-hub-path {
  transform-origin: 0;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 30px;
  overflow: visible;
}

.mk-hub-path:before {
  content: "";
  background: linear-gradient(to right, #f8a05433, #f8a0540f);
  position: absolute;
  inset: 0;
}

.mk-hub-path span {
  background: #f8a0548c;
  border-radius: 50%;
  width: 4px;
  height: 4px;
  animation: 3.5s ease-in-out infinite hubDotFlow;
  position: absolute;
  top: -1.5px;
  left: 0;
}

@keyframes hubDotFlow {
  0%, 5% {
    opacity: 0;
    left: 0;
  }

  15% {
    opacity: .7;
  }

  85% {
    opacity: .5;
  }

  95%, 100% {
    opacity: 0;
    left: calc(100% - 4px);
  }
}

.mk-hub-path-1 {
  width: 55px;
  transform: rotate(-28deg);
}

.mk-hub-path-1 span {
  animation-delay: 0s;
}

.mk-hub-path-2 {
  width: 65px;
  transform: rotate(0);
}

.mk-hub-path-2 span {
  animation-delay: .7s;
}

.mk-hub-path-3 {
  width: 55px;
  transform: rotate(28deg);
}

.mk-hub-path-3 span {
  animation-delay: 1.4s;
}

.mk-hub-out {
  background: #f8a05408;
  border: 1px solid #f8a05433;
  border-radius: 2px;
  flex-direction: column;
  gap: 2px;
  width: 18px;
  height: 22px;
  padding: 4px 3px;
  display: flex;
  position: absolute;
}

.mk-hub-out i {
  background: #f8a0542e;
  border-radius: 1px;
  height: 1.5px;
  font-style: normal;
  display: block;
}

.mk-hub-out i:last-child {
  width: 55%;
}

.mk-hub-out-fold {
  background: linear-gradient(135deg, #0000 50%, #f8a05414 50%);
  border-bottom-left-radius: 1px;
  width: 5px;
  height: 5px;
  position: absolute;
  top: 0;
  right: 0;
}

.mk-hub-out-1 {
  top: 6px;
  left: 88px;
}

.mk-hub-out-2 {
  top: 33px;
  left: 100px;
}

.mk-hub-out-3 {
  top: 68px;
  left: 88px;
}

.mk-intel-hero.is-visible .mk-hub-out {
  animation: .6s cubic-bezier(.22, 1, .36, 1) both hubOutAppear;
}

.mk-intel-hero.is-visible .mk-hub-out-1 {
  animation-delay: .4s;
}

.mk-intel-hero.is-visible .mk-hub-out-2 {
  animation-delay: .6s;
}

.mk-intel-hero.is-visible .mk-hub-out-3 {
  animation-delay: .8s;
}

@keyframes hubOutAppear {
  from {
    opacity: 0;
    transform: translateX(-6px)scale(.85);
  }

  to {
    opacity: 1;
    transform: translateX(0)scale(1);
  }
}

.mk-intel-hero-text {
  border-left: 2px solid #f8a0542e;
  flex: 1;
  min-width: 0;
  padding-left: 1.5rem;
  position: relative;
}

.mk-intel-tag {
  letter-spacing: .03em;
  color: var(--color-accent);
  white-space: nowrap;
  background: #f8a0540f;
  border: 1px solid #f8a05424;
  border-radius: 9999px;
  padding: .25rem .7rem;
  font-size: .65rem;
  font-weight: 500;
  transition: background .3s, border-color .3s;
  display: inline-block;
}

.mk-intel-tag:hover {
  background: #f8a0541a;
  border-color: #f8a05438;
}

.mk-intel-divider {
  background: linear-gradient(to right, transparent, var(--color-border), transparent);
  width: 100%;
  height: 1px;
  margin: 2.5rem 0;
}

.mk-intel-grid {
  background: var(--color-border);
  border: 1px solid var(--color-border);
  border-radius: .75rem;
  grid-template-columns: 1fr;
  gap: 1px;
  display: grid;
  overflow: hidden;
}

@media (min-width: 768px) {
  .mk-intel-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.mk-intel-card {
  background: var(--color-surface);
  padding: 1.75rem 1.5rem 2rem;
  position: relative;
}

@media (min-width: 768px) {
  .mk-intel-card {
    padding: 2rem 1.75rem 2.25rem;
  }
}

.mk-intel-card-illus {
  justify-content: center;
  align-items: center;
  height: 88px;
  margin-bottom: 1.25rem;
  display: flex;
  position: relative;
}

.mk-intel-card-illus:before {
  content: "";
  pointer-events: none;
  background: radial-gradient(#f8a0540a 0%, #0000 70%);
  width: 100px;
  height: 80px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mk-illust-light .mk-policy-doc {
  background: #0e1e3105;
  border-color: #0e1e3114;
}

.mk-illust-light .mk-policy-line {
  background: #0e1e3114;
}

.mk-illust-light .mk-policy-line-hl {
  background: #f8a0544d;
}

.mk-illust-light .mk-policy-scan {
  background: linear-gradient(to right, #0000, #f8a05459, #0000);
  box-shadow: 0 0 8px #f8a0542e;
}

.mk-illust-light .mk-policy-chip {
  background: #f8a05414;
  border-color: #f8a0542e;
}

.mk-illust-light .mk-weather-ring {
  border-color: #0e1e310f;
}

.mk-illust-light .mk-weather-center {
  background: #f8a0548c;
  box-shadow: 0 0 8px #f8a05440;
}

.mk-illust-light .mk-weather-dot {
  background: #f8a05480;
  box-shadow: 0 0 4px #f8a05433;
}

.mk-illust-light .mk-weather-sweep {
  background: linear-gradient(to right, #f8a05466, #0000);
}

.mk-illust-light .mk-weather-sweep:after {
  background: linear-gradient(to right, #f8a05412, #0000);
}

.mk-illust-light .mk-docs-page {
  background: #0e1e3105;
  border-color: #0e1e3114;
}

.mk-illust-light .mk-docs-line {
  background: #0e1e311a;
}

.mk-illust-light .mk-docs-cursor {
  background: #f8a054a6;
}

.mk-illust-light .mk-docs-badge {
  background: #0e1e3105;
  border-color: #0e1e3112;
}

.mk-illust-light .mk-docs-badge-dot {
  background: #f8a05473;
}

.mk-illust-light .mk-docs-badge-text {
  background: #0e1e3114;
}

@media (max-width: 767px) {
  .mk-intel-hero {
    text-align: center;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
  }

  .mk-intel-hero-illus {
    width: 120px;
    height: 90px;
  }

  .mk-intel-hub {
    transform-origin: center;
    transform: scale(.75);
  }

  .mk-intel-hero-text {
    border-top: 2px solid #f8a0542e;
    border-left: none;
    padding-top: 1.25rem;
    padding-left: 0;
  }

  .mk-intel-hero-text .flex {
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-hub-ring {
    animation: none;
  }

  .mk-hub-core:after {
    opacity: .7;
    animation: none;
  }

  .mk-hub-path span {
    opacity: 0;
    animation: none;
  }

  .mk-intel-hero.is-visible .mk-hub-out {
    opacity: 1;
    animation: none;
    transform: none;
  }

  .mk-illust-light .mk-policy-scan {
    opacity: 0;
    animation: none;
  }

  .mk-illust-light .mk-policy-chip {
    opacity: 1;
    animation: none;
    transform: none;
  }

  .mk-illust-light .mk-weather-sweep {
    opacity: .3;
    animation: none;
  }

  .mk-illust-light .mk-docs-line {
    opacity: 1;
    animation: none;
    transform: scaleX(1);
  }

  .mk-illust-light .mk-docs-cursor {
    opacity: .6;
    animation: none;
  }
}

.mk-illust-policy {
  align-items: center;
  gap: 18px;
  height: 100%;
  display: flex;
}

.mk-policy-doc {
  background: #ffffff0a;
  border: 1px solid #ffffff12;
  border-radius: 4px;
  flex-direction: column;
  flex-shrink: 0;
  gap: 4px;
  width: 52px;
  height: 68px;
  padding: 10px 7px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.mk-policy-line {
  background: #ffffff14;
  border-radius: 1px;
  height: 2px;
  display: block;
}

.mk-policy-line-hl {
  background: #f8a05440;
}

.mk-policy-line-short {
  width: 55%;
}

.mk-policy-scan {
  background: linear-gradient(to right, #0000, #f8a0544d, #0000);
  width: 100%;
  height: 2px;
  animation: 4s ease-in-out infinite policyScan;
  position: absolute;
  left: 0;
  box-shadow: 0 0 8px #f8a05426;
}

@keyframes policyScan {
  0%, 100% {
    opacity: 0;
    top: 6px;
  }

  10% {
    opacity: 1;
  }

  90% {
    opacity: 1;
  }

  95% {
    opacity: 0;
    top: calc(100% - 6px);
  }
}

.mk-policy-extract {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.mk-policy-chip {
  background: #f8a05414;
  border: 1px solid #f8a05426;
  border-radius: 3px;
  height: 10px;
  animation: 4s ease-in-out infinite chipAppear;
  display: block;
}

.mk-policy-chip-1 {
  width: 36px;
  animation-delay: .8s;
}

.mk-policy-chip-2 {
  width: 28px;
  animation-delay: 1.4s;
}

.mk-policy-chip-3 {
  width: 32px;
  animation-delay: 2s;
}

@keyframes chipAppear {
  0%, 15% {
    opacity: 0;
    transform: translateX(-4px);
  }

  25%, 85% {
    opacity: 1;
    transform: translateX(0);
  }

  95%, 100% {
    opacity: 0;
    transform: translateX(0);
  }
}

.mk-illust-weather {
  width: 84px;
  height: 84px;
  position: relative;
}

.mk-weather-ring {
  border: 1px solid #ffffff0d;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mk-weather-ring-1 {
  width: 28px;
  height: 28px;
}

.mk-weather-ring-2 {
  width: 52px;
  height: 52px;
}

.mk-weather-ring-3 {
  width: 78px;
  height: 78px;
}

.mk-weather-center {
  background: #f8a05480;
  border-radius: 50%;
  width: 4px;
  height: 4px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 6px #f8a05433;
}

.mk-weather-dot {
  background: #f8a05473;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  position: absolute;
  box-shadow: 0 0 4px #f8a05426;
}

.mk-weather-dot-1 {
  top: 16px;
  left: 50px;
}

.mk-weather-dot-2 {
  top: 30px;
  left: 64px;
}

.mk-weather-dot-3 {
  top: 58px;
  left: 24px;
}

.mk-weather-dot-4 {
  top: 22px;
  left: 26px;
}

.mk-weather-dot-5 {
  top: 48px;
  left: 56px;
}

.mk-weather-sweep {
  transform-origin: 0;
  background: linear-gradient(to right, #f8a05459, #0000);
  width: 37px;
  height: 1px;
  animation: 6s linear infinite weatherSweep;
  position: absolute;
  top: 50%;
  left: 50%;
}

.mk-weather-sweep:after {
  content: "";
  transform-origin: 0;
  background: linear-gradient(to right, #f8a0540f, #0000);
  border-radius: 0 50% 50% 0;
  width: 100%;
  height: 17px;
  position: absolute;
  top: -8px;
  left: 0;
}

@keyframes weatherSweep {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

.mk-illust-agents {
  align-items: center;
  gap: 20px;
  height: 100%;
  display: flex;
}

.mk-agents-core {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  position: relative;
}

.mk-agents-core:before {
  content: "";
  background: #f8a05426;
  border: 1px solid #f8a05433;
  border-radius: 2px;
  width: 12px;
  height: 12px;
  animation: 3s ease-in-out infinite agentPulse;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)rotate(45deg);
}

@keyframes agentPulse {
  0%, 100% {
    opacity: 1;
    transform: translate(-50%, -50%)rotate(45deg)scale(1);
  }

  50% {
    opacity: .7;
    transform: translate(-50%, -50%)rotate(45deg)scale(1.15);
  }
}

.mk-agents-spark {
  background: #f8a05466;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  animation: 4s ease-in-out infinite sparkFloat;
  position: absolute;
}

.mk-agents-spark-1 {
  animation-delay: 0s;
  top: 2px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-agents-spark-2 {
  animation-delay: .7s;
  bottom: 2px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-agents-spark-3 {
  animation-delay: 1.3s;
  top: 50%;
  left: 2px;
  transform: translateY(-50%);
}

.mk-agents-spark-4 {
  animation-delay: .4s;
  top: 50%;
  right: 2px;
  transform: translateY(-50%);
}

.mk-agents-spark-5 {
  animation-delay: 1s;
  top: 6px;
  right: 6px;
}

.mk-agents-spark-6 {
  animation-delay: 1.7s;
  bottom: 6px;
  left: 6px;
}

@keyframes sparkFloat {
  0%, 100% {
    opacity: .4;
  }

  50% {
    opacity: .8;
  }
}

.mk-agents-flow {
  flex-direction: column;
  gap: 7px;
  display: flex;
}

.mk-agents-line {
  background: #ffffff0a;
  border-radius: 2px;
  height: 4px;
  display: block;
  position: relative;
  overflow: hidden;
}

.mk-agents-line:after {
  content: "";
  background: linear-gradient(to right, #0000, #f8a05426, #0000);
  width: 100%;
  height: 100%;
  animation: 3s ease-in-out infinite lineShimmer;
  position: absolute;
  top: 0;
  left: -100%;
}

.mk-agents-line-1 {
  width: 40px;
}

.mk-agents-line-1:after {
  animation-delay: .3s;
}

.mk-agents-line-2 {
  width: 30px;
}

.mk-agents-line-2:after {
  animation-delay: .9s;
}

.mk-agents-line-3 {
  width: 35px;
}

.mk-agents-line-3:after {
  animation-delay: 1.5s;
}

@keyframes lineShimmer {
  0% {
    left: -100%;
  }

  50% {
    left: 100%;
  }

  100% {
    left: 100%;
  }
}

.mk-illust-docs {
  align-items: flex-end;
  gap: 14px;
  height: 100%;
  padding-bottom: 4px;
  display: flex;
}

.mk-docs-page {
  background: #ffffff0a;
  border: 1px solid #ffffff12;
  border-radius: 4px;
  flex-shrink: 0;
  width: 54px;
  height: 68px;
  padding: 11px 8px;
  position: relative;
}

.mk-docs-line {
  transform-origin: 0;
  background: #ffffff1a;
  border-radius: 1px;
  height: 2px;
  margin-bottom: 5px;
  display: block;
}

.mk-docs-line-1 {
  width: 100%;
  animation: 5s ease-in-out infinite docType;
}

.mk-docs-line-2 {
  width: 85%;
  animation: 5s ease-in-out .6s infinite docType;
}

.mk-docs-line-3 {
  width: 70%;
  animation: 5s ease-in-out 1.2s infinite docType;
}

.mk-docs-line-4 {
  width: 55%;
  animation: 5s ease-in-out 1.8s infinite docType;
}

@keyframes docType {
  0%, 10% {
    opacity: 0;
    transform: scaleX(0);
  }

  20%, 80% {
    opacity: 1;
    transform: scaleX(1);
  }

  90%, 100% {
    opacity: 0;
    transform: scaleX(1);
  }
}

.mk-docs-cursor {
  background: #f8a05499;
  width: 1px;
  height: 8px;
  animation: 1s steps(2, end) infinite cursorBlink;
  position: absolute;
  bottom: 11px;
  left: 8px;
}

@keyframes cursorBlink {
  0% {
    opacity: .6;
  }

  50% {
    opacity: 0;
  }
}

.mk-docs-badge {
  background: #ffffff08;
  border: 1px solid #ffffff0f;
  border-radius: 4px;
  align-items: center;
  gap: 5px;
  margin-bottom: 8px;
  padding: 4px 8px;
  display: flex;
}

.mk-docs-badge-dot {
  background: #f8a05466;
  border-radius: 50%;
  width: 4px;
  height: 4px;
}

.mk-docs-badge-text {
  background: #ffffff1a;
  border-radius: 1px;
  width: 22px;
  height: 2px;
}

.mk-stack-section {
  padding: 5rem 0 7rem;
  overflow: hidden;
}

@media (min-width: 1024px) {
  .mk-stack-section {
    padding: 7rem 0 9rem;
  }
}

.mk-stack-ambient {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  inset: 0;
}

.mk-stack-wash {
  filter: blur(90px);
  border-radius: 50%;
  position: absolute;
}

.mk-stack-wash-1 {
  background: radial-gradient(circle, #f8a0540a 0%, #0000 70%);
  width: 600px;
  height: 450px;
  top: -5%;
  right: -10%;
}

.mk-stack-wash-2 {
  background: radial-gradient(circle, #0e1e3105 0%, #0000 70%);
  width: 500px;
  height: 400px;
  bottom: -10%;
  left: -5%;
}

.mk-stack-header {
  z-index: 2;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;
  margin-bottom: 3.5rem;
  display: flex;
  position: relative;
}

@media (min-width: 768px) {
  .mk-stack-header {
    flex-direction: row;
    align-items: center;
    gap: 4rem;
  }
}

.mk-stack-header-text {
  flex: 1;
  max-width: 520px;
}

.mk-stack-illus {
  transform-origin: top;
  flex-shrink: 0;
  width: 160px;
  height: 175px;
  margin: 0 auto 1.5rem;
  display: block;
  position: relative;
  transform: scale(.67);
}

@media (min-width: 768px) {
  .mk-stack-illus {
    width: 240px;
    height: 260px;
    margin: 0;
    transform: none;
  }
}

.mk-stack-layers {
  width: 100%;
  height: 100%;
  padding-left: 24px;
  position: relative;
}

.mk-stack-layer {
  opacity: 0;
  background: #ffffffe6;
  border: 1px solid #e8e6e180;
  border-radius: 8px;
  align-items: center;
  gap: .45rem;
  height: 32px;
  padding: 0 .6rem;
  transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s cubic-bezier(.22, 1, .36, 1);
  display: flex;
  position: absolute;
  left: 24px;
  right: 0;
}

.mk-stack-layer:hover {
  transform: translateX(4px);
  box-shadow: 0 2px 8px #0e1e310f, 0 8px 20px #0e1e310a;
}

.mk-stack-layer-icon {
  background: #0e1e310a;
  border-radius: 5px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: flex;
}

.mk-stack-layer-icon svg {
  stroke: #0e1e3159;
  width: 10px;
  height: 10px;
}

.mk-stack-layer-icon-primary {
  background: #f8a0541a;
}

.mk-stack-layer-icon-primary svg {
  stroke: var(--color-accent);
}

.mk-stack-layer-label {
  letter-spacing: .03em;
  color: #0e1e318c;
  flex: 1;
  font-size: .48rem;
  font-weight: 700;
}

.mk-stack-layer-label-primary {
  color: #1a2332;
}

.mk-stack-layer-detail {
  flex-shrink: 0;
  align-items: center;
  gap: 2px;
  display: flex;
}

.mk-stack-layer-detail i {
  background: #0e1e3112;
  border-radius: 1px;
  width: 8px;
  height: 3px;
  font-style: normal;
  display: block;
}

.mk-stack-detail-accent {
  background: #f8a05440 !important;
}

.mk-stack-detail-dot {
  background: #22c55e59 !important;
  border-radius: 50% !important;
  width: 4px !important;
  height: 4px !important;
}

.mk-stack-layer-bars {
  flex-shrink: 0;
  align-items: flex-end;
  gap: 2px;
  height: 14px;
  display: flex;
}

.mk-stack-layer-bars i {
  background: #0e1e3114;
  border-radius: 1px 1px 0 0;
  width: 4px;
  font-style: normal;
  display: block;
}

.mk-stack-bar-accent {
  background: #f8a0544d !important;
}

.mk-stack-layer-1 {
  bottom: 0;
}

.mk-stack-layer-2 {
  bottom: 40px;
}

.mk-stack-layer-3 {
  bottom: 80px;
}

.mk-stack-layer-4 {
  bottom: 120px;
}

.mk-stack-layer-5 {
  bottom: 160px;
}

.mk-stack-layer-6 {
  bottom: 200px;
}

.mk-stack-layer-1 {
  background: #fff;
  border-color: #f8a05433;
  box-shadow: 0 1px 3px #0e1e310a, 0 4px 12px #0e1e310d, 0 0 0 1px #f8a0540f;
}

.mk-stack-layer-2 {
  background: #ffffffeb;
  box-shadow: 0 1px 3px #0e1e310a, 0 4px 10px #0e1e310a;
}

.mk-stack-layer-3 {
  background: #ffffffe0;
  box-shadow: 0 1px 3px #0e1e3108, 0 3px 8px #0e1e3108;
}

.mk-stack-layer-4 {
  background: #ffffffd9;
  box-shadow: 0 1px 2px #0e1e3108;
}

.mk-stack-layer-5 {
  background: #ffffffd1;
  box-shadow: 0 1px 2px #0e1e3105;
}

.mk-stack-layer-6 {
  background: #ffffffc7;
  box-shadow: 0 1px 2px #0e1e3105;
}

.mk-stack-header.is-visible .mk-stack-layer-2 {
  animation: .5s cubic-bezier(.22, 1, .36, 1) .25s both stackLayerIn;
}

.mk-stack-header.is-visible .mk-stack-layer-4 {
  animation: .5s cubic-bezier(.22, 1, .36, 1) .45s both stackLayerIn;
}

.mk-stack-header.is-visible .mk-stack-layer-6 {
  animation: .5s cubic-bezier(.22, 1, .36, 1) .65s both stackLayerIn;
}

@keyframes stackLayerIn {
  from {
    opacity: 0;
    transform: translateX(-16px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.mk-stack-header.is-visible .mk-stack-layer-1 {
  animation: .5s cubic-bezier(.22, 1, .36, 1) .15s both stackLayerIn, 5s ease-in-out 1.5s infinite stackFloat;
}

.mk-stack-header.is-visible .mk-stack-layer-3 {
  animation: .5s cubic-bezier(.22, 1, .36, 1) .35s both stackLayerIn, 6s ease-in-out 2s infinite stackFloat;
}

.mk-stack-header.is-visible .mk-stack-layer-5 {
  animation: .5s cubic-bezier(.22, 1, .36, 1) .55s both stackLayerIn, 5.5s ease-in-out 2.5s infinite stackFloat;
}

@keyframes stackFloat {
  0%, 100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(3px);
  }
}

.mk-stack-edge {
  z-index: 1;
  opacity: 0;
  width: 8px;
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 8px;
}

.mk-stack-header.is-visible .mk-stack-edge {
  animation: .5s .8s both wfFadeIn;
}

.mk-stack-edge-line {
  background: linear-gradient(#f8a0541f, #f8a05440, #f8a0541f);
  border-radius: 1px;
  width: 2px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 3px;
}

.mk-stack-edge-dot {
  background: var(--color-surface);
  border: 2px solid #f8a05440;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  position: absolute;
  left: 0;
}

.mk-stack-edge-dot-top {
  top: -4px;
}

.mk-stack-edge-dot-bottom {
  bottom: -4px;
}

.mk-stack-edge-pulse {
  background: radial-gradient(#f8a05459, #0000);
  border-radius: 3px;
  width: 6px;
  height: 16px;
  animation: 3.5s ease-in-out infinite stackEdgePulse;
  position: absolute;
  top: 0;
  left: 1px;
}

@keyframes stackEdgePulse {
  0% {
    opacity: 0;
    top: -8px;
  }

  10% {
    opacity: 1;
  }

  85% {
    opacity: .4;
  }

  100% {
    opacity: 0;
    top: calc(100% - 8px);
  }
}

.mk-stack-badge {
  color: #16a34a;
  opacity: 0;
  letter-spacing: .03em;
  background: #22c55e0f;
  border: 1px solid #22c55e26;
  border-radius: 20px;
  align-items: center;
  gap: .2rem;
  padding: .2rem .55rem;
  font-size: .42rem;
  font-weight: 700;
  display: flex;
  position: absolute;
  bottom: -12px;
  right: 0;
}

.mk-stack-badge svg {
  width: 10px;
  height: 10px;
}

.mk-stack-header.is-visible .mk-stack-badge {
  animation: .4s cubic-bezier(.22, 1, .36, 1) 1s both wfFadeIn;
}

.mk-stack-grid {
  z-index: 2;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  display: grid;
  position: relative;
}

@media (min-width: 768px) {
  .mk-stack-grid {
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
  }
}

.mk-stack-card {
  background: #fff9;
  border: 1px solid #e8e6e173;
  border-radius: 14px;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1.5rem;
  transition: transform .4s cubic-bezier(.22, 1, .36, 1), box-shadow .4s cubic-bezier(.22, 1, .36, 1), background .4s, border-color .4s;
  display: flex;
}

.mk-stack-card:hover {
  background: #ffffffe6;
  border-color: #e8e6e199;
  transform: translateY(-4px);
  box-shadow: 0 4px 8px #0e1e3105, 0 12px 24px #0e1e310a, 0 24px 48px #0e1e310d;
}

.mk-stack-card-illus {
  background: #fafaf8cc;
  border: 1px solid #e8e6e14d;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.mk-stack-card-text {
  flex: 1;
}

.mk-fin-sheet {
  background: #fff;
  border: 1px solid #e8e6e180;
  border-radius: 4px;
  width: 160px;
  overflow: hidden;
  box-shadow: 0 1px 3px #0e1e310a;
}

.mk-fin-row {
  color: #475569;
  border-bottom: 1px solid #e8e6e14d;
  justify-content: space-between;
  padding: .2rem .4rem;
  font-size: .42rem;
  display: flex;
}

.mk-fin-row:last-child {
  border-bottom: none;
}

.mk-fin-row-header {
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: .05em;
  background: #fafaf8cc;
  font-size: .38rem;
  font-weight: 700;
}

.mk-fin-row-total {
  background: #22c55e0a;
}

.mk-fin-val {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.mk-fin-val-accent {
  color: var(--color-accent);
}

.mk-fin-val-bold {
  color: #16a34a;
  font-weight: 700;
}

.mk-fin-badge {
  color: #16a34a;
  background: #22c55e14;
  border: 1px solid #22c55e1f;
  border-radius: 20px;
  padding: .1rem .4rem;
  font-size: .38rem;
  font-weight: 600;
  position: absolute;
  bottom: .4rem;
  right: .4rem;
}

.mk-fin-sheet:after {
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, #0000 0%, #f8a0540a 50%, #0000 100%);
  width: 100%;
  height: 100%;
  animation: 5s ease-in-out 2s infinite stackShimmer;
  position: absolute;
  top: 0;
  left: -100%;
}

@keyframes stackShimmer {
  0% {
    left: -100%;
  }

  40% {
    left: 100%;
  }

  100% {
    left: 100%;
  }
}

.mk-doc-page {
  background: #fff;
  border: 1px solid #e8e6e180;
  border-radius: 4px;
  width: 120px;
  padding: .45rem;
  position: relative;
  box-shadow: 0 1px 3px #0e1e310a;
}

.mk-doc-header {
  align-items: center;
  gap: .3rem;
  margin-bottom: .35rem;
  display: flex;
}

.mk-doc-logo {
  background: #f8a05426;
  border: 1px solid #f8a05433;
  border-radius: 2px;
  width: 10px;
  height: 10px;
}

.mk-doc-title-bar {
  background: #0e1e3114;
  border-radius: 1px;
  flex: 1;
  height: 3px;
}

.mk-doc-lines {
  flex-direction: column;
  gap: 2.5px;
  margin-bottom: .3rem;
  display: flex;
}

.mk-doc-lines span {
  background: #0e1e310f;
  border-radius: 1px;
  height: 2px;
}

.mk-doc-lines .short {
  width: 65%;
}

.mk-doc-merge {
  margin-bottom: .25rem;
}

.mk-doc-merge-tag {
  color: var(--color-accent);
  background: #f8a05414;
  border: 1px solid #f8a05426;
  border-radius: 2px;
  padding: .05rem .2rem;
  font-family: monospace;
  font-size: .35rem;
  font-weight: 600;
  display: inline-block;
}

.mk-doc-sig {
  border-top: 1px solid #e8e6e166;
  flex-direction: column;
  align-items: flex-start;
  padding-top: .2rem;
  display: flex;
}

.mk-doc-sig-line {
  opacity: 0;
  width: 60px;
  height: 16px;
}

.mk-stack-card:nth-child(2).is-visible .mk-doc-sig-line, .mk-stack-card:nth-child(2) .mk-doc-sig-line {
  animation: 4s ease-in-out 1s infinite stackSigDraw;
}

@keyframes stackSigDraw {
  0% {
    opacity: 0;
    stroke-dasharray: 100;
    stroke-dashoffset: 100px;
  }

  20% {
    opacity: .8;
    stroke-dashoffset: 0;
  }

  70% {
    opacity: .8;
    stroke-dashoffset: 0;
  }

  85% {
    opacity: 0;
  }

  100% {
    opacity: 0;
    stroke-dashoffset: 100px;
  }
}

.mk-doc-sig-label {
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .32rem;
}

.mk-email-thread {
  flex-direction: column;
  gap: .25rem;
  width: 170px;
  display: flex;
}

.mk-email-msg {
  background: #fff;
  border: 1px solid #e8e6e166;
  border-radius: 5px;
  align-items: center;
  gap: .35rem;
  padding: .25rem .35rem;
  display: flex;
}

.mk-email-msg-in {
  border-left: 2px solid #3b82f64d;
}

.mk-email-msg-out {
  border-left: 2px solid #f8a0544d;
}

.mk-email-avatar {
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  font-size: .38rem;
  font-weight: 700;
  display: flex;
}

.mk-email-avatar-carrier {
  color: #3b82f6b3;
  background: #3b82f61a;
}

.mk-email-avatar-you {
  color: var(--color-accent);
  background: #f8a0541a;
}

.mk-email-body {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  display: flex;
}

.mk-email-from {
  color: #334155;
  font-size: .4rem;
  font-weight: 700;
}

.mk-email-preview {
  color: #94a3b8;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .38rem;
  overflow: hidden;
}

.mk-email-time {
  color: #94a3b8;
  flex-shrink: 0;
  font-size: .35rem;
}

.mk-email-linked {
  color: #94a3b8;
  align-items: center;
  gap: .2rem;
  font-size: .35rem;
  font-weight: 600;
  display: flex;
  position: absolute;
  bottom: .35rem;
  right: .4rem;
}

.mk-email-linked svg {
  width: 8px;
  height: 8px;
  stroke: var(--color-accent);
}

.mk-portal-frame {
  background: #fff;
  border: 1px solid #e8e6e180;
  border-radius: 5px;
  width: 160px;
  overflow: hidden;
  box-shadow: 0 1px 3px #0e1e310a;
}

.mk-portal-bar {
  background: #fafaf8cc;
  border-bottom: 1px solid #e8e6e14d;
  align-items: center;
  gap: .3rem;
  padding: .2rem .35rem;
  display: flex;
}

.mk-portal-dots {
  gap: 2px;
  display: flex;
}

.mk-portal-dots i {
  border-radius: 50%;
  width: 4px;
  height: 4px;
  font-style: normal;
}

.mk-portal-dots i:first-child {
  background: #ef444466;
}

.mk-portal-dots i:nth-child(2) {
  background: #eab30866;
}

.mk-portal-dots i:nth-child(3) {
  background: #22c55e66;
}

.mk-portal-url {
  color: #94a3b8;
  font-family: monospace;
  font-size: .32rem;
}

.mk-portal-content {
  flex-direction: column;
  gap: .35rem;
  padding: .4rem;
  display: flex;
}

.mk-portal-status {
  color: #334155;
  align-items: center;
  gap: .25rem;
  font-size: .4rem;
  font-weight: 600;
  display: flex;
}

.mk-portal-status-dot {
  background: #22c55e;
  border-radius: 50%;
  width: 5px;
  height: 5px;
  animation: 2.5s ease-in-out infinite wfStatusPulse;
}

.mk-portal-upload {
  color: var(--color-accent);
  background: #f8a0540d;
  border: 1px dashed #f8a05433;
  border-radius: 3px;
  align-items: center;
  gap: .25rem;
  padding: .2rem .3rem;
  font-size: .38rem;
  display: flex;
}

.mk-portal-upload svg {
  width: 10px;
  height: 10px;
}

.mk-report-chart {
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  display: flex;
}

.mk-report-bars {
  align-items: flex-end;
  gap: 5px;
  height: 55px;
  padding: 0 .5rem;
  display: flex;
}

.mk-report-bar {
  background: #0e1e3114;
  border-radius: 2px 2px 0 0;
  width: 14px;
  transition: height .8s cubic-bezier(.22, 1, .36, 1);
}

.mk-report-bar-accent {
  background: #f8a05459;
}

.mk-stack-card .mk-report-bar {
  height: 0 !important;
}

.mk-stack-card.is-visible .mk-report-bar {
  transition: height .8s cubic-bezier(.22, 1, .36, 1);
}

.mk-stack-card.is-visible .mk-report-bar:first-child {
  transition-delay: .2s;
  height: 45% !important;
}

.mk-stack-card.is-visible .mk-report-bar:nth-child(2) {
  transition-delay: .35s;
  height: 70% !important;
}

.mk-stack-card.is-visible .mk-report-bar:nth-child(3) {
  transition-delay: .5s;
  height: 90% !important;
}

.mk-stack-card.is-visible .mk-report-bar:nth-child(4) {
  transition-delay: .65s;
  height: 55% !important;
}

.mk-stack-card.is-visible .mk-report-bar:nth-child(5) {
  transition-delay: .8s;
  height: 75% !important;
}

.mk-report-legend {
  color: #94a3b8;
  font-size: .38rem;
}

.mk-cal-mini {
  background: #fff;
  border: 1px solid #e8e6e180;
  border-radius: 4px;
  width: 130px;
  overflow: hidden;
  box-shadow: 0 1px 3px #0e1e310a;
}

.mk-cal-header {
  color: #334155;
  text-align: center;
  background: #f8a0540f;
  border-bottom: 1px solid #f8a0541a;
  padding: .25rem .4rem;
  font-size: .4rem;
  font-weight: 700;
}

.mk-cal-grid {
  text-align: center;
  color: #94a3b8;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  padding: .2rem;
  font-size: .35rem;
  display: grid;
}

.mk-cal-grid span {
  border-radius: 2px;
  padding: .12rem;
}

.mk-cal-today {
  background: var(--color-accent);
  font-weight: 700;
  color: #fff !important;
  border-radius: 50% !important;
}

.mk-cal-event {
  color: #475569;
  border-top: 1px solid #e8e6e14d;
  align-items: center;
  gap: .2rem;
  padding: .2rem .35rem;
  font-size: .35rem;
  font-weight: 600;
  display: flex;
}

.mk-cal-event-dot {
  background: var(--color-accent);
  border-radius: 50%;
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  animation: 3s ease-in-out infinite wfEventPulse;
}

@media (max-width: 767px) {
  .mk-stack-card {
    padding: 1.25rem;
  }

  .mk-stack-card-illus {
    height: 85px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-stack-layer {
    opacity: 1;
    animation: none !important;
  }

  .mk-stack-edge {
    opacity: 1;
  }

  .mk-stack-edge-pulse {
    opacity: 0;
    animation: none;
  }

  .mk-stack-badge {
    opacity: 1;
  }

  .mk-doc-sig-line {
    opacity: .6;
    animation: none !important;
  }

  .mk-fin-sheet:after {
    opacity: 0;
    animation: none;
  }

  .mk-report-bar {
    height: initial !important;
    transition: none !important;
  }

  .mk-portal-status-dot, .mk-cal-event-dot {
    animation: none;
  }
}

.mk-signal-dot {
  background: var(--color-accent);
  border-radius: 50%;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  animation: 2.5s ease-in-out infinite mk-signal-pulse;
}

@keyframes mk-signal-pulse {
  0%, 100% {
    opacity: .4;
    box-shadow: 0 0 #f8a0544d;
  }

  50% {
    opacity: 1;
    box-shadow: 0 0 0 4px #f8a05400;
  }
}

.mk-trust-badge {
  letter-spacing: .04em;
  color: #ffffff4d;
  font-size: .7rem;
  font-weight: 500;
}

.mk-trust-sep {
  background: #ffffff1a;
  flex-shrink: 0;
  width: 1px;
  height: 12px;
}

.mk-hero-light {
  background: radial-gradient(ellipse at 70% 20%, #0e1e3108 0%, transparent 60%), radial-gradient(ellipse at 20% 80%, #f8a05405 0%, transparent 50%), var(--color-surface);
}

.mk-hero-glow-light {
  pointer-events: none;
  background: radial-gradient(#0e1e3109 0%, #0000 70%);
  border-radius: 50%;
  width: 600px;
  height: 400px;
  position: absolute;
}

.mk-trust-badge-light {
  letter-spacing: .04em;
  color: var(--color-muted);
  font-size: .7rem;
  font-weight: 500;
}

.mk-trust-sep-light {
  background: #0e1e3114;
  flex-shrink: 0;
  width: 1px;
  height: 12px;
}

.mk-neural-light .mk-neural-line {
  stroke: #0e1e3112;
}

.mk-neural-light .mk-neural-node {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #0e1e3159;
  background: #fffc;
  border-color: #0e1e311a;
}

.mk-neural-light .mk-neural-sat {
  box-shadow: 0 0 calc(var(--glow-intensity) * 16px) rgba(248, 160, 84, calc(var(--glow-intensity) * .15));
  border-color: rgba(14, 30, 49, calc(.1 + var(--glow-intensity) * .15));
}

.mk-neural-light .mk-neural-core {
  color: var(--color-accent);
  background: #ffffffe6;
  border-color: #f8a05433;
}

.mk-neural-light .mk-neural-label {
  color: #0e1e312e;
}

.mk-hero-phosphor {
  pointer-events: none;
  background: radial-gradient(#f8a0540a 0%, #0000 70%);
  border-radius: 50%;
  width: 500px;
  height: 300px;
  animation: 8s ease-in-out infinite alternate mk-ambient;
  position: absolute;
}

.mk-neural-network {
  aspect-ratio: 4 / 5;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  position: relative;
}

.mk-neural-svg {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-neural-line {
  stroke: #ffffff0f;
  stroke-width: 1px;
  stroke-dasharray: 6 8;
  stroke-dashoffset: 0;
  animation: 4s linear infinite mk-neural-travel;
}

.mk-neural-line-d1 {
  animation-delay: -.6s;
}

.mk-neural-line-d2 {
  animation-delay: -1.3s;
}

.mk-neural-line-d3 {
  animation-delay: -2s;
}

.mk-neural-line-d4 {
  animation-delay: -2.8s;
}

.mk-neural-line-d5 {
  animation-delay: -3.5s;
}

@keyframes mk-neural-travel {
  from {
    stroke-dashoffset: 0;
  }

  to {
    stroke-dashoffset: -28px;
  }
}

.mk-neural-node {
  color: #fff6;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  background: #0e1e3199;
  border: 1px solid #ffffff1a;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  transition: border-color .4s, box-shadow .4s;
  display: flex;
  position: absolute;
  transform: translate(-50%, -50%);
}

.mk-neural-sat {
  --glow-intensity: 0;
  box-shadow: 0 0 calc(var(--glow-intensity) * 16px) rgba(248, 160, 84, calc(var(--glow-intensity) * .2));
  border-color: rgba(255, 255, 255, calc(.1 + var(--glow-intensity) * .15));
}

.mk-neural-core {
  width: 48px;
  height: 48px;
  color: var(--color-accent);
  background: #0e1e31cc;
  border-color: #f8a05440;
  animation: 4s ease-in-out infinite alternate mk-core-glow;
}

@keyframes mk-core-glow {
  0% {
    box-shadow: 0 0 12px #f8a05414, 0 0 24px #f8a0540a;
  }

  100% {
    box-shadow: 0 0 20px #f8a05426, 0 0 40px #f8a0540f;
  }
}

.mk-neural-label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff3;
  white-space: nowrap;
  pointer-events: none;
  font-size: .55rem;
  font-weight: 600;
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
}

.mk-neural-node.mk-float {
  animation: 6s ease-in-out infinite mk-float;
}

.mk-neural-node.mk-float-slow {
  animation: 8s ease-in-out infinite mk-float-slow;
}

.mk-neural-node.mk-drift {
  animation: 12s ease-in-out infinite mk-drift;
}

.mk-frame {
  border: 1px solid #0e1e310d;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 4px #0e1e3105, 0 8px 16px #0e1e3108, 0 24px 48px #0e1e310a;
}

.mk-light-wash {
  z-index: 1;
  margin-top: -120px;
  padding-top: 120px;
  position: relative;
}

@media (min-width: 768px) {
  .mk-light-wash {
    margin-top: -140px;
    padding-top: 140px;
  }
}

@media (min-width: 1024px) {
  .mk-light-wash {
    margin-top: -180px;
    padding-top: 180px;
  }
}

.mk-light-wash:after {
  content: "";
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(at 85%, #0e1e3103 0%, #0000 50%), radial-gradient(at 20% 100%, #f8a05404 0%, #0000 40%);
  position: absolute;
  inset: 0;
}

.mk-light-wash > * {
  z-index: 1;
  position: relative;
}

.mk-feature-row {
  transition: background-color .3s;
  position: relative;
}

.mk-feature-row:before {
  content: "";
  background: var(--color-accent);
  border-radius: 2px;
  width: 3px;
  height: 0;
  transition: height .3s, top .3s;
  position: absolute;
  top: 50%;
  left: -1rem;
}

.mk-feature-row:hover:before {
  height: 50%;
  top: 25%;
}

.mk-panel {
  background: radial-gradient(ellipse at 25% 0%, #121e2c66 0%, transparent 50%), radial-gradient(ellipse at 75% 100%, #050c164d 0%, transparent 50%), var(--color-primary);
  border-radius: 1.25rem;
  position: relative;
  overflow: hidden;
}

.mk-panel:after {
  content: "";
  pointer-events: none;
  border: 1px solid #ffffff0f;
  border-radius: 1.25rem;
  position: absolute;
  inset: 0;
}

.mk-pricing-canvas {
  z-index: 1;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-pricing-section {
  background: linear-gradient(#0000 0%, #0e1e3105 15%, #0e1e3108 50%, #0e1e3105 85%, #0000 100%);
  padding: 4rem 0 5rem;
  overflow: hidden;
}

@media (min-width: 1024px) {
  .mk-pricing-section {
    padding: 5rem 0 6rem;
  }
}

.mk-pricing-beam-wrap {
  border-radius: 25px;
  padding: 1px;
  position: relative;
  overflow: hidden;
}

.mk-pricing-beam-spinner {
  pointer-events: none;
  background: conic-gradient(#0000 0% 72%, #f8a0541f 78%, #f8a05440 82%, #fff6 84%, #f8a05440 86%, #f8a0541f 90%, #0000 95%);
  animation: 10s linear infinite pricingBorderSpin;
  position: absolute;
  inset: -50%;
}

@keyframes pricingBorderSpin {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

.mk-pricing-glass {
  background: linear-gradient(165deg, #fff 0%, #fdfcfb 30%, #faf9f7 60%, #f7f6f3 100%);
  border-radius: 24px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 3px #0e1e310a, 0 8px 32px #0e1e310d, inset 0 1px #fffc;
}

.mk-pricing-glass-inner {
  z-index: 5;
  padding: 2rem 1.5rem 1.75rem;
  position: relative;
}

@media (min-width: 640px) {
  .mk-pricing-glass-inner {
    padding: 2.25rem 2.5rem 2rem;
  }
}

@media (min-width: 1024px) {
  .mk-pricing-glass-inner {
    padding: 2.5rem 3rem 2.25rem;
  }
}

.mk-pricing-center {
  text-align: center;
  padding-bottom: 1.25rem;
  position: relative;
}

.mk-pricing-halo {
  pointer-events: none;
  background: radial-gradient(circle, #f8a0540d 0%, #f8a05405 40%, #0000 70%);
  border-radius: 50%;
  width: 200px;
  height: 200px;
  animation: 6s cubic-bezier(.45, 0, .55, 1) infinite pricingHaloBreathe;
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes pricingHaloBreathe {
  0%, 100% {
    opacity: .5;
    transform: translate(-50%, -50%)scale(1);
  }

  50% {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1.1);
  }
}

.mk-pricing-label {
  text-transform: uppercase;
  letter-spacing: .2em;
  color: var(--color-accent);
  margin-bottom: .75rem;
  font-size: .6rem;
  font-weight: 600;
}

.mk-pricing-amount {
  z-index: 2;
  justify-content: center;
  align-items: baseline;
  gap: 2px;
  line-height: 1;
  display: flex;
  position: relative;
}

.mk-pricing-dollar {
  font-family: var(--font-heading);
  color: #94a3b8;
  align-self: flex-start;
  margin-top: .35em;
  font-size: 2rem;
  font-weight: 500;
}

.mk-pricing-value {
  font-family: var(--font-heading);
  color: var(--color-heading);
  letter-spacing: -.025em;
  font-size: 3.5rem;
  font-weight: 600;
}

@media (min-width: 768px) {
  .mk-pricing-value {
    font-size: 4rem;
  }
}

@media (min-width: 1024px) {
  .mk-pricing-value {
    font-size: 4.5rem;
  }
}

.mk-pricing-period {
  color: #94a3b8;
  align-self: flex-end;
  margin-bottom: .6em;
  margin-left: 3px;
  font-size: 1rem;
  font-weight: 500;
}

.mk-pricing-billing {
  color: #64748b;
  z-index: 2;
  margin-top: .75rem;
  font-size: .82rem;
  position: relative;
}

.mk-pricing-alt {
  color: #94a3b8;
  z-index: 2;
  margin-top: .3rem;
  font-size: .72rem;
  position: relative;
}

.mk-pricing-savings {
  z-index: 2;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  margin-top: 1rem;
  display: flex;
  position: relative;
}

.mk-pricing-savings-track {
  background: #e8e6e166;
  border-radius: 2px;
  width: 140px;
  height: 3px;
  overflow: hidden;
}

.mk-pricing-savings-fill {
  background: linear-gradient(90deg, #22c55e66, #22c55ea6);
  border-radius: 2px;
  width: 0%;
  height: 100%;
  transition: width 1.8s cubic-bezier(.22, 1, .36, 1) .3s;
}

.is-visible .mk-pricing-savings-fill {
  width: 100%;
}

.mk-pricing-savings-text {
  color: #94a3b8;
  font-size: .68rem;
}

.mk-pricing-savings-text strong {
  color: #16a34a;
  font-weight: 700;
}

.mk-pricing-bridge {
  align-items: center;
  gap: 1rem;
  max-width: 100%;
  margin: 0 auto 1.5rem;
  display: flex;
}

.mk-pricing-bridge-line {
  flex: 1;
  height: 1px;
  position: relative;
}

.mk-pricing-bridge-line-l {
  background: linear-gradient(to right, #0000, #e8e6e173);
}

.mk-pricing-bridge-line-r {
  background: linear-gradient(to left, #0000, #e8e6e173);
}

.mk-pricing-bridge-line:after {
  content: "";
  filter: blur(2px);
  background: #f8a0541f;
  border-radius: 2px;
  width: 30px;
  height: 3px;
  position: absolute;
  top: -1px;
}

.mk-pricing-bridge-line-l:after {
  animation: 6s cubic-bezier(.45, 0, .55, 1) infinite pricingBridgePulseL;
  right: 0;
}

.mk-pricing-bridge-line-r:after {
  animation: 6s cubic-bezier(.45, 0, .55, 1) infinite pricingBridgePulseR;
  left: 0;
}

@keyframes pricingBridgePulseL {
  0%, 100% {
    opacity: 0;
    transform: translateX(-40px);
  }

  40%, 60% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes pricingBridgePulseR {
  0%, 100% {
    opacity: 0;
    transform: translateX(40px);
  }

  40%, 60% {
    opacity: 1;
    transform: translateX(0);
  }
}

.mk-pricing-bridge-label {
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #94a3b8;
  white-space: nowrap;
  font-size: .58rem;
  font-weight: 600;
}

.mk-pricing-features {
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem 1.5rem;
  margin: 0 auto 1.75rem;
  display: grid;
}

.mk-pricing-feature-col {
  position: relative;
}

.mk-pricing-feature-header {
  color: #1e293b;
  letter-spacing: .01em;
  align-items: center;
  gap: .35rem;
  margin-bottom: .6rem;
  font-size: .68rem;
  font-weight: 600;
  display: flex;
}

.mk-pricing-feature-dot {
  border-radius: 50%;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
}

.mk-pricing-dot-claims {
  background: #f8a05499;
}

.mk-pricing-dot-workflow {
  background: #6366f180;
}

.mk-pricing-dot-docs {
  background: #22c55e80;
}

.mk-pricing-dot-platform {
  background: #0ea5e980;
}

.mk-pricing-feature-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mk-pricing-feature-list li {
  color: #64748b;
  padding-left: .7rem;
  font-size: .72rem;
  line-height: 1.7;
  position: relative;
}

.mk-pricing-feature-list li:before {
  content: "";
  background: #0e1e311a;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  position: absolute;
  top: .55em;
  left: 0;
}

.mk-pricing-action {
  text-align: center;
  z-index: 5;
  padding-bottom: .5rem;
  position: relative;
}

.mk-pricing-cta-btn {
  display: inline-flex;
}

.mk-pricing-cta-btn:after {
  content: "";
  pointer-events: none;
  border-radius: 14px;
  animation: 6s cubic-bezier(.45, 0, .55, 1) infinite pricingCtaGlow;
  position: absolute;
  inset: -2px;
  box-shadow: 0 0 20px 4px #f8a0541a;
}

@keyframes pricingCtaGlow {
  0%, 100% {
    opacity: .3;
  }

  50% {
    opacity: .8;
  }
}

.mk-pricing-trust {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  margin-top: 1.25rem;
  display: flex;
}

.mk-pricing-trust > span:not(.mk-pricing-trust-sep) {
  color: #94a3b8;
  align-items: center;
  gap: .3rem;
  font-size: .65rem;
  font-weight: 500;
  display: flex;
}

.mk-pricing-trust svg {
  stroke: #b0b8c4;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
}

.mk-pricing-trust-sep {
  background: #0e1e3114;
  border-radius: 50%;
  flex-shrink: 0;
  width: 3px;
  height: 3px;
}

.mk-pricing-addons {
  margin: 1.75rem auto 0;
}

.mk-pricing-addons-label {
  text-transform: uppercase;
  letter-spacing: .12em;
  color: #94a3b8;
  text-align: center;
  margin-bottom: .75rem;
  font-size: .6rem;
  font-weight: 600;
}

.mk-pricing-addons-grid {
  grid-template-columns: 1fr;
  gap: .75rem;
  display: grid;
}

@media (min-width: 480px) {
  .mk-pricing-addons-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.mk-pricing-addon {
  background: linear-gradient(165deg, #fff 0%, #fcfbf9 100%);
  border: 1px solid #e8e6e199;
  border-radius: 14px;
  padding: 1rem 1.15rem;
  transition: border-color .3s, box-shadow .3s;
}

.mk-pricing-addon:hover {
  border-color: #e8e6e1e6;
  box-shadow: 0 2px 12px #0e1e310a;
}

.mk-pricing-addon-ai {
  border-top: 2px solid #f8a05440;
}

.mk-pricing-addon-esign {
  border-top: 2px solid #22c55e33;
}

.mk-pricing-addon-header {
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: .4rem;
  display: flex;
}

.mk-pricing-addon-name {
  color: #1e293b;
  font-size: .76rem;
  font-weight: 600;
}

.mk-pricing-addon-price {
  color: #94a3b8;
  white-space: nowrap;
  font-size: .68rem;
}

.mk-pricing-addon-price strong {
  color: #475569;
  font-weight: 600;
}

.mk-pricing-addon-desc {
  color: #64748b;
  font-size: .7rem;
  line-height: 1.55;
}

.mk-pricing-addons-note {
  color: #b0b8c4;
  text-align: center;
  margin-top: .75rem;
  font-size: .62rem;
}

.mk-hero-bg {
  background: radial-gradient(ellipse at 20% 15%, #121e2c73 0%, transparent 55%), radial-gradient(ellipse at 80% 85%, #050c1659 0%, transparent 55%), linear-gradient(170deg, #141e2c 0%, var(--color-primary) 25%, var(--color-primary-dark) 100%);
  position: relative;
  overflow: hidden;
}

.mk-hero-bg.mk-hero-curved {
  -webkit-mask-composite: source-over;
  -webkit-mask-composite: source-over;
  padding-bottom: 60px;
  -webkit-mask-image: linear-gradient(#000, #000), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L1440,0 L1440,10 Q1080,80 720,40 Q360,0 0,100 Z' fill='white'/%3E%3C/svg%3E");
  mask-image: linear-gradient(#000, #000), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L1440,0 L1440,10 Q1080,80 720,40 Q360,0 0,100 Z' fill='white'/%3E%3C/svg%3E");
  -webkit-mask-position: top, bottom;
  mask-position: top, bottom;
  -webkit-mask-size: 100% calc(100% - 58px), 100% 60px;
  mask-size: 100% calc(100% - 58px), 100% 60px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-composite: source-over;
  mask-composite: add;
}

@media (min-width: 768px) {
  .mk-hero-bg.mk-hero-curved {
    padding-bottom: 80px;
    -webkit-mask-size: 100% calc(100% - 78px), 100% 80px;
    mask-size: 100% calc(100% - 78px), 100% 80px;
  }
}

@media (min-width: 1024px) {
  .mk-hero-bg.mk-hero-curved {
    padding-bottom: 100px;
    -webkit-mask-size: 100% calc(100% - 98px), 100% 100px;
    mask-size: 100% calc(100% - 98px), 100% 100px;
  }
}

.mk-hero-bg:after {
  content: "";
  pointer-events: none;
  background: radial-gradient(at 60% 40%, #f8a05408 0%, #0000 50%);
  animation: 25s cubic-bezier(.45, 0, .55, 1) infinite alternate mk-ambient;
  position: absolute;
  inset: 0;
}

@keyframes mk-ambient {
  from {
    opacity: .3;
  }

  to {
    opacity: 1;
  }
}

.mk-hero-product {
  filter: drop-shadow(0 40px 80px #00000059) drop-shadow(0 15px 30px #00000040);
}

.mk-plat-dark {
  background: radial-gradient(ellipse at 20% 0%, #121e2c4d 0%, transparent 55%), radial-gradient(ellipse at 80% 100%, #050c1640 0%, transparent 55%), linear-gradient(175deg, #0e1e31 0%, var(--color-primary-dark) 100%);
  color: #fff9;
  position: relative;
}

.mk-plat-dark:before {
  content: "";
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(#0000, #0e1e31);
  height: 48px;
  position: absolute;
  top: -48px;
  left: 0;
  right: 0;
}

.mk-plat-dark:after {
  content: "";
  background: linear-gradient(to top, transparent, var(--color-primary-dark));
  pointer-events: none;
  z-index: 1;
  height: 48px;
  position: absolute;
  bottom: -48px;
  left: 0;
  right: 0;
}

.mk-dark-glow {
  background: radial-gradient(ellipse at 30% 0%, #f8a0540d 0%, transparent 50%), radial-gradient(ellipse at 70% 100%, #121e2c40 0%, transparent 50%), var(--color-primary);
}

.mk-emerge {
  position: relative;
}

.mk-emerge:before {
  content: "";
  background: linear-gradient(to bottom, var(--color-primary-dark), var(--color-surface));
  pointer-events: none;
  z-index: 0;
  height: 200px;
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
}

.mk-emerge > * {
  z-index: 1;
  position: relative;
}

.mk-submerge {
  position: relative;
}

.mk-submerge:before {
  content: "";
  background: linear-gradient(to bottom, var(--color-surface), var(--color-primary));
  pointer-events: none;
  z-index: 0;
  height: 200px;
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
}

.mk-submerge > * {
  z-index: 1;
  position: relative;
}

.mk-hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.mk-hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.mk-gradient-text {
  background: linear-gradient(135deg, var(--color-accent), #ffd4a0);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.glow-border {
  border-radius: 6px;
  position: relative;
  overflow: hidden;
}

.glow-border .content {
  z-index: 5;
  border-radius: 6px;
  padding: 3px;
  position: relative;
  overflow: hidden;
}

.glow-border .content-img {
  border-radius: 6px;
}

.glow-border:before, .glow-border:after {
  content: "";
  z-index: 2;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%)translateY(-50%);
}

.glow-border:after {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  background: #ffffff1a;
  border-radius: 6px;
  width: calc(100% - 3px);
  height: calc(100% - 3px);
}

.glow-border:before {
  filter: blur(12px);
  background: linear-gradient(#ffa700, #ffefdd);
  width: 200%;
  height: 150px;
  animation: 8s linear infinite glow-rotate;
}

@keyframes glow-rotate {
  from {
    transform: translateX(-50%)translateY(-50%)rotate(0);
  }

  to {
    transform: translateX(-50%)translateY(-50%)rotate(360deg);
  }
}

.ocontainer {
  width: 100vw;
  height: 100%;
  position: absolute;
  bottom: -60%;
  left: 50%;
  overflow: hidden;
  transform: translate(-50%);
}

.oglow {
  content: "";
  background: radial-gradient(#00b7ffb3 20%, #0000 60%);
  width: 200%;
  height: 100%;
  margin-left: -50%;
  animation: 3s infinite alternate glowing, 15s linear infinite orb-move;
  position: absolute;
  top: 100px;
  left: 0;
}

.oglow:first-child {
  animation-delay: 3s;
}

.oglow:nth-child(2) {
  background: radial-gradient(#00ffb7b3 30%, #0000 60%);
  animation-delay: 6s;
}

.oglow:nth-child(3) {
  background: radial-gradient(#edf6ffb3 25%, #0000 60%);
  animation-delay: 9s;
}

.ocircle {
  background: var(--color-primary-dark);
  z-index: 1;
  border: 6px solid #1a2a3a6e;
  border-radius: 50%;
  width: 120vw;
  height: 400px;
  position: absolute;
  top: 100px;
  left: 50%;
  transform: translateX(-50%);
}

@keyframes orb-move {
  from {
    transform: rotate(360deg)translateX(100px)rotate(-360deg);
  }

  to {
    transform: rotate(0)translateX(100px)rotate(0);
  }
}

@keyframes glowing {
  0% {
    opacity: .5;
  }

  100% {
    opacity: 1;
  }
}

.mk-section-warm {
  position: relative;
}

.mk-section-warm:before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.mk-section-cool {
  position: relative;
}

.mk-section-cool:before {
  content: "";
  pointer-events: none;
  background: radial-gradient(at 60% 30%, #0e1e3106 0%, #0000 55%), radial-gradient(at 20% 70%, #0e1e3104 0%, #0000 50%);
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(#000 60%, #0000 100%);
  mask-image: linear-gradient(#000 60%, #0000 100%);
}

.mk-section-warm > *, .mk-section-cool > * {
  z-index: 5;
  position: relative;
}

.mk-glass-panel {
  z-index: 10;
  -webkit-backdrop-filter: blur(2px);
  text-align: center;
  background: #fff0;
  border: 1px solid #ffffff59;
  border-radius: 16px;
  padding: 24px;
  position: relative;
  box-shadow: 0 1px 3px #0e1e310a, 0 8px 24px #0e1e3108, inset 0 1px #ffffff80;
}

@media (min-width: 768px) {
  .mk-glass-panel {
    border-radius: 20px;
    padding: 28px 32px;
  }
}

.mk-section-label {
  font-family: var(--font-sans);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--color-accent);
  opacity: .85;
  font-size: .68rem;
  font-weight: 500;
  display: inline-block;
}

.mk-sunrise {
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  background: radial-gradient(55% 45% at 50% 45%, #ffd78c1a 0%, #0000 100%), radial-gradient(45% 40%, #fbb65021 0%, #0000 100%);
  width: 110%;
  height: 100%;
  transition: opacity 3s cubic-bezier(.23, 1, .32, 1), transform 3s cubic-bezier(.23, 1, .32, 1);
  position: absolute;
  bottom: -25%;
  left: 50%;
  transform: translateX(-50%)translateY(50px);
}

.mk-sunrise.is-risen {
  opacity: 1;
  transform: translateX(-50%)translateY(-25px);
}

@media (prefers-reduced-motion: reduce) {
  .mk-sunrise {
    transition: opacity .5s;
    transform: translateX(-50%);
  }

  .mk-sunrise.is-risen {
    transform: translateX(-50%);
  }
}

.mk-divider {
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 0 2rem;
  display: flex;
}

.mk-divider-line {
  background: linear-gradient(90deg, #0000, #f8a05440);
  flex: 1;
  max-width: 80px;
  height: 1px;
}

.mk-divider-line:last-child {
  background: linear-gradient(90deg, #f8a05440, #0000);
}

.mk-divider-diamond {
  background: var(--color-accent);
  opacity: .3;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
}

.mk-deco {
  pointer-events: none;
  z-index: 0;
  position: absolute;
}

.mk-deco-ring {
  border: 1px solid #f8a0541a;
  border-radius: 50%;
}

.mk-deco-dot {
  background: var(--color-accent);
  opacity: .1;
  border-radius: 50%;
}

@keyframes mk-float {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-14px);
  }
}

@keyframes mk-float-slow {
  0%, 100% {
    transform: translateY(0)rotate(0);
  }

  50% {
    transform: translateY(-8px)rotate(3deg);
  }
}

@keyframes mk-drift {
  0%, 100% {
    transform: translate(0);
  }

  25% {
    transform: translate(6px, -4px);
  }

  50% {
    transform: translate(-3px, -8px);
  }

  75% {
    transform: translate(-6px, -2px);
  }
}

.mk-float {
  animation: 6s ease-in-out infinite mk-float;
}

.mk-float-slow {
  animation: 8s ease-in-out infinite mk-float-slow;
}

.mk-drift {
  animation: 12s ease-in-out infinite mk-drift;
}

.mk-float-d1 {
  animation-delay: 0s;
}

.mk-float-d2 {
  animation-delay: 2s;
}

.mk-float-d3 {
  animation-delay: 4s;
}

.mk-stat-card {
  background: #ffffff73;
  border: 1px solid #e8e6e166;
  border-radius: 14px;
  padding: 1.75rem 1rem 1.5rem;
  transition: background .5s, border-color .5s, transform .5s, box-shadow .5s;
  position: relative;
  overflow: hidden;
}

.mk-stat-card:after {
  content: "";
  background: linear-gradient(90deg, transparent, var(--color-accent), transparent);
  opacity: 0;
  height: 2px;
  transition: opacity .5s;
  position: absolute;
  bottom: 0;
  left: 20%;
  right: 20%;
}

.mk-stat-card:hover {
  background: #ffffffd9;
  border-color: #f8a05433;
  transform: translateY(-3px);
  box-shadow: 0 8px 24px #0e1e310a, 0 2px 8px #f8a0540f;
}

.mk-stat-card:hover:after {
  opacity: 1;
}

.mk-counter {
  font-variant-numeric: tabular-nums;
  display: inline-block;
}

.mk-flow-wrap {
  padding-left: 2rem;
  position: relative;
}

.mk-flow-line {
  background: linear-gradient(#f8a05414, #f8a05440, #f8a05414);
  border-radius: 1px;
  width: 2px;
  position: absolute;
  top: 1.5rem;
  bottom: 1.5rem;
  left: 5px;
}

.mk-flow-line:after {
  content: "";
  background: linear-gradient(to bottom, var(--color-accent), transparent);
  border-radius: 2px;
  width: 4px;
  height: 20px;
  animation: 3s ease-in-out infinite mk-flow-pulse;
  position: absolute;
  top: 0;
  left: -1px;
}

@keyframes mk-flow-pulse {
  0% {
    opacity: 0;
    top: 0;
  }

  10% {
    opacity: 1;
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    top: calc(100% - 20px);
  }
}

.mk-flow-step {
  position: relative;
}

.mk-flow-dot {
  border: 2px solid var(--color-accent);
  background: var(--color-surface);
  border-radius: 50%;
  width: 12px;
  height: 12px;
  transition: all .3s;
  position: absolute;
  top: .25rem;
  left: -2rem;
}

.mk-flow-step:hover .mk-flow-dot {
  background: var(--color-accent);
  box-shadow: 0 0 0 4px #f8a0541f;
}

.mk-wf-section {
  padding: 2rem 0 7rem;
  overflow: hidden;
}

@media (min-width: 1024px) {
  .mk-wf-section {
    padding: 3rem 0 10rem;
  }
}

.mk-wf-ambient {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  inset: 0;
}

.mk-wf-wash {
  filter: blur(80px);
  border-radius: 50%;
  position: absolute;
}

.mk-wf-wash-1 {
  background: radial-gradient(circle, #f8a0540d 0%, #0000 70%);
  width: 500px;
  height: 400px;
  top: -10%;
  left: -5%;
}

.mk-wf-wash-2 {
  background: radial-gradient(circle, #0e1e3106 0%, #0000 70%);
  width: 400px;
  height: 350px;
  top: 30%;
  right: -8%;
}

.mk-wf-wash-3 {
  background: radial-gradient(circle, #f8a0540a 0%, #0000 70%);
  width: 450px;
  height: 350px;
  bottom: -15%;
  left: 25%;
}

.mk-wf-accents {
  pointer-events: none;
  z-index: 1;
  position: absolute;
  inset: 0;
}

.mk-wf-layout {
  z-index: 2;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
  display: flex;
  position: relative;
}

@media (min-width: 1024px) {
  .mk-wf-layout {
    flex-direction: row;
    align-items: center;
    gap: 4rem;
  }
}

.mk-wf-illus {
  flex-shrink: 0;
  padding-top: 36px;
  padding-bottom: 28px;
  position: relative;
}

@media (min-width: 1024px) {
  .mk-wf-illus {
    flex: 0 0 48%;
    max-width: 420px;
  }
}

.mk-wf-signal {
  z-index: 3;
  opacity: 0;
  width: 2px;
  height: 36px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.mk-wf-signal-line {
  background: linear-gradient(#0000, #f8a0544d);
  border-radius: 1px;
  width: 2px;
  height: 100%;
  display: block;
}

.mk-wf-signal-dot {
  background: var(--color-accent);
  opacity: 0;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  position: absolute;
  bottom: -3px;
  left: -3px;
}

.mk-wf-layout.is-visible .mk-wf-signal {
  animation: .5s cubic-bezier(.22, 1, .36, 1) both wfSignalFade;
}

.mk-wf-layout.is-visible .mk-wf-signal-dot {
  animation: .8s cubic-bezier(.22, 1, .36, 1) .2s both wfSignalDrop;
}

.mk-wf-layout.is-visible .mk-wf-signal-line {
  animation: 4s ease-in-out 3s infinite wfSignalPulse;
}

@keyframes wfSignalFade {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes wfSignalDrop {
  0% {
    opacity: 0;
    bottom: 100%;
    transform: scale(1.5);
  }

  30% {
    opacity: 1;
  }

  100% {
    opacity: .8;
    bottom: -3px;
    transform: scale(1);
  }
}

@keyframes wfSignalPulse {
  0%, 100% {
    opacity: .3;
  }

  15% {
    opacity: .7;
  }

  30% {
    opacity: .3;
  }
}

.mk-wf-panel {
  z-index: 2;
  opacity: 0;
  background: #fff;
  border-radius: 14px;
  width: 370px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  transform: translateY(16px);
  box-shadow: 0 1px 2px #0e1e310a, 0 4px 12px #0e1e310f, 0 16px 40px #0e1e310f, 0 0 0 1px #e8e6e180;
}

.mk-wf-layout.is-visible .mk-wf-panel {
  animation: .7s cubic-bezier(.22, 1, .36, 1) .1s both wfPanelIn, 6s ease-in-out 3s infinite wfPanelBreathe;
}

@keyframes wfPanelIn {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes wfPanelBreathe {
  0%, 100% {
    box-shadow: 0 1px 2px #0e1e310a, 0 4px 12px #0e1e310f, 0 16px 40px #0e1e310f, 0 0 0 1px #e8e6e180;
  }

  50% {
    box-shadow: 0 1px 2px #0e1e310a, 0 4px 12px #0e1e310f, 0 16px 40px #0e1e310f, 0 0 0 1px #e8e6e180, 0 0 30px 4px #f8a0540a;
  }
}

.mk-wfp-header {
  background: #fafaf880;
  border-bottom: 1px solid #0e1e310f;
  align-items: center;
  gap: .55rem;
  padding: .7rem .9rem;
  display: flex;
}

.mk-wfp-header-text {
  flex-direction: column;
  flex: 1;
  gap: .12rem;
  display: flex;
}

.mk-wfp-icon {
  background: #f8a0541a;
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  display: flex;
}

.mk-wfp-icon svg {
  width: 13px;
  height: 13px;
  color: var(--color-accent);
}

.mk-wfp-title {
  color: #1a2332;
  font-size: .65rem;
  font-weight: 700;
  line-height: 1.2;
}

.mk-wfp-status {
  color: #94a3b8;
  letter-spacing: .02em;
  align-items: center;
  gap: .3rem;
  font-size: .48rem;
  display: flex;
}

.mk-wfp-status-sep {
  opacity: .4;
}

.mk-wfp-status-dot {
  background: #22c55e;
  border-radius: 50%;
  width: 5px;
  height: 5px;
  animation: 2.5s ease-in-out infinite wfStatusPulse;
}

@keyframes wfStatusPulse {
  0%, 100% {
    opacity: 1;
    box-shadow: 0 0 #22c55e4d;
  }

  50% {
    opacity: .7;
    box-shadow: 0 0 0 3px #22c55e00;
  }
}

.mk-wfp-stage {
  padding: .6rem .9rem;
  position: relative;
  overflow: hidden;
}

.mk-wfp-stage-label {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #94a3b8;
  border-left: 2px solid #f8a05459;
  align-items: center;
  gap: .35rem;
  margin-bottom: .45rem;
  padding-left: .45rem;
  font-size: .42rem;
  font-weight: 700;
  display: flex;
}

.mk-wfp-label-icon {
  opacity: .5;
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  display: flex;
}

.mk-wfp-label-icon svg {
  stroke: #94a3b8;
  width: 10px;
  height: 10px;
}

.mk-wfp-stage-body {
  flex-direction: column;
  display: flex;
}

.mk-wfp-stage-trigger {
  background: #f8a05405;
}

.mk-wfp-event {
  color: #334155;
  align-items: center;
  gap: .4rem;
  font-size: .52rem;
  font-weight: 600;
  line-height: 1.3;
  display: flex;
}

.mk-wfp-event-dot {
  background: var(--color-accent);
  border-radius: 50%;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  animation: 3s ease-in-out infinite wfEventPulse;
  box-shadow: 0 0 0 3px #f8a0541f;
}

@keyframes wfEventPulse {
  0%, 100% {
    box-shadow: 0 0 0 3px #f8a0541f;
  }

  50% {
    box-shadow: 0 0 0 6px #f8a0540a;
  }
}

.mk-wfp-event-detail {
  color: #94a3b8;
  margin-top: .12rem;
  padding-left: 1.15rem;
  font-size: .45rem;
}

.mk-wfp-trigger-flash {
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(135deg, #f8a05414, #0000 60%);
  position: absolute;
  inset: 0;
}

.mk-wf-layout.is-visible .mk-wfp-trigger-flash {
  animation: .6s ease-out .5s both wfTriggerFlash, 5s ease-in-out 3s infinite wfTriggerBreath;
}

@keyframes wfTriggerFlash {
  0% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes wfTriggerBreath {
  0%, 100% {
    opacity: 0;
  }

  25% {
    opacity: .5;
  }

  50% {
    opacity: 0;
  }
}

.mk-wfp-conn {
  justify-content: center;
  padding: 0;
  display: flex;
  position: relative;
}

.mk-wfp-conn-track {
  background: linear-gradient(#f8a05426, #f8a0540f);
  border-radius: 1px;
  width: 2px;
  height: 20px;
  display: block;
  position: relative;
  overflow: hidden;
}

.mk-wfp-conn-energy {
  background: linear-gradient(#0000, #f8a05499, #0000);
  border-radius: 2px;
  width: 4px;
  height: 8px;
  animation: 2.5s ease-in-out infinite wfEnergyFlow;
  position: absolute;
  top: -4px;
  left: -1px;
}

@keyframes wfEnergyFlow {
  0%, 5% {
    opacity: 0;
    top: -8px;
  }

  20% {
    opacity: 1;
  }

  80% {
    opacity: .6;
  }

  95%, 100% {
    opacity: 0;
    top: 20px;
  }
}

.mk-wfp-stage-conditions + .mk-wfp-conn .mk-wfp-conn-energy {
  animation-delay: 1.2s;
}

.mk-wfp-stage-conditions {
  position: relative;
}

.mk-wfp-eval-scan {
  opacity: 0;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(to right, #0000 0%, #f8a05433 20%, #f8a05459 50%, #f8a05433 80%, #0000 100%);
  border-radius: 1px;
  height: 2px;
  position: absolute;
  top: 2rem;
  left: .9rem;
  right: .9rem;
}

.mk-wf-layout.is-visible .mk-wfp-eval-scan {
  animation: 5s ease-in-out 3.5s infinite wfEvalScan;
}

@keyframes wfEvalScan {
  0% {
    opacity: 0;
    top: 1.8rem;
  }

  5% {
    opacity: .8;
  }

  40% {
    opacity: .6;
  }

  45% {
    opacity: 0;
    top: calc(100% - 1rem);
  }

  100% {
    opacity: 0;
    top: calc(100% - 1rem);
  }
}

.mk-wfp-row {
  color: #475569;
  border-radius: 4px;
  align-items: center;
  gap: .4rem;
  margin: 0 -.25rem;
  padding: .2rem .25rem;
  font-size: .52rem;
  line-height: 1.3;
  transition: background .3s;
  display: flex;
}

.mk-wfp-row strong {
  color: #334155;
}

.mk-wfp-check-done {
  opacity: 0;
  color: #fff;
  background: #22c55e;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  display: flex;
  transform: scale(.5);
}

.mk-wfp-check-done svg {
  width: 8px;
  height: 8px;
}

.mk-wf-layout.is-visible .mk-wfp-check-done {
  animation: .4s cubic-bezier(.22, 1, .36, 1) both wfCheckPop;
}

.mk-wfp-check-active {
  opacity: 0;
  background: #f8a05426;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  display: flex;
}

.mk-wfp-check-active-dot {
  background: var(--color-accent);
  border-radius: 50%;
  width: 6px;
  height: 6px;
}

.mk-wfp-check-pending {
  border: 1.5px solid #0e1e311f;
  border-radius: 50%;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
}

.mk-wfp-row-pending {
  opacity: .45;
}

.mk-wfp-row-active {
  background: #f8a0540a;
  border-radius: 4px;
}

.mk-wfp-row-time {
  color: #94a3b8;
  font-variant-numeric: tabular-nums;
  opacity: .7;
  margin-left: auto;
  font-size: .4rem;
}

.mk-wfp-row-spinner {
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  margin-left: auto;
  display: flex;
}

.mk-wfp-row-spinner svg {
  width: 12px;
  height: 12px;
  stroke: var(--color-accent);
  animation: 1s linear infinite wfSpin;
}

@keyframes wfSpin {
  to {
    transform: rotate(360deg);
  }
}

.mk-wfp-matched {
  color: #16a34a;
  opacity: 0;
  background: #22c55e14;
  border: 1px solid #22c55e26;
  border-radius: 20px;
  align-items: center;
  gap: .25rem;
  margin-top: .35rem;
  margin-left: 1.25rem;
  padding: .18rem .55rem;
  font-size: .42rem;
  font-weight: 600;
  display: inline-flex;
}

.mk-wfp-matched svg {
  width: 8px;
  height: 8px;
}

.mk-wfp-footer {
  background: #fafaf84d;
  border-top: 1px solid #0e1e310a;
  align-items: center;
  gap: .5rem;
  padding: .5rem .9rem .6rem;
  display: flex;
}

.mk-wfp-progress {
  background: #0e1e310d;
  border-radius: 2px;
  flex: 1;
  height: 3px;
  position: relative;
  overflow: hidden;
}

.mk-wfp-progress-bar {
  background: linear-gradient(90deg, #22c55e, #f8a054cc);
  border-radius: 2px;
  width: 0%;
  height: 100%;
  position: relative;
}

.mk-wf-layout.is-visible .mk-wfp-progress-bar {
  animation: 2s cubic-bezier(.22, 1, .36, 1) .5s both wfProgressFill;
}

@keyframes wfProgressFill {
  from {
    width: 0%;
  }

  to {
    width: 75%;
  }
}

.mk-wfp-progress-bar:after {
  content: "";
  background: linear-gradient(90deg, #0000 0%, #fff6 50%, #0000 100%);
  width: 100%;
  height: 100%;
  animation: 3s ease-in-out 3s infinite wfProgressShimmer;
  position: absolute;
  top: 0;
  left: -100%;
}

@keyframes wfProgressShimmer {
  0% {
    left: -100%;
  }

  50% {
    left: 100%;
  }

  100% {
    left: 100%;
  }
}

.mk-wfp-progress-label {
  color: #94a3b8;
  white-space: nowrap;
  letter-spacing: .01em;
  font-size: .42rem;
}

.mk-wf-dispatch {
  z-index: 1;
  opacity: 0;
  width: 120px;
  height: 28px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.mk-wf-dispatch-line {
  border-radius: 1px;
  width: 1px;
  height: 100%;
  position: absolute;
  top: 0;
}

.mk-wf-dispatch-1 {
  background: linear-gradient(#f8a05433, #0000);
  left: 30%;
}

.mk-wf-dispatch-2 {
  background: linear-gradient(#22c55e26, #0000);
  height: 120%;
  left: 50%;
}

.mk-wf-dispatch-3 {
  background: linear-gradient(#f8a05426, #0000);
  left: 70%;
}

.mk-wf-layout.is-visible .mk-wf-dispatch {
  animation: .5s 2.2s both wfFadeIn;
}

.mk-wf-dispatch-line:after {
  content: "";
  background: linear-gradient(#f8a05480, #0000);
  border-radius: 2px;
  width: 4px;
  height: 6px;
  position: absolute;
  top: 0;
  left: -1.5px;
}

.mk-wf-dispatch-1:after {
  animation: 3.5s ease-in-out 3s infinite wfDispatchDot;
}

.mk-wf-dispatch-2:after {
  background: linear-gradient(#22c55e66, #0000);
  animation: 3.5s ease-in-out 3.8s infinite wfDispatchDot;
}

.mk-wf-dispatch-3:after {
  animation: 3.5s ease-in-out 4.3s infinite wfDispatchDot;
}

@keyframes wfDispatchDot {
  0%, 5% {
    opacity: 0;
    top: 0;
  }

  15% {
    opacity: .8;
  }

  80% {
    opacity: .3;
  }

  95%, 100% {
    opacity: 0;
    top: calc(100% - 6px);
  }
}

.mk-wf-layout.is-visible .mk-wfp-stage-conditions .mk-wfp-row:first-child .mk-wfp-check-done {
  animation-delay: .8s;
}

.mk-wf-layout.is-visible .mk-wfp-stage-conditions .mk-wfp-row:nth-child(2) .mk-wfp-check-done {
  animation-delay: 1.1s;
}

.mk-wf-layout.is-visible .mk-wfp-stage-conditions .mk-wfp-row:nth-child(3) .mk-wfp-check-done {
  animation-delay: 1.4s;
}

.mk-wf-layout.is-visible .mk-wfp-matched {
  animation: .5s cubic-bezier(.22, 1, .36, 1) 1.7s both wfFadeIn;
}

.mk-wf-layout.is-visible .mk-wfp-stage-actions .mk-wfp-row:first-child .mk-wfp-check-done {
  animation-delay: 2s;
}

.mk-wf-layout.is-visible .mk-wfp-stage-actions .mk-wfp-row:nth-child(2) .mk-wfp-check-done {
  animation-delay: 2.3s;
}

.mk-wf-layout.is-visible .mk-wfp-stage-actions .mk-wfp-row:nth-child(3) .mk-wfp-check-active {
  animation: .4s cubic-bezier(.22, 1, .36, 1) 2.6s both wfActiveDotIn;
}

.mk-wf-layout.is-visible .mk-wfp-check-active-dot {
  animation: 2s ease-in-out 3s infinite wfActivePulse;
}

.mk-wf-layout.is-visible .mk-wfp-stage-conditions .mk-wfp-row:first-child {
  animation: .8s .8s both wfRowHighlight;
}

.mk-wf-layout.is-visible .mk-wfp-stage-conditions .mk-wfp-row:nth-child(2) {
  animation: .8s 1.1s both wfRowHighlight;
}

.mk-wf-layout.is-visible .mk-wfp-stage-conditions .mk-wfp-row:nth-child(3) {
  animation: .8s 1.4s both wfRowHighlight;
}

.mk-wf-layout.is-visible .mk-wfp-stage-actions .mk-wfp-row:first-child {
  animation: .8s 2s both wfRowHighlight;
}

.mk-wf-layout.is-visible .mk-wfp-stage-actions .mk-wfp-row:nth-child(2) {
  animation: .8s 2.3s both wfRowHighlight;
}

@keyframes wfRowHighlight {
  0% {
    background: none;
  }

  30% {
    background: #f8a0540f;
  }

  100% {
    background: none;
  }
}

@keyframes wfCheckPop {
  from {
    opacity: 0;
    transform: scale(.5);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes wfFadeIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes wfActiveDotIn {
  from {
    opacity: 0;
    transform: scale(.5);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes wfActivePulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: .6;
    transform: scale(1.3);
  }
}

.mk-wf-text {
  flex: 1;
  min-width: 0;
}

@media (max-width: 1023px) {
  .mk-wf-panel {
    width: 340px;
  }

  .mk-wf-signal, .mk-wf-dispatch {
    display: none;
  }
}

@media (max-width: 639px) {
  .mk-wf-section {
    padding: 2rem 0 5rem;
  }

  .mk-wf-panel {
    width: 100%;
    max-width: 320px;
  }

  .mk-wfp-header {
    padding: .55rem .7rem;
  }

  .mk-wfp-stage {
    padding: .5rem .7rem;
  }

  .mk-wfp-footer {
    padding: .4rem .7rem .5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-wfp-status-dot, .mk-wfp-event-dot {
    animation: none;
  }

  .mk-wfp-conn-energy {
    opacity: 0;
    animation: none;
  }

  .mk-wfp-eval-scan, .mk-wfp-trigger-flash {
    opacity: 0;
    animation: none !important;
  }

  .mk-wfp-check-active-dot {
    animation: none !important;
  }

  .mk-wfp-progress-bar:after, .mk-wf-dispatch-line:after {
    opacity: 0;
    animation: none;
  }

  .mk-wf-signal-line {
    animation: none !important;
  }

  .mk-wfp-row-spinner svg {
    animation: none;
  }

  .mk-wf-panel, .mk-wfp-check-done {
    opacity: 1;
    transform: none;
    animation: none !important;
  }

  .mk-wfp-check-active, .mk-wfp-matched {
    opacity: 1;
    transform: none;
  }

  .mk-wf-signal {
    opacity: 1;
  }

  .mk-wf-signal-dot {
    opacity: .8;
  }

  .mk-wf-dispatch {
    opacity: 1;
  }

  .mk-wfp-progress-bar {
    width: 75%;
  }

  .mk-wfp-row {
    animation: none !important;
  }
}

.mk-trust-card {
  background: #fff6;
  border: 1px solid #e8e6e166;
  border-radius: 14px;
  padding: 2rem 1.5rem;
  transition: background .4s, border-color .4s;
}

.mk-trust-card:hover {
  background: #ffffffb3;
  border-color: #e8e6e199;
}

.mk-trust-icon {
  width: 40px;
  height: 40px;
  color: var(--color-accent);
  background: #f8a05414;
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  margin: 0 auto 1rem;
  display: flex;
}

.mk-feature-icon {
  width: 32px;
  height: 32px;
  color: var(--color-accent);
  opacity: .7;
  background: #f8a0540f;
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  transition: all .3s;
  display: flex;
}

.mk-feature-row:hover .mk-feature-icon {
  opacity: 1;
  background: #f8a0541a;
}

.mk-accent-word {
  display: inline-block;
  position: relative;
}

.mk-accent-word:after {
  content: "";
  background: var(--color-accent);
  opacity: .35;
  transform-origin: 0;
  border-radius: 2px;
  height: 3px;
  animation: .8s 1s forwards mk-underline-draw;
  position: absolute;
  bottom: .05em;
  left: 0;
  right: 0;
  transform: scaleX(0);
}

@keyframes mk-underline-draw {
  to {
    transform: scaleX(1);
  }
}

.mk-empathy-eyebrow {
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--color-accent);
  opacity: .6;
  font-size: .65rem;
  font-weight: 600;
  display: inline-block;
}

.mk-empathy-headline {
  font-family: var(--font-heading);
  color: var(--color-heading);
  letter-spacing: -.01em;
  font-size: 1.45rem;
  font-weight: 400;
  line-height: 1.55;
}

@media (min-width: 640px) {
  .mk-empathy-headline {
    font-size: 1.7rem;
  }
}

@media (min-width: 1024px) {
  .mk-empathy-headline {
    font-size: 2.05rem;
    line-height: 1.5;
  }
}

.mk-empathy-em {
  color: var(--color-accent);
  opacity: .75;
}

.mk-glass-panel:before {
  content: "";
  background: linear-gradient(90deg, #0000, #f8a0544d 30% 70%, #0000);
  height: 1px;
  position: absolute;
  top: 0;
  left: 18%;
  right: 18%;
}

.mk-pain-headline {
  font-family: var(--font-heading);
  color: var(--color-heading);
  letter-spacing: -.015em;
  margin: 0 0 2px;
  font-size: 1.65rem;
  font-weight: 500;
  line-height: 1.25;
}

.mk-pain-beat {
  opacity: 0;
  transition: opacity .7s, transform .7s;
  display: block;
  transform: translateY(10px);
}

.mk-reveal.is-visible .mk-pain-beat-1 {
  opacity: 1;
  transition-delay: .15s;
  transform: none;
}

.mk-reveal.is-visible .mk-pain-beat-2 {
  opacity: 1;
  transition-delay: .4s;
  transform: none;
}

.mk-reveal.is-visible .mk-pain-beat-3 {
  opacity: 1;
  transition-delay: .75s;
  transform: none;
}

.mk-pain-headline-sub {
  color: var(--color-accent);
  opacity: 0;
}

.mk-reveal.is-visible .mk-pain-headline-sub {
  opacity: .85;
  animation: 2.5s 1.2s both mk-punch-glow;
}

@keyframes mk-punch-glow {
  0% {
    text-shadow: none;
  }

  30% {
    text-shadow: 0 0 20px #f8a05440, 0 0 40px #f8a0541a;
  }

  100% {
    text-shadow: 0 0 12px #f8a0541f;
  }
}

@media (min-width: 640px) {
  .mk-pain-headline {
    font-size: 2rem;
  }
}

@media (min-width: 1024px) {
  .mk-pain-headline {
    font-size: 2.4rem;
  }
}

.mk-pain-divider {
  background: linear-gradient(90deg, #0000, #f8a05459, #0000);
  width: 40px;
  height: 1px;
  margin: 14px auto 16px;
}

.mk-pain-body {
  text-align: left;
  max-width: 540px;
  margin: 0 auto;
}

.mk-pain-body p {
  font-family: var(--font-sans);
  color: var(--color-body);
  margin-bottom: 14px;
  font-size: .88rem;
  font-weight: 400;
  line-height: 1.75;
}

.mk-pain-body p:last-child {
  margin-bottom: 0;
}

@media (min-width: 1024px) {
  .mk-pain-body p {
    font-size: .92rem;
  }
}

.mk-pain-close {
  opacity: .55;
  text-align: center;
  font-style: italic;
  font-family: var(--font-heading) !important;
  color: var(--color-heading) !important;
  margin-top: 14px !important;
  margin-bottom: 0 !important;
  font-size: .95rem !important;
  line-height: 1.6 !important;
}

@media (prefers-reduced-motion: reduce) {
  .mk-pain-beat {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-pain-headline-sub {
    opacity: .85;
  }

  .mk-reveal.is-visible .mk-pain-headline-sub {
    animation: none;
  }
}

.mk-constellation-divider {
  justify-content: center;
  align-items: center;
  gap: 0;
  width: 100px;
  margin: 0 auto;
  display: flex;
  position: relative;
}

.mk-constellation-divider:before, .mk-constellation-divider:after {
  content: "";
  flex: 1;
  height: 1px;
}

.mk-constellation-divider:before {
  background: linear-gradient(90deg, #0000 0%, #f8a05459 100%);
}

.mk-constellation-divider:after {
  background: linear-gradient(90deg, #f8a05459 0%, #0000 100%);
}

.mk-constellation-divider-dot {
  background: var(--color-accent);
  opacity: .45;
  border-radius: 50%;
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  box-shadow: 0 0 8px #f8a0544d;
}

.mk-pivot-phrase {
  font-family: var(--font-heading);
  color: var(--color-heading);
  opacity: .45;
  letter-spacing: .01em;
  font-size: 1.1rem;
  font-style: italic;
  font-weight: 400;
}

@media (min-width: 1024px) {
  .mk-pivot-phrase {
    font-size: 1.25rem;
  }
}

.mk-stat-label {
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--color-heading);
  opacity: .65;
  font-size: .6rem;
  font-weight: 600;
}

.mk-stat-detail {
  color: var(--color-muted);
  letter-spacing: .01em;
  font-size: .72rem;
  line-height: 1.4;
}

.mk-domain-bg {
  pointer-events: none;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-domain-bg-glow {
  background: radial-gradient(#f8a0540a 0%, #0000 70%);
  width: 70%;
  height: 60%;
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
}

.mk-domain-bg-dots span {
  background: var(--color-accent);
  opacity: .12;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  animation: 6s ease-in-out infinite mk-float-dot;
  position: absolute;
}

.mk-domain-bg-dots span:nth-child(2n) {
  animation-duration: 8s;
  animation-delay: -3s;
}

.mk-domain-bg-dots span:nth-child(3n) {
  opacity: .08;
  width: 2px;
  height: 2px;
}

.mk-domain-card {
  z-index: 10;
  text-align: left;
  background: #fafaf8eb;
  border: 1px solid #e8e6e166;
  border-radius: 14px;
  padding: 1.75rem 1.5rem 1.6rem;
  transition: background .4s, border-color .4s, transform .4s, box-shadow .4s;
  position: relative;
}

.mk-domain-card:hover {
  background: #fffffff7;
  border-color: #f8a05440;
  transform: translateY(-3px);
  box-shadow: 0 8px 24px #0e1e310a, 0 2px 6px #f8a0540f;
}

.mk-domain-question {
  font-family: var(--font-heading);
  color: var(--color-heading);
  margin-bottom: .5rem;
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 1.3;
}

.mk-domain-answer {
  font-family: var(--font-sans);
  color: var(--color-body);
  opacity: .85;
  font-size: .8rem;
  line-height: 1.6;
}

.mk-domain-illust {
  width: 44px;
  height: 38px;
  margin-bottom: 1rem;
  transition: transform .4s;
  position: relative;
}

.mk-domain-card:hover .mk-domain-illust {
  transform: translateY(-2px);
}

.mk-di-claim {
  background: #fff9;
  border: 1px solid #0e1e3114;
  border-radius: 5px;
  gap: 3px;
  width: 46px;
  height: 34px;
  padding: 4px;
  display: flex;
  overflow: hidden;
}

.mk-di-claim-sidebar {
  flex-direction: column;
  flex-shrink: 0;
  gap: 2px;
  width: 6px;
  display: flex;
}

.mk-di-claim-sidebar span {
  background: #0e1e3114;
  border-radius: 1px;
  width: 6px;
  height: 4px;
}

.mk-di-claim-sidebar span.is-active {
  background: var(--color-accent);
  opacity: .6;
  animation: 3s infinite mk-domain-pulse;
}

.mk-di-claim-body {
  flex-direction: column;
  flex: 1;
  justify-content: center;
  gap: 3px;
  display: flex;
}

.mk-di-claim-row {
  background: #0e1e310f;
  border-radius: 1px;
  height: 3px;
}

.mk-di-claim-row.short {
  width: 65%;
}

.mk-di-policy {
  width: 34px;
  height: 40px;
}

.mk-di-policy-page {
  background: #ffffffb3;
  border: 1px solid #0e1e3114;
  border-radius: 4px;
  flex-direction: column;
  gap: 3px;
  width: 100%;
  height: 100%;
  padding: 5px 4px;
  display: flex;
}

.mk-di-policy-line {
  background: #0e1e310f;
  border-radius: 1px;
  height: 2px;
}

.mk-di-policy-line.short {
  width: 55%;
}

.mk-di-policy-line.highlight {
  background: #f8a05440;
  position: relative;
}

.mk-di-policy-line.highlight:after {
  content: "";
  background: #f8a0541a;
  border-radius: 2px;
  animation: 4s infinite mk-domain-pulse;
  position: absolute;
  inset: -1px;
}

.mk-di-finance {
  width: 44px;
  height: 36px;
}

.mk-di-finance-chart {
  align-items: flex-end;
  gap: 4px;
  height: 28px;
  padding: 0 2px;
  display: flex;
}

.mk-di-fin-bar {
  height: var(--h, 50%);
  background: #0e1e3114;
  border-radius: 2px 2px 0 0;
  flex: 1;
  transition: height .6s;
}

.mk-di-fin-bar.accent {
  background: #f8a05459;
}

.mk-domain-card:hover .mk-di-fin-bar {
  height: var(--h, 50%);
}

.mk-domain-card:hover .mk-di-fin-bar:first-child {
  height: 55%;
}

.mk-domain-card:hover .mk-di-fin-bar:nth-child(2) {
  height: 80%;
}

.mk-domain-card:hover .mk-di-fin-bar:nth-child(3) {
  height: 65%;
}

.mk-domain-card:hover .mk-di-fin-bar.accent {
  height: 95%;
}

.mk-di-finance-baseline {
  background: #0e1e311a;
  height: 1px;
  margin: 2px 2px 0;
}

.mk-di-docs {
  width: 36px;
  height: 40px;
  position: relative;
}

.mk-di-docs-page {
  background: #ffffffb3;
  border: 1px solid #0e1e3114;
  border-radius: 3px;
  width: 30px;
  height: 36px;
  position: absolute;
}

.mk-di-docs-back {
  opacity: .5;
  top: 0;
  left: 6px;
}

.mk-di-docs-front {
  flex-direction: column;
  gap: 3px;
  padding: 6px 4px;
  display: flex;
  top: 4px;
  left: 0;
}

.mk-di-docs-line {
  background: #0e1e310f;
  border-radius: 1px;
  height: 2px;
}

.mk-di-docs-line.short {
  width: 50%;
}

.mk-di-docs-sig {
  opacity: 0;
  border-bottom: 1.5px solid #f8a05466;
  border-radius: 0 0 0 8px;
  align-self: flex-end;
  width: 16px;
  height: 6px;
  margin-top: auto;
  transition: opacity .5s .1s;
}

.mk-domain-card:hover .mk-di-docs-sig {
  opacity: 1;
}

.mk-di-email {
  width: 42px;
  height: 38px;
}

.mk-di-email-env {
  background: #ffffffb3;
  border: 1px solid #0e1e311a;
  border-radius: 3px;
  width: 32px;
  height: 22px;
  position: relative;
  overflow: hidden;
}

.mk-di-email-flap {
  background: linear-gradient(135deg, #0000 45%, #f8a05414 45% 55%, #0000 55%);
  border-bottom: 1px solid #0e1e310f;
  height: 10px;
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
}

.mk-di-email-threads {
  flex-direction: column;
  gap: 2px;
  margin-top: 4px;
  padding-left: 2px;
  display: flex;
}

.mk-di-email-threads span {
  background: #0e1e310d;
  border-radius: 1px;
  height: 2px;
}

.mk-di-email-threads span:first-child {
  width: 28px;
}

.mk-di-email-threads span:nth-child(2) {
  width: 22px;
}

.mk-di-email-threads span:nth-child(3) {
  width: 16px;
}

.mk-di-ai {
  width: 40px;
  height: 36px;
  position: relative;
}

.mk-di-ai-node {
  background: var(--color-accent);
  opacity: .5;
  border-radius: 50%;
  width: 5px;
  height: 5px;
  position: absolute;
  box-shadow: 0 0 6px #f8a05433;
}

.mk-di-ai-node:first-child {
  animation: 2.5s infinite mk-domain-pulse;
  top: 2px;
  left: 8px;
}

.mk-di-ai-node:nth-child(2) {
  animation: 2.5s .8s infinite mk-domain-pulse;
  top: 2px;
  right: 4px;
}

.mk-di-ai-node:nth-child(3) {
  animation: 2.5s 1.6s infinite mk-domain-pulse;
  bottom: 2px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-di-ai-lines {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-di-ai-lines line {
  stroke: var(--color-accent);
  stroke-width: .8px;
  opacity: .15;
}

.mk-domain-card:hover .mk-di-ai-node {
  opacity: .75;
  box-shadow: 0 0 10px #f8a05459;
}

.mk-domain-card:hover .mk-di-ai-lines line {
  opacity: .3;
}

@keyframes mk-domain-pulse {
  0%, 100% {
    opacity: .5;
  }

  50% {
    opacity: .85;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-domain-bg-dots span, .mk-di-claim-sidebar span.is-active, .mk-di-policy-line.highlight:after, .mk-di-ai-node {
    animation: none;
  }
}

.mk-chaos-zone {
  position: relative;
  overflow: hidden;
}

.mk-chaos-zone > div:not(.mk-chaos-dust):not(.mk-scatter-elements) {
  z-index: 5;
  position: relative;
}

.mk-chaos-dust {
  z-index: 1;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-scatter-elements {
  z-index: 2;
  pointer-events: none;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-scatter-el {
  color: var(--color-accent);
  opacity: 0;
  will-change: opacity, scale, translate;
  transition: opacity 1.2s, scale 1.2s, translate 1.2s;
  position: absolute;
  translate: 0 16px;
  scale: .7;
}

.mk-scatter-el.is-visible {
  translate: 0;
  scale: 1;
}

.mk-scatter-halo {
  background: radial-gradient(circle, #f8a0541a 0%, #0000 70%);
  border-radius: 50%;
  position: absolute;
  inset: -18px;
}

.mk-illust-label {
  text-align: center;
  font-family: var(--font-sans);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-accent);
  opacity: .6;
  margin-top: 6px;
  font-size: .55rem;
  font-weight: 500;
  display: block;
}

.mk-illust {
  z-index: 1;
  position: relative;
}

@media (min-width: 768px) {
  .mk-scatter-el.is-visible {
    opacity: .35;
  }
}

@media (min-width: 1024px) {
  .mk-scatter-el.is-visible {
    opacity: .45;
  }
}

@media (min-width: 1280px) {
  .mk-scatter-el.is-visible {
    opacity: .5;
  }
}

.mk-scatter-alerts {
  top: 2%;
  left: 28%;
}

.mk-scatter-tasks {
  top: 3%;
  right: 22%;
}

.mk-scatter-email {
  top: 16%;
  left: 4%;
}

.mk-scatter-phone {
  top: 14%;
  right: 5%;
}

.mk-scatter-doc {
  top: 34%;
  right: 4%;
}

.mk-scatter-sheet {
  top: 44%;
  left: 3%;
}

.mk-scatter-dollar {
  top: 56%;
  left: 6%;
}

.mk-scatter-calendar {
  top: 64%;
  right: 3%;
}

.mk-scatter-inspect {
  top: 80%;
  left: 8%;
}

.mk-scatter-alerts.is-visible {
  animation: 18s linear 1.2s infinite mk-drift-1;
}

.mk-scatter-tasks.is-visible {
  animation: 20s linear 1.2s infinite mk-drift-2;
}

.mk-scatter-email.is-visible {
  animation: 22s linear 1.2s infinite mk-drift-3;
}

.mk-scatter-phone.is-visible {
  animation: 19s linear 1.2s infinite mk-drift-4;
}

.mk-scatter-doc.is-visible {
  animation: 21s linear 1.2s infinite mk-drift-5;
}

.mk-scatter-sheet.is-visible {
  animation: 23s linear 1.2s infinite mk-drift-6;
}

.mk-scatter-dollar.is-visible {
  animation: 20s linear 1.2s infinite mk-drift-7;
}

.mk-scatter-calendar.is-visible {
  animation: 24s linear 1.2s infinite mk-drift-8;
}

.mk-scatter-inspect.is-visible {
  animation: 22s linear 1.2s infinite mk-drift-9;
}

@keyframes mk-drift-1 {
  0% {
    transform: translate(0)rotate(-2deg);
  }

  18% {
    transform: translate(12px, -18px)rotate(5deg);
  }

  35% {
    transform: translate(-8px, -6px)rotate(-4deg);
  }

  55% {
    transform: translate(18px, 10px)rotate(3deg);
  }

  72% {
    transform: translate(-4px, 16px)rotate(-6deg);
  }

  88% {
    transform: translate(8px, -10px)rotate(2deg);
  }

  100% {
    transform: translate(0)rotate(-2deg);
  }
}

@keyframes mk-drift-2 {
  0% {
    transform: translate(0)rotate(1deg);
  }

  15% {
    transform: translate(-14px, 12px)rotate(-5deg);
  }

  30% {
    transform: translate(6px, 20px)rotate(4deg);
  }

  50% {
    transform: translate(-18px, -4px)rotate(-3deg);
  }

  68% {
    transform: translate(10px, -14px)rotate(6deg);
  }

  85% {
    transform: translate(-6px, 8px)rotate(-2deg);
  }

  100% {
    transform: translate(0)rotate(1deg);
  }
}

@keyframes mk-drift-3 {
  0% {
    transform: translate(0)rotate(0);
  }

  20% {
    transform: translate(16px, 8px)rotate(6deg);
  }

  40% {
    transform: translate(-10px, -16px)rotate(-5deg);
  }

  55% {
    transform: translate(20px, -6px)rotate(3deg);
  }

  75% {
    transform: translate(-14px, 12px)rotate(-4deg);
  }

  90% {
    transform: translate(4px, -8px)rotate(2deg);
  }

  100% {
    transform: translate(0)rotate(0);
  }
}

@keyframes mk-drift-4 {
  0% {
    transform: translate(0)rotate(-1deg);
  }

  16% {
    transform: translate(-12px, -20px)rotate(4deg);
  }

  33% {
    transform: translate(14px, 6px)rotate(-6deg);
  }

  50% {
    transform: translate(-6px, 18px)rotate(3deg);
  }

  70% {
    transform: translate(18px, -8px)rotate(-5deg);
  }

  86% {
    transform: translate(-10px, -4px)rotate(2deg);
  }

  100% {
    transform: translate(0)rotate(-1deg);
  }
}

@keyframes mk-drift-5 {
  0% {
    transform: translate(0)rotate(2deg);
  }

  22% {
    transform: translate(-18px, 14px)rotate(-4deg);
  }

  38% {
    transform: translate(8px, -12px)rotate(6deg);
  }

  58% {
    transform: translate(-14px, -8px)rotate(-3deg);
  }

  76% {
    transform: translate(16px, 10px)rotate(5deg);
  }

  92% {
    transform: translate(-4px, -16px)rotate(-2deg);
  }

  100% {
    transform: translate(0)rotate(2deg);
  }
}

@keyframes mk-drift-6 {
  0% {
    transform: translate(0)rotate(-3deg);
  }

  18% {
    transform: translate(14px, 16px)rotate(5deg);
  }

  36% {
    transform: translate(-20px, 4px)rotate(-4deg);
  }

  52% {
    transform: translate(6px, -18px)rotate(3deg);
  }

  74% {
    transform: translate(-8px, 12px)rotate(-6deg);
  }

  88% {
    transform: translate(12px, -6px)rotate(2deg);
  }

  100% {
    transform: translate(0)rotate(-3deg);
  }
}

@keyframes mk-drift-7 {
  0% {
    transform: translate(0)rotate(1deg);
  }

  20% {
    transform: translate(-16px, -10px)rotate(-5deg);
  }

  42% {
    transform: translate(12px, 14px)rotate(4deg);
  }

  56% {
    transform: translate(-4px, -20px)rotate(-3deg);
  }

  78% {
    transform: translate(18px, 6px)rotate(6deg);
  }

  90% {
    transform: translate(-8px, -8px)rotate(-2deg);
  }

  100% {
    transform: translate(0)rotate(1deg);
  }
}

@keyframes mk-drift-8 {
  0% {
    transform: translate(0)rotate(-2deg);
  }

  15% {
    transform: translate(10px, -16px)rotate(4deg);
  }

  34% {
    transform: translate(-18px, 8px)rotate(-6deg);
  }

  50% {
    transform: translate(14px, 18px)rotate(3deg);
  }

  72% {
    transform: translate(-6px, -12px)rotate(-4deg);
  }

  88% {
    transform: translate(16px, 4px)rotate(5deg);
  }

  100% {
    transform: translate(0)rotate(-2deg);
  }
}

@keyframes mk-drift-9 {
  0% {
    transform: translate(0)rotate(2deg);
  }

  18% {
    transform: translate(-14px, 12px)rotate(-5deg);
  }

  38% {
    transform: translate(18px, -6px)rotate(3deg);
  }

  55% {
    transform: translate(-8px, -16px)rotate(-4deg);
  }

  74% {
    transform: translate(12px, 14px)rotate(6deg);
  }

  90% {
    transform: translate(-16px, -2px)rotate(-3deg);
  }

  100% {
    transform: translate(0)rotate(2deg);
  }
}

.mk-illust-inbox {
  background: #ffffff80;
  border: 1px solid #e8e6e199;
  border-radius: 6px;
  width: 64px;
  height: 52px;
  overflow: hidden;
}

.mk-inbox-header {
  background: #f8a0541f;
  align-items: center;
  gap: 2px;
  height: 8px;
  padding: 0 3px;
  display: flex;
}

.mk-inbox-dot {
  background: var(--color-accent);
  opacity: .5;
  border-radius: 50%;
  width: 2px;
  height: 2px;
}

.mk-inbox-list {
  flex-direction: column;
  gap: 2px;
  padding: 3px;
  display: flex;
}

.mk-inbox-msg {
  background: #f8a0540a;
  border-radius: 2px;
  align-items: center;
  gap: 3px;
  height: 8px;
  padding: 0 2px;
  display: flex;
}

.mk-msg-avatar {
  background: #f8a05440;
  border-radius: 50%;
  flex-shrink: 0;
  width: 5px;
  height: 5px;
}

.mk-msg-lines {
  flex-direction: column;
  flex: 1;
  gap: 1.5px;
  min-width: 0;
  display: flex;
}

.mk-msg-lines span {
  background: var(--color-accent);
  opacity: .15;
  border-radius: 1px;
  height: 1.5px;
}

.mk-msg-lines span:last-child {
  width: 60%;
}

.mk-inbox-msg-1 {
  animation: 6s ease-in-out infinite mk-inbox-cycle;
}

.mk-inbox-msg-2 {
  animation: 6s ease-in-out 1.5s infinite mk-inbox-cycle;
}

.mk-inbox-msg-3 {
  animation: 6s ease-in-out 3s infinite mk-inbox-cycle;
}

.mk-inbox-msg-4 {
  opacity: .4;
}

@keyframes mk-inbox-cycle {
  0%, 27% {
    transform: translateY(calc(-3 * var(--inbox-row-h)));
  }

  33%, 60% {
    transform: translateY(calc(-2 * var(--inbox-row-h)));
  }

  67%, 93% {
    transform: translateY(calc(-1 * var(--inbox-row-h)));
  }

  100% {
    transform: translateY(0);
  }
}

@media (min-width: 1024px) {
  .mk-illust-inbox {
    width: 76px;
    height: 60px;
  }
}

.mk-illust-files {
  width: 56px;
  height: 62px;
  position: relative;
}

.mk-file {
  background: #ffffff8c;
  border: 1px solid #e8e6e199;
  border-radius: 3px;
  flex-direction: column;
  gap: 3px;
  width: 36px;
  height: 46px;
  padding: 6px 4px;
  display: flex;
  position: absolute;
}

.mk-file-line {
  background: var(--color-accent);
  opacity: .18;
  border-radius: 1px;
  height: 1.5px;
}

.mk-file-line.short {
  width: 55%;
}

.mk-file-1 {
  animation: 8s ease-in-out infinite alternate mk-file-shuffle-1;
  top: 0;
  left: 0;
  transform: rotate(-8deg);
}

.mk-file-2 {
  animation: 9s ease-in-out infinite alternate mk-file-shuffle-2;
  top: 2px;
  left: 10px;
  transform: rotate(-2deg);
}

.mk-file-3 {
  animation: 7s ease-in-out infinite alternate mk-file-shuffle-3;
  top: 4px;
  left: 16px;
  transform: rotate(4deg);
}

.mk-file-4 {
  z-index: 1;
  animation: 10s ease-in-out infinite alternate mk-file-shuffle-4;
  top: 6px;
  left: 8px;
  transform: rotate(8deg);
}

@keyframes mk-file-shuffle-1 {
  0% {
    transform: rotate(-8deg)translate(0);
  }

  100% {
    transform: rotate(-5deg)translate(4px, -3px);
  }
}

@keyframes mk-file-shuffle-2 {
  0% {
    transform: rotate(-2deg)translate(0);
  }

  100% {
    transform: rotate(1deg)translate(-3px, 2px);
  }
}

@keyframes mk-file-shuffle-3 {
  0% {
    transform: rotate(4deg)translate(0);
  }

  100% {
    transform: rotate(7deg)translate(2px, -4px);
  }
}

@keyframes mk-file-shuffle-4 {
  0% {
    transform: rotate(8deg)translate(0);
  }

  100% {
    transform: rotate(5deg)translate(-4px, 3px);
  }
}

@media (min-width: 1024px) {
  .mk-illust-files {
    width: 66px;
    height: 72px;
  }

  .mk-file {
    width: 42px;
    height: 54px;
  }
}

.mk-illust-grid {
  background: #ffffff80;
  border: 1px solid #e8e6e199;
  border-radius: 4px;
  width: 64px;
  height: 50px;
  position: relative;
  overflow: hidden;
}

.mk-grid-header {
  background: #f8a0541a;
  border-bottom: 1px solid #e8e6e166;
  height: 7px;
}

.mk-grid-rows {
  flex-direction: column;
  gap: 1px;
  padding: 2px;
  display: flex;
}

.mk-grid-row {
  gap: 2px;
  display: flex;
}

.mk-grid-row span {
  background: #f8a0540f;
  border: .5px solid #e8e6e14d;
  border-radius: 1px;
  flex: 1;
  height: 6px;
}

.mk-grid-shimmer {
  background: linear-gradient(105deg, #0000 30%, #f8a05414 48%, #f8a0541f 50%, #f8a05414 52%, #0000 70%);
  animation: 4s ease-in-out infinite mk-grid-sweep;
  position: absolute;
  inset: 0;
}

@keyframes mk-grid-sweep {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(100%);
  }
}

@media (min-width: 1024px) {
  .mk-illust-grid {
    width: 76px;
    height: 58px;
  }
}

.mk-illust-phone {
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
  position: relative;
}

.mk-phone-icon {
  z-index: 1;
  filter: drop-shadow(0 0 3px #f8a05426);
  width: 24px;
  height: 24px;
  position: relative;
}

.mk-ring {
  border: 1px solid var(--color-accent);
  opacity: 0;
  border-radius: 50%;
  animation: 3s ease-out infinite mk-ring-pulse;
  position: absolute;
  inset: 0;
}

.mk-ring-2 {
  animation-delay: 1s;
}

@keyframes mk-ring-pulse {
  0% {
    opacity: .4;
    transform: scale(.5);
  }

  100% {
    opacity: 0;
    transform: scale(1.6);
  }
}

.mk-phone-badge {
  color: #fff;
  z-index: 2;
  background: #e85d4a;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  font-size: .45rem;
  font-weight: 700;
  animation: 2s ease-in-out infinite mk-badge-pulse;
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
}

@keyframes mk-badge-pulse {
  0%, 100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.15);
  }
}

@media (min-width: 1024px) {
  .mk-illust-phone {
    width: 48px;
    height: 48px;
  }

  .mk-phone-icon {
    width: 28px;
    height: 28px;
  }
}

.mk-illust-cal {
  background: #ffffff80;
  border: 1px solid #e8e6e199;
  border-radius: 4px;
  width: 54px;
  height: 50px;
  overflow: hidden;
}

.mk-cal-header {
  background: #f8a05426;
  border-bottom: 1px solid #e8e6e166;
  height: 9px;
}

.mk-cal-grid {
  grid-template-columns: repeat(5, 1fr);
  gap: 1.5px;
  padding: 3px;
  display: grid;
}

.mk-cal-grid span {
  background: #0e1e310f;
  border-radius: 1px;
  height: 5px;
}

.mk-cal-deadline {
  border-radius: 1px;
  animation: 2.5s ease-in-out infinite mk-deadline-pulse;
  background: #e85d4a59 !important;
}

@keyframes mk-deadline-pulse {
  0%, 100% {
    background: #e85d4a40;
  }

  50% {
    background: #e85d4a8c;
  }
}

@media (min-width: 1024px) {
  .mk-illust-cal {
    width: 62px;
    height: 58px;
  }
}

.mk-illust-finance {
  align-items: flex-end;
  gap: 3px;
  width: 56px;
  height: 44px;
  padding: 0 4px;
  display: flex;
  position: relative;
}

.mk-fin-bar {
  background: #f8a05433;
  border: .5px solid #f8a05426;
  border-radius: 2px 2px 0 0;
  flex: 1;
}

.mk-fin-bar-1 {
  height: 55%;
  animation: 5s ease-in-out infinite alternate mk-fin-grow;
}

.mk-fin-bar-2 {
  height: 80%;
  animation: 6s ease-in-out .5s infinite alternate mk-fin-grow;
}

.mk-fin-bar-3 {
  height: 40%;
  animation: 4.5s ease-in-out 1s infinite alternate mk-fin-grow;
}

.mk-fin-bar-4 {
  height: 95%;
  animation: 5.5s ease-in-out .3s infinite alternate mk-fin-grow;
}

.mk-fin-bar-5 {
  height: 65%;
  animation: 7s ease-in-out .8s infinite alternate mk-fin-grow;
}

.mk-fin-line {
  background: var(--color-accent);
  opacity: .15;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

@keyframes mk-fin-grow {
  0% {
    transform: scaleY(1);
  }

  100% {
    transform: scaleY(.6);
  }
}

@media (min-width: 1024px) {
  .mk-illust-finance {
    width: 66px;
    height: 52px;
  }
}

.mk-illust-checklist {
  background: #ffffff80;
  border: 1px solid #e8e6e199;
  border-radius: 4px;
  width: 46px;
  height: 56px;
  position: relative;
  overflow: hidden;
}

.mk-check-clip {
  background: #f8a05433;
  border-radius: 0 0 3px 3px;
  width: 18px;
  height: 5px;
  margin: 0 auto;
}

.mk-check-body {
  flex-direction: column;
  gap: 4px;
  padding: 5px 4px 4px;
  display: flex;
}

.mk-check-row {
  align-items: center;
  gap: 3px;
  display: flex;
}

.mk-check-box {
  border: .5px solid #f8a0544d;
  border-radius: 1px;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  position: relative;
}

.mk-check-box:after {
  content: "";
  background: var(--color-accent);
  opacity: 0;
  border-radius: .5px;
  position: absolute;
  inset: 1px;
}

.mk-check-anim-1:after {
  animation: 8s ease-in-out infinite mk-check-appear;
}

.mk-check-anim-2:after {
  animation: 8s ease-in-out 2s infinite mk-check-appear;
}

.mk-check-anim-3:after {
  animation: 8s ease-in-out 4s infinite mk-check-appear;
}

.mk-check-anim-4:after {
  animation: 8s ease-in-out 6s infinite mk-check-appear;
}

@keyframes mk-check-appear {
  0%, 15% {
    opacity: 0;
    transform: scale(0);
  }

  20%, 85% {
    opacity: .6;
    transform: scale(1);
  }

  90%, 100% {
    opacity: 0;
    transform: scale(0);
  }
}

.mk-check-text {
  background: var(--color-accent);
  opacity: .12;
  border-radius: 1px;
  flex: 1;
  height: 1.5px;
}

@media (min-width: 1024px) {
  .mk-illust-checklist {
    width: 54px;
    height: 66px;
  }
}

.mk-illust-alerts {
  justify-content: center;
  align-items: center;
  width: 38px;
  height: 38px;
  display: flex;
  position: relative;
}

.mk-alert-bell {
  z-index: 1;
  filter: drop-shadow(0 0 3px #f8a05426);
  width: 24px;
  height: 24px;
  position: relative;
}

.mk-alert-badge {
  color: #fff;
  z-index: 2;
  background: #e85d4a;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  font-size: .42rem;
  font-weight: 700;
  animation: 2s ease-in-out infinite mk-badge-pulse;
  display: flex;
  position: absolute;
  top: 1px;
  right: 1px;
}

.mk-alert-ping {
  border: 1px solid var(--color-accent);
  opacity: 0;
  border-radius: 50%;
  animation: 3.5s ease-out infinite mk-ring-pulse;
  position: absolute;
  inset: 2px;
}

@media (min-width: 1024px) {
  .mk-illust-alerts {
    width: 46px;
    height: 46px;
  }

  .mk-alert-bell {
    width: 28px;
    height: 28px;
  }
}

.mk-illust-tasks {
  background: #ffffff80;
  border: 1px solid #e8e6e199;
  border-radius: 5px;
  flex-direction: column;
  gap: 4px;
  width: 54px;
  padding: 5px;
  display: flex;
}

.mk-task-item {
  align-items: center;
  gap: 4px;
  display: flex;
}

.mk-task-check {
  border: .5px solid #f8a05459;
  border-radius: 2px;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  position: relative;
}

.mk-task-check:after {
  content: "";
  background: var(--color-accent);
  opacity: 0;
  border-radius: 1px;
  position: absolute;
  inset: 1px;
}

.mk-task-anim-1 .mk-task-check:after {
  animation: 8s ease-in-out .5s infinite mk-check-appear;
}

.mk-task-anim-2 .mk-task-check:after {
  animation: 8s ease-in-out 2.5s infinite mk-check-appear;
}

.mk-task-anim-3 .mk-task-check:after {
  animation: 8s ease-in-out 4.5s infinite mk-check-appear;
}

.mk-task-line {
  background: var(--color-accent);
  opacity: .12;
  border-radius: 1px;
  flex: 1;
  height: 2px;
}

@media (min-width: 1024px) {
  .mk-illust-tasks {
    width: 64px;
    padding: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-scatter-el {
    animation: none;
  }

  .mk-chaos-dust {
    display: none;
  }
}

.mk-pullquote {
  padding: 3rem 0;
  position: relative;
}

.mk-pullquote:before {
  content: "";
  background: linear-gradient(90deg, transparent, var(--color-accent), transparent);
  opacity: .4;
  border-radius: 2px;
  width: 60px;
  height: 3px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.mk-parallax {
  will-change: transform;
  transition: transform .1s linear;
}

.mk-dot-grid {
  position: relative;
}

.mk-dot-grid:after {
  content: "";
  pointer-events: none;
  z-index: 0;
  background-image: radial-gradient(circle, #0e1e310a 1px, #0000 1px);
  background-size: 24px 24px;
  position: absolute;
  inset: -2rem;
  -webkit-mask-image: radial-gradient(#000 30%, #0000 70%);
  mask-image: radial-gradient(#000 30%, #0000 70%);
}

.mk-dot-grid > * {
  z-index: 1;
  position: relative;
}

.mk-midcta-rule {
  align-items: center;
  gap: 12px;
  max-width: 280px;
  margin: 0 auto 1.5rem;
  display: flex;
}

.mk-midcta-rule-line {
  background: linear-gradient(90deg, #0000, #0e1e3114 40%, #f8a05426 50%, #0e1e3114 60%, #0000);
  flex: 1;
  height: 1px;
}

.mk-midcta-rule-diamond {
  background: #f8a05459;
  border-radius: 1px;
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  animation: 5s ease-in-out infinite mk-midcta-diamond-pulse;
  transform: rotate(45deg);
  box-shadow: 0 0 6px #f8a0541a;
}

@keyframes mk-midcta-diamond-pulse {
  0%, 100% {
    opacity: .5;
  }

  50% {
    opacity: 1;
    box-shadow: 0 0 10px #f8a0542e;
  }
}

.mk-midcta-text {
  color: #0e1e3173;
  letter-spacing: -.005em;
  font-size: 1rem;
  line-height: 1.6;
}

.mk-midcta-link {
  color: #0e1e3166;
  padding: 12px 16px;
  font-size: .85rem;
  font-weight: 500;
  text-decoration: none;
  transition: color .25s;
}

.mk-midcta-link:hover {
  color: var(--color-accent);
}

@media (prefers-reduced-motion: reduce) {
  .mk-midcta-rule-diamond {
    opacity: .7;
    animation: none;
  }
}

.mk-pivot {
  padding: 5rem 0 3rem;
}

@media (min-width: 1024px) {
  .mk-pivot {
    padding: 7rem 0 4rem;
  }
}

.mk-pivot-ambient {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  inset: 0;
}

.mk-pivot-wash {
  pointer-events: none;
  border-radius: 50%;
  position: absolute;
}

.mk-pivot-wash-1 {
  background: radial-gradient(circle, #f8a0540a 0%, #0000 70%);
  width: 600px;
  height: 600px;
  top: -10%;
  left: -8%;
}

.mk-pivot-wash-2 {
  background: radial-gradient(circle, #0e1e3105 0%, #0000 70%);
  width: 500px;
  height: 500px;
  top: 20%;
  right: -5%;
}

.mk-pivot-wash-3 {
  background: radial-gradient(circle, #f8a05409 0%, #0000 70%);
  width: 600px;
  height: 600px;
  bottom: -15%;
  left: 20%;
}

.mk-river {
  z-index: 1;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-pivot-content {
  flex-direction: column;
  gap: 3rem;
  display: flex;
}

.mk-pivot-headline {
  max-width: 440px;
  margin-left: 0;
  margin-right: auto;
}

.mk-pivot-rule {
  align-items: center;
  gap: 10px;
  margin-bottom: 1.75rem;
  display: flex;
}

.mk-pivot-rule-line {
  background: var(--color-border);
  width: 32px;
  height: 1px;
  display: block;
}

.mk-pivot-rule-diamond {
  background: var(--color-accent);
  opacity: .4;
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  transform: rotate(45deg);
}

.mk-pivot-card {
  align-items: flex-start;
  gap: 1.25rem;
  max-width: 400px;
  display: flex;
  position: relative;
}

.mk-pivot-card-right {
  margin-left: auto;
  margin-right: 4%;
}

.mk-pivot-card-left {
  margin-left: 8%;
  margin-right: auto;
}

.mk-pivot-card-text {
  border-left: 2px solid #f8a05438;
  padding-left: .875rem;
  position: relative;
}

.mk-pivot-illus {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  position: relative;
}

.mk-pivot-illus:before {
  content: "";
  pointer-events: none;
  background: radial-gradient(circle, #f8a0540a 0%, #0000 70%);
  border: 1px solid #f8a0541f;
  border-radius: 14px;
  position: absolute;
  inset: -6px;
}

.mk-pivot-illus:after {
  content: "";
  pointer-events: none;
  border-top: 1.5px solid #f8a05440;
  border-left: 1.5px solid #f8a05440;
  border-radius: 2px 0 0;
  width: 10px;
  height: 10px;
  position: absolute;
  top: -2px;
  left: -2px;
}

.mk-illus-doc {
  border: 1px solid var(--color-border);
  background: #fff;
  border-radius: 2px;
  flex-direction: column;
  gap: 4px;
  width: 36px;
  height: 48px;
  padding: 8px 6px;
  display: flex;
  position: absolute;
  top: 8px;
  left: 8px;
}

.mk-illus-doc-line {
  background: #0e1e311f;
  border-radius: 1px;
  height: 1px;
  display: block;
}

.mk-illus-doc-line-2 {
  width: 85%;
}

.mk-illus-doc-line-3 {
  width: 70%;
}

.mk-illus-doc-line-4 {
  width: 90%;
}

.mk-illus-doc-line-5 {
  width: 60%;
}

.mk-illus-mag {
  background: #fffc;
  border: 1.5px solid #f8a0544d;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  position: absolute;
  bottom: 10px;
  right: 12px;
  overflow: hidden;
}

.mk-illus-mag:after {
  content: "";
  background: #f8a0544d;
  border-radius: 1px;
  width: 8px;
  height: 1.5px;
  position: absolute;
  bottom: -6px;
  right: -4px;
  transform: rotate(45deg);
}

.mk-illus-mag-highlight {
  background: #f8a05440;
  border-radius: 1px;
  width: 12px;
  height: 1.5px;
  display: block;
  position: absolute;
  top: 6px;
  left: 4px;
}

.mk-illus-mag-highlight-2 {
  width: 9px;
  top: 10px;
}

.mk-illus-scan {
  background: linear-gradient(90deg, #0000, #f8a05433, #0000);
  width: 36px;
  height: 2px;
  animation: 4s ease-in-out infinite mk-illus-scan-sweep;
  position: absolute;
  top: 8px;
  left: 8px;
}

@keyframes mk-illus-scan-sweep {
  0%, 100% {
    opacity: 0;
    top: 8px;
  }

  10% {
    opacity: 1;
  }

  90% {
    opacity: 1;
  }

  95%, 100% {
    opacity: 0;
    top: 52px;
  }
}

.mk-illus-chip {
  background: #f8a0541f;
  border-radius: 2px;
  width: 16px;
  height: 5px;
  animation: 4s ease-in-out infinite mk-illus-chip-fade;
  position: absolute;
  right: 0;
}

.mk-illus-chip-1 {
  animation-delay: .5s;
  top: 12px;
}

.mk-illus-chip-2 {
  width: 20px;
  animation-delay: 1s;
  top: 22px;
}

.mk-illus-chip-3 {
  width: 14px;
  animation-delay: 1.5s;
  top: 32px;
}

@keyframes mk-illus-chip-fade {
  0%, 20% {
    opacity: 0;
    transform: translateX(-4px);
  }

  40%, 80% {
    opacity: 1;
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    transform: translateX(-4px);
  }
}

.mk-illus-gear {
  border: 1.5px solid #f8a05440;
  border-radius: 50%;
  width: 28px;
  height: 28px;
  animation: 20s linear infinite mk-illus-gear-spin;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mk-illus-gear-inner {
  background: #f8a05414;
  border-radius: 50%;
  position: absolute;
  inset: 5px;
}

.mk-illus-gear-tooth {
  background: #f8a05433;
  border-radius: 1px;
  width: 6px;
  height: 4px;
  position: absolute;
}

.mk-illus-gear-tooth-1 {
  top: -3px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-illus-gear-tooth-2 {
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-illus-gear-tooth-3 {
  top: 50%;
  left: -3px;
  transform: translateY(-50%)rotate(90deg);
}

.mk-illus-gear-tooth-4 {
  top: 50%;
  right: -3px;
  transform: translateY(-50%)rotate(90deg);
}

@keyframes mk-illus-gear-spin {
  from {
    transform: translate(-50%, -50%)rotate(0);
  }

  to {
    transform: translate(-50%, -50%)rotate(360deg);
  }
}

.mk-illus-flow-arrows {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-illus-arrow-path {
  stroke-dasharray: 4 4;
  animation: 3s linear infinite mk-illus-flow-dash;
}

@keyframes mk-illus-flow-dash {
  to {
    stroke-dashoffset: -16px;
  }
}

.mk-illus-result {
  color: #f8a05466;
  font-size: 6px;
  line-height: 1;
  position: absolute;
}

.mk-illus-result-top {
  top: 4px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-illus-result-right {
  top: 50%;
  right: 2px;
  transform: translateY(-50%);
}

.mk-illus-result-bottom {
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
}

.mk-illus-frame {
  border: 1px solid var(--color-border);
  background: #fff;
  border-radius: 4px;
  width: 64px;
  height: 52px;
  position: absolute;
  top: 50%;
  left: 50%;
  overflow: hidden;
  transform: translate(-50%, -50%);
}

.mk-illus-frame-bar {
  background: #f8a05414;
  align-items: center;
  gap: 2px;
  height: 7px;
  padding-left: 3px;
  display: flex;
}

.mk-illus-frame-dot {
  background: #f8a05440;
  border-radius: 50%;
  width: 2px;
  height: 2px;
}

.mk-illus-frame-grid {
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  padding: 3px;
  display: grid;
}

.mk-illus-panel {
  background: #f8a0540a;
  border-radius: 1px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 2px;
  height: 16px;
  padding: 2px 3px;
  display: flex;
  overflow: hidden;
}

.mk-illus-panel-lines i {
  background: #0e1e3114;
  border-radius: 1px;
  height: 1px;
  display: block;
}

.mk-illus-panel-lines i:first-child {
  width: 80%;
}

.mk-illus-panel-lines i:nth-child(2) {
  width: 60%;
}

.mk-illus-panel-lines i:nth-child(3) {
  width: 70%;
}

.mk-illus-panel-bars {
  flex-direction: row;
  align-items: flex-end;
  gap: 2px;
  padding-bottom: 3px;
}

.mk-illus-panel-bars i {
  background: #f8a05426;
  border-radius: 1px;
  width: 4px;
  display: block;
}

.mk-illus-panel-bars i:first-child {
  height: 5px;
}

.mk-illus-panel-bars i:nth-child(2) {
  height: 9px;
}

.mk-illus-panel-bars i:nth-child(3) {
  height: 7px;
}

.mk-illus-panel-circle {
  justify-content: center;
  align-items: center;
}

.mk-illus-panel-circle i {
  border: 1px solid #f8a05426;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.mk-illus-panel-stack i {
  background: #0e1e310f;
  border-radius: 1px;
  width: 100%;
  height: 2px;
  display: block;
}

.mk-illus-shimmer {
  background: linear-gradient(110deg, #0000 30%, #f8a0540f 50%, #0000 70%);
  width: 100%;
  height: 100%;
  animation: 6s ease-in-out infinite mk-illus-shimmer-sweep;
  position: absolute;
  top: 0;
  left: -100%;
}

@keyframes mk-illus-shimmer-sweep {
  0%, 100% {
    left: -100%;
  }

  50% {
    left: 100%;
  }
}

.mk-pivot-accents {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  inset: 0;
}

.mk-pivot-shape {
  display: block;
  position: absolute;
}

.mk-pivot-diamond {
  background: var(--color-accent);
  opacity: .08;
  width: 7px;
  height: 7px;
  animation: 18s ease-in-out infinite mk-pivot-float;
  transform: rotate(45deg);
}

.mk-pivot-ring {
  border: 1px solid #f8a0540f;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  animation: 22s ease-in-out -4s infinite mk-pivot-float-alt;
}

.mk-pivot-dot {
  background: var(--color-accent);
  opacity: .08;
  border-radius: 50%;
  width: 4px;
  height: 4px;
  animation: 16s ease-in-out -8s infinite mk-pivot-float-alt;
}

.mk-pivot-cross {
  opacity: .05;
  width: 10px;
  height: 10px;
  animation: 20s ease-in-out -6s infinite mk-pivot-float-alt;
  position: relative;
}

.mk-pivot-cross:before, .mk-pivot-cross:after {
  content: "";
  background: var(--color-accent);
  border-radius: 1px;
  position: absolute;
}

.mk-pivot-cross:before {
  width: 100%;
  height: 1px;
  top: 50%;
  transform: translateY(-50%);
}

.mk-pivot-cross:after {
  width: 1px;
  height: 100%;
  left: 50%;
  transform: translateX(-50%);
}

@keyframes mk-pivot-float {
  0%, 100% {
    transform: translateY(0)rotate(45deg);
  }

  33% {
    transform: translateY(-10px)rotate(45deg);
  }

  66% {
    transform: translateY(5px)rotate(45deg);
  }
}

@keyframes mk-pivot-float-alt {
  0%, 100% {
    transform: translateY(0);
  }

  33% {
    transform: translateY(-10px);
  }

  66% {
    transform: translateY(5px);
  }
}

@media (max-width: 767px) {
  .mk-pivot-card {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .mk-pivot-illus {
    width: 56px;
    height: 56px;
  }

  .mk-pivot-card-left {
    flex-direction: row;
  }

  .mk-pivot-accents {
    opacity: .7;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-pivot-shape {
    animation: none;
  }

  .mk-river {
    display: none;
  }

  .mk-illus-scan {
    opacity: 0;
    animation: none;
  }

  .mk-illus-chip {
    opacity: .6;
    animation: none;
    transform: none;
  }

  .mk-illus-gear, .mk-illus-arrow-path {
    animation: none;
  }

  .mk-illus-shimmer {
    animation: none;
    display: none;
  }
}

.mk-panel-particle {
  pointer-events: none;
  background: #f8a05414;
  border-radius: 50%;
  position: absolute;
}

.mk-finale {
  background: var(--color-primary);
  padding: 0;
}

.mk-finale-wave {
  z-index: 4;
  width: 100%;
  height: auto;
  margin-bottom: -1px;
  display: block;
  position: relative;
}

.mk-finale-fog {
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(180deg, #0e1e3100 0%, #0e1e3126 30%, #0e1e318c 55%, #0e1e31d9 75%, var(--color-primary) 100%);
  height: 600px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.mk-finale-glow-warm {
  background: radial-gradient(#f8a05408 0%, #0000 70%);
  border-radius: 50%;
  width: 600px;
  height: 500px;
  position: absolute;
  top: 20%;
  left: -10%;
}

.mk-finale-glow-cool {
  background: radial-gradient(#ffffff04 0%, #0000 70%);
  border-radius: 50%;
  width: 500px;
  height: 400px;
  position: absolute;
  top: 35%;
  right: -8%;
}

.mk-finale-glow-accent {
  background: radial-gradient(#f8a05405 0%, #0000 70%);
  border-radius: 50%;
  width: 400px;
  height: 350px;
  position: absolute;
  bottom: 5%;
  left: 30%;
}

.mk-finale-grid {
  background-image: radial-gradient(circle, #ffffff05 1px, #0000 1px);
  background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(#0000 0%, #00000026 30%, #00000059 70%, #00000080 100%);
  mask-image: linear-gradient(#0000 0%, #00000026 30%, #00000059 70%, #00000080 100%);
}

.mk-finale-rule {
  justify-content: center;
  align-items: center;
  gap: 12px;
  width: 120px;
  display: flex;
}

.mk-finale-rule-line {
  background: linear-gradient(90deg, #0000, #f8a05440);
  flex: 1;
  height: 1px;
}

.mk-finale-rule-line:last-child {
  background: linear-gradient(90deg, #f8a05440, #0000);
}

.mk-finale-rule-diamond {
  background: #f8a0544d;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
}

.mk-finale-headline-accent {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(90deg, #f8a054e6 0%, #fbb87ab3 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.mk-finale-horizon-line {
  background: linear-gradient(90deg, #0000 0%, #ffffff0f 20%, #f8a0541f 50%, #ffffff0f 80%, #0000 100%);
  height: 1px;
}

@media (prefers-reduced-motion: reduce) {
  .mk-finale-canvas {
    display: none;
  }

  .mk-finale-wave animate {
    animation-play-state: paused;
  }

  .mk-finale-wave path {
    d: path("M0,0 L0,150 Q180,180 360,160 Q540,140 720,155 Q900,170 1080,150 Q1260,135 1440,158 L1440,0 Z");
  }
}

.mk-scroll-progress {
  background: linear-gradient(90deg, var(--color-accent), var(--color-accent-hover));
  z-index: 9998;
  transform-origin: 0;
  will-change: transform;
  pointer-events: none;
  width: 100%;
  height: 2px;
  position: fixed;
  top: 0;
  left: 0;
  transform: scaleX(0);
}

.mk-btn-primary {
  transition: background-color .3s, box-shadow .3s, transform .3s;
  position: relative;
  overflow: hidden;
}

.mk-btn-primary:before {
  content: "";
  opacity: 0;
  background: linear-gradient(135deg, #ffffff26, #0000 60%);
  transition: opacity .3s;
  position: absolute;
  inset: 0;
}

.mk-btn-primary:hover:before {
  opacity: 1;
}

.mk-btn-primary:hover {
  box-shadow: 0 4px 16px #f8a05440, 0 2px 4px #f8a05426;
}

.mk-btn-navy:hover {
  box-shadow: 0 4px 16px #0e1e3133, 0 2px 4px #0e1e311a;
}

.mk-arrow-link {
  position: relative;
}

.mk-arrow-link:after {
  content: "";
  opacity: .3;
  background: currentColor;
  width: 0;
  height: 1px;
  transition: width .3s;
  position: absolute;
  bottom: -2px;
  left: 0;
}

.mk-arrow-link:hover:after {
  width: calc(100% - 1.25rem);
}

.mk-arrow-link svg {
  transition: transform .4s cubic-bezier(.34, 1.56, .64, 1);
}

.mk-arrow-link:hover svg {
  transform: translateX(4px);
}

.mk-hero-fade {
  background: linear-gradient(to bottom, transparent, var(--color-primary) 30%, var(--color-surface));
  pointer-events: none;
}

.mk-founder-section {
  padding: 5rem 0 4rem;
}

@media (min-width: 1024px) {
  .mk-founder-section {
    padding: 7rem 0 5rem;
  }
}

.mk-founder-ambient {
  pointer-events: none;
  z-index: 0;
  position: absolute;
  inset: 0;
}

.mk-founder-accent {
  filter: blur(80px);
  border-radius: 50%;
  position: absolute;
}

.mk-founder-accent-1 {
  background: #f8a0540a;
  width: 280px;
  height: 240px;
  animation: 16s cubic-bezier(.45, 0, .55, 1) infinite alternate founderAccentDrift;
  top: -10%;
  right: -5%;
}

.mk-founder-accent-2 {
  background: #6366f106;
  width: 200px;
  height: 200px;
  animation: 20s cubic-bezier(.45, 0, .55, 1) infinite alternate-reverse founderAccentDrift;
  bottom: 5%;
  left: -8%;
}

.mk-founder-accent-3 {
  background: #22c55e05;
  width: 160px;
  height: 160px;
  animation: 18s cubic-bezier(.45, 0, .55, 1) -6s infinite alternate founderAccentDrift;
  top: 40%;
  left: 50%;
}

@keyframes founderAccentDrift {
  from {
    opacity: .5;
    transform: translate(0);
  }

  to {
    opacity: 1;
    transform: translate(15px, -12px);
  }
}

.mk-founder-rule {
  justify-content: center;
  align-items: center;
  gap: .75rem;
  margin-bottom: 2.5rem;
  display: flex;
}

.mk-founder-rule-line {
  background: linear-gradient(90deg, #0000, #e8e6e180, #0000);
  width: 48px;
  height: 1px;
}

.mk-founder-rule-diamond {
  background: #f8a0544d;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
}

.mk-founder-identity {
  text-align: center;
  flex-direction: column;
  align-items: center;
  margin-bottom: 2rem;
  display: flex;
}

.mk-founder-photo-wrap {
  margin-bottom: 1rem;
  position: relative;
}

.mk-founder-photo {
  z-index: 2;
  background-position: center;
  background-size: cover;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  position: relative;
}

@media (min-width: 1024px) {
  .mk-founder-photo {
    width: 96px;
    height: 96px;
  }
}

.mk-founder-photo-ring {
  z-index: 1;
  border: 1.5px solid #f8a05426;
  border-radius: 50%;
  animation: 6s cubic-bezier(.45, 0, .55, 1) infinite founderRingBreathe;
  position: absolute;
  inset: -4px;
}

.mk-founder-photo-ring:after {
  content: "";
  z-index: 0;
  background: radial-gradient(circle, #f8a0540f 0%, #0000 70%);
  border-radius: 50%;
  position: absolute;
  inset: -8px;
}

@keyframes founderRingBreathe {
  0%, 100% {
    opacity: .5;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.04);
  }
}

.mk-founder-meta {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.mk-founder-name {
  font-family: var(--font-heading);
  color: var(--color-heading);
  letter-spacing: -.01em;
  font-size: .95rem;
  font-weight: 600;
}

.mk-founder-title {
  color: #94a3b8;
  letter-spacing: .02em;
  margin-top: .15rem;
  font-size: .7rem;
}

.mk-founder-quote-wrap {
  text-align: center;
  max-width: 520px;
  margin: 0 auto;
  position: relative;
}

.mk-founder-quotemark {
  color: #f8a05414;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
  margin-bottom: 0;
  font-family: Georgia, Times New Roman, serif;
  font-size: 6rem;
  line-height: .5;
  display: block;
}

.mk-founder-quote {
  color: #0e1e3173;
  margin-bottom: 1rem;
  font-size: .92rem;
  font-style: italic;
  line-height: 1.85;
}

.mk-founder-quote:last-child {
  margin-bottom: 0;
}

.mk-founder-quote-emphasis {
  font-size: 1rem;
  font-family: var(--font-heading);
  color: #0e1e31b3;
  letter-spacing: .005em;
  padding: .5rem 0;
  font-style: italic;
  font-weight: 500;
  line-height: 1.75;
  position: relative;
}

.mk-founder-quote-emphasis:before, .mk-founder-quote-emphasis:after {
  content: "";
  background: #f8a05433;
  width: 20px;
  height: 1px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.mk-founder-quote-emphasis:before {
  margin-right: 12px;
  right: 100%;
}

.mk-founder-quote-emphasis:after {
  margin-left: 12px;
  left: 100%;
}

.mk-founder-quote-close {
  color: #0e1e3199;
  font-size: .88rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.8;
}

@media (min-width: 1024px) {
  .mk-founder-quote {
    font-size: .95rem;
  }

  .mk-founder-quote-emphasis {
    font-size: 1.15rem;
  }

  .mk-founder-quote-close {
    font-size: .92rem;
  }
}

.mk-founder-commitments {
  border-top: 1px solid #e8e6e166;
  margin-top: 3.5rem;
  padding: 2.5rem 0;
}

.mk-founder-commit-row {
  flex-direction: column;
  gap: 1.5rem;
  display: flex;
}

@media (min-width: 640px) {
  .mk-founder-commit-row {
    flex-direction: row;
    align-items: flex-start;
  }
}

.mk-founder-commitment {
  text-align: center;
  flex: 1;
}

.mk-founder-commit-sep {
  display: none;
}

@media (min-width: 640px) {
  .mk-founder-commit-sep {
    background: linear-gradient(#0000, #e8e6e180 20% 80%, #0000);
    flex-shrink: 0;
    align-self: stretch;
    width: 1px;
    display: block;
  }
}

.mk-founder-commit-illus {
  width: 36px;
  height: 36px;
  color: var(--color-accent);
  opacity: .5;
  margin: 0 auto .75rem;
  transition: opacity .4s;
}

.mk-founder-commitment:hover .mk-founder-commit-illus {
  opacity: .75;
}

.mk-founder-commit-illus svg {
  width: 100%;
  height: 100%;
}

.mk-founder-commit-title {
  color: var(--color-heading);
  letter-spacing: -.005em;
  margin-bottom: .35rem;
  font-size: .82rem;
  font-weight: 600;
}

.mk-founder-commit-desc {
  color: #64748b;
  max-width: 180px;
  margin: 0 auto;
  font-size: .72rem;
  line-height: 1.6;
}

@media (prefers-reduced-motion: reduce) {
  .mk-founder-accent {
    animation: none;
  }

  .mk-founder-photo-ring {
    opacity: .8;
    animation: none;
  }
}

.mk-trade-pill {
  border: 1px solid #0000;
  border-radius: 100px;
  padding: .25rem .75rem;
  transition: border-color .25s, background .25s, color .25s;
  display: inline-block;
}

.mk-trade-pill:hover {
  background: #f8a0540d;
  border-color: #f8a05433;
}

.mk-tab-icon {
  width: 20px;
  height: 20px;
  color: var(--color-accent);
  background: #f8a05414;
  border-radius: 5px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  transition: background .2s;
  display: inline-flex;
}

button:hover .mk-tab-icon, button[class*="border-l-accent"] .mk-tab-icon {
  background: #f8a05426;
}

.mk-check-item {
  opacity: 0;
  transition: opacity .4s, transform .4s;
  transform: translateX(-8px);
}

.mk-check-item.is-visible, .is-visible .mk-check-item {
  opacity: 1;
  transform: translateX(0);
}

.mk-orbit-atmo {
  animation: 10s ease-in-out infinite alternate mk-orbit-atmo-pulse;
}

@keyframes mk-orbit-atmo-pulse {
  0% {
    opacity: .35;
    transform: translate(-50%, -50%)scale(1);
  }

  100% {
    opacity: .7;
    transform: translate(-50%, -50%)scale(1.06);
  }
}

.mk-orbit-atmo-secondary {
  animation: 14s ease-in-out infinite alternate mk-orbit-atmo-secondary;
}

@keyframes mk-orbit-atmo-secondary {
  0% {
    opacity: .3;
    transform: scale(1.02);
  }

  100% {
    opacity: .6;
    transform: scale(.96);
  }
}

.mk-orbit-ring {
  opacity: 0;
  transition: opacity 1.8s .2s;
}

.is-visible .mk-orbit-ring {
  opacity: 1;
}

.mk-orbit-line-inner {
  stroke-dasharray: 195;
  stroke-dashoffset: 195px;
  transition: stroke-dashoffset 1.2s cubic-bezier(.22, 1, .36, 1);
}

.mk-orbit-line-outer {
  stroke-dasharray: 320;
  stroke-dashoffset: 320px;
  transition: stroke-dashoffset 1.6s cubic-bezier(.22, 1, .36, 1);
}

.is-visible .mk-orbit-line-inner, .is-visible .mk-orbit-line-outer {
  stroke-dashoffset: 0;
}

.mk-orbit-pulse {
  opacity: 0;
}

.is-visible .mk-orbit-pulse {
  opacity: 1;
  transition: opacity .5s 1.5s;
}

.mk-orbit-particle {
  opacity: 0;
}

.is-visible .mk-orbit-particle {
  opacity: 1;
  transition: opacity 1.2s 2s;
}

.mk-orbit-center-glow {
  filter: blur(28px);
  background: radial-gradient(#f8a05417 0%, #f8a05408 45%, #0000 70%);
  animation: 6s ease-in-out infinite alternate mk-orbit-center-breathe;
}

@keyframes mk-orbit-center-breathe {
  0% {
    opacity: .4;
    transform: scale(1);
  }

  100% {
    opacity: 1;
    transform: scale(1.18);
  }
}

.mk-orbit-ground-shadow {
  animation: 6s ease-in-out infinite alternate mk-orbit-ground-breathe;
}

@keyframes mk-orbit-ground-breathe {
  0% {
    opacity: .5;
    transform: translateX(-50%)scaleX(.9);
  }

  100% {
    opacity: .8;
    transform: translateX(-50%)scaleX(1.05);
  }
}

.mk-orbit-card-surface {
  opacity: 0;
  transition: opacity .8s .3s;
}

.is-visible .mk-orbit-card-surface {
  opacity: 1;
}

.mk-orbit-accent {
  opacity: 0;
  transition: opacity 1s 2.2s;
}

.is-visible .mk-orbit-accent {
  opacity: 1;
}

.mk-orbit-node {
  opacity: 0;
  filter: blur(5px);
  transition: opacity .7s, filter .7s;
  transform: translate(-50%, -50%);
}

.is-visible .mk-orbit-node {
  opacity: 1;
  filter: blur();
}

.mk-vignette {
  transition: box-shadow .4s cubic-bezier(.22, 1, .36, 1), border-color .3s, transform .4s cubic-bezier(.22, 1, .36, 1);
  position: relative;
  overflow: hidden;
}

.mk-vignette:before {
  content: "";
  opacity: .6;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(90deg, #0000, #ffffffb3, #ffffff4d, #0000);
  width: 140%;
  height: 1px;
  position: absolute;
  top: 0;
  left: -20%;
}

.mk-vignette:after {
  content: "";
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  background: linear-gradient(#ffffff59, #0000);
  height: 40%;
  transition: opacity .3s;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.mk-vignette > * {
  z-index: 1;
  position: relative;
}

.mk-vignette:hover {
  border-color: #f8a0542e;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px #0000000f, 0 16px 40px #00000008 !important;
}

.mk-vignette:hover:after {
  opacity: 1;
}

.mk-orbit-node:hover .mk-drift {
  animation-play-state: paused;
}

.mk-orbit-node:hover .mk-vignette {
  z-index: 30;
}

.mk-orbit-progress-fill {
  position: relative;
  overflow: hidden;
}

.mk-orbit-progress-fill:after {
  content: "";
  background: linear-gradient(90deg, #0000, #fff6, #0000);
  animation: 3s ease-in-out infinite mk-v-shimmer;
  position: absolute;
  inset: 0;
}

@keyframes mk-v-shimmer {
  0% {
    transform: translateX(-100%);
  }

  50% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(100%);
  }
}

.mk-v-task-check {
  opacity: 0;
  transform: scale(0);
}

.is-visible .mk-v-task-check {
  animation: 6s infinite mk-v-check-appear;
}

@keyframes mk-v-check-appear {
  0%, 15% {
    opacity: 0;
    transform: scale(0);
  }

  25%, 75% {
    opacity: 1;
    transform: scale(1);
  }

  85%, 100% {
    opacity: 0;
    transform: scale(0);
  }
}

.is-visible .mk-v-task-box {
  animation: 6s infinite mk-v-box-fill;
}

@keyframes mk-v-box-fill {
  0%, 15% {
    background: none;
    border-color: #f8a05440;
  }

  25%, 75% {
    background: #4ade8014;
    border-color: #4ade8066;
  }

  85%, 100% {
    background: none;
    border-color: #f8a05440;
  }
}

.is-visible .mk-v-claim-new {
  animation: 5s ease-in-out infinite mk-v-claim-pulse;
}

@keyframes mk-v-claim-pulse {
  0%, 100% {
    opacity: .55;
  }

  50% {
    opacity: 1;
  }
}

.is-visible .mk-v-email-new {
  animation: 7s infinite mk-v-email-in;
}

@keyframes mk-v-email-in {
  0%, 5% {
    opacity: 0;
    transform: translateY(-6px);
  }

  15%, 85% {
    opacity: 1;
    transform: translateY(0);
  }

  95%, 100% {
    opacity: 0;
    transform: translateY(-6px);
  }
}

.is-visible .mk-v-doc-line {
  animation: 5s infinite mk-v-doc-appear;
}

@keyframes mk-v-doc-appear {
  0%, 10% {
    opacity: 0;
    transform-origin: 0;
    transform: scaleX(0);
  }

  30%, 80% {
    opacity: 1;
    transform: scaleX(1);
  }

  95%, 100% {
    opacity: 0;
    transform-origin: 0;
    transform: scaleX(0);
  }
}

.mk-v-bar {
  transform-origin: bottom;
  transform: scaleY(0);
}

.is-visible .mk-v-bar {
  animation: 4s cubic-bezier(.22, 1, .36, 1) infinite mk-v-bar-grow;
}

@keyframes mk-v-bar-grow {
  0%, 5% {
    transform: scaleY(0);
  }

  25%, 80% {
    transform: scaleY(1);
  }

  95%, 100% {
    transform: scaleY(0);
  }
}

.is-visible .mk-v-cal-today {
  animation: 4s ease-in-out infinite mk-v-cal-pulse;
}

@keyframes mk-v-cal-pulse {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 0 2px #f8a05426;
  }
}

.is-visible .mk-v-photo {
  animation: 8s ease-in-out infinite mk-v-photo-cycle;
}

@keyframes mk-v-photo-cycle {
  0%, 100% {
    opacity: .5;
  }

  50% {
    opacity: 1;
  }
}

.mk-v-chart-line {
  stroke-dasharray: 180;
  stroke-dashoffset: 180px;
}

.is-visible .mk-v-chart-line {
  animation: 5s cubic-bezier(.22, 1, .36, 1) infinite mk-v-chart-draw;
}

@keyframes mk-v-chart-draw {
  0%, 5% {
    stroke-dashoffset: 180px;
  }

  30%, 80% {
    stroke-dashoffset: 0;
  }

  95%, 100% {
    stroke-dashoffset: 180px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-orbit-atmo {
    opacity: .5;
    animation: none;
  }

  .mk-orbit-atmo-secondary {
    opacity: .4;
    animation: none;
  }

  .mk-orbit-center-glow {
    opacity: .7;
    animation: none;
  }

  .mk-orbit-ground-shadow {
    opacity: .6;
    animation: none;
  }

  .mk-orbit-node {
    filter: none;
    transition: opacity .3s;
  }

  .mk-orbit-line-inner, .mk-orbit-line-outer {
    stroke-dashoffset: 0;
    transition: none;
  }

  .mk-orbit-ring {
    opacity: 1;
    transition: none;
  }

  .mk-orbit-pulse, .mk-orbit-particle {
    display: none;
  }

  .mk-orbit-card-surface, .mk-orbit-accent {
    opacity: 1;
    transition: none;
  }

  .mk-orbit-progress-fill:after {
    animation: none;
    display: none;
  }

  .mk-v-task-check, .mk-v-task-box {
    animation: none !important;
  }

  .mk-v-claim-new {
    opacity: .8;
    animation: none !important;
  }

  .mk-v-email-new, .mk-v-doc-line {
    opacity: 1;
    transform: none;
    animation: none !important;
  }

  .mk-v-bar {
    transform: scaleY(1);
    animation: none !important;
  }

  .mk-v-cal-today {
    animation: none !important;
  }

  .mk-v-photo {
    opacity: 1;
    animation: none !important;
  }

  .mk-v-chart-line {
    stroke-dashoffset: 0;
    animation: none !important;
  }
}

.mk-nebula-host {
  background: linear-gradient(170deg, #141e2c 0%, var(--color-primary) 20%, #050c16 100%);
}

.mk-nebula {
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
  position: absolute;
  inset: -25%;
}

.mk-nebula-blob {
  will-change: transform;
  border-radius: 50%;
  position: absolute;
}

.mk-nebula-blob-1 {
  background: radial-gradient(circle, #f8a05433 0%, #f8a0540a 55%, #0000 80%);
  width: 55%;
  height: 55%;
  animation: 45s cubic-bezier(.45, 0, .55, 1) infinite alternate mk-neb-1;
  top: -10%;
  left: -8%;
}

.mk-nebula-blob-2 {
  background: radial-gradient(circle, #121e2c66 0%, #121e2c14 55%, #0000 80%);
  width: 50%;
  height: 50%;
  animation: 55s cubic-bezier(.45, 0, .55, 1) infinite alternate mk-neb-2;
  top: 5%;
  right: -15%;
}

.mk-nebula-blob-3 {
  background: radial-gradient(circle, #64b4ff1a 0%, #64b4ff05 55%, #0000 80%);
  width: 45%;
  height: 45%;
  animation: 50s cubic-bezier(.45, 0, .55, 1) infinite alternate mk-neb-3;
  bottom: -15%;
  left: 20%;
}

.mk-nebula-blob-4 {
  background: radial-gradient(circle, #f8a0541f 0%, #0000 70%);
  width: 35%;
  height: 35%;
  animation: 60s cubic-bezier(.45, 0, .55, 1) infinite alternate mk-neb-4;
  bottom: 0%;
  right: 10%;
}

.mk-nebula-blob-5 {
  background: radial-gradient(circle, #b48cff0f 0%, #0000 70%);
  width: 30%;
  height: 30%;
  animation: 65s cubic-bezier(.45, 0, .55, 1) infinite alternate mk-neb-5;
  top: 30%;
  left: 35%;
}

@keyframes mk-neb-1 {
  0% {
    transform: translate(0)scale(1);
  }

  50% {
    transform: translate(55px, 30px)scale(1.06);
  }

  100% {
    transform: translate(-20px, 45px)scale(.97);
  }
}

@keyframes mk-neb-2 {
  0% {
    transform: translate(0)scale(1);
  }

  50% {
    transform: translate(-40px, 35px)scale(1.05);
  }

  100% {
    transform: translate(25px, -20px)scale(.96);
  }
}

@keyframes mk-neb-3 {
  0% {
    transform: translate(0)scale(1);
  }

  50% {
    transform: translate(35px, -28px)scale(1.05);
  }

  100% {
    transform: translate(-25px, -15px)scale(.97);
  }
}

@keyframes mk-neb-4 {
  0% {
    transform: translate(0)scale(1);
  }

  50% {
    transform: translate(-20px, -22px)scale(1.07);
  }

  100% {
    transform: translate(30px, 12px)scale(.95);
  }
}

@keyframes mk-neb-5 {
  0% {
    transform: translate(0)scale(1);
  }

  50% {
    transform: translate(22px, 18px)scale(1.06);
  }

  100% {
    transform: translate(-15px, -12px)scale(.97);
  }
}

.mk-nebula-shimmer {
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(108deg, #0000 35%, #ffffff03 42%, #ffffff08 50%, #ffffff03 58%, #0000 65%) 0 0 / 250% 100%;
  animation: 45s cubic-bezier(.45, 0, .55, 1) infinite mk-neb-shimmer;
  position: absolute;
  inset: 0;
}

@keyframes mk-neb-shimmer {
  0% {
    background-position: 250% 0;
  }

  100% {
    background-position: -250% 0;
  }
}

.mk-nebula-glow {
  pointer-events: none;
  opacity: 0;
  z-index: 2;
  background: radial-gradient(circle, #f8a05412 0%, #f8a05405 35%, #0000 65%);
  border-radius: 50%;
  width: 550px;
  height: 550px;
  transition: left .6s cubic-bezier(.45, 0, .55, 1), top .6s cubic-bezier(.45, 0, .55, 1), opacity .8s cubic-bezier(.45, 0, .55, 1);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mk-nebula-grain {
  opacity: .3;
  pointer-events: none;
  z-index: 3;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 256px 256px;
  position: absolute;
  inset: 0;
}

.mk-nebula-vignette {
  pointer-events: none;
  z-index: 4;
  background: radial-gradient(75% 65% at 50% 45%, #0000 25%, #050c168c 100%);
  position: absolute;
  inset: 0;
}

@media (max-width: 767px) {
  .mk-nebula {
    filter: blur(60px);
  }

  .mk-nebula-glow {
    opacity: .5;
    transform: scale(.7);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .mk-reveal {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-hero-enter {
    opacity: 1;
    animation: none;
  }

  .mk-hero-bg:after {
    animation: none;
  }

  .mk-feature-row, .mk-feature-row:before {
    transition: none;
  }

  .mk-float, .mk-float-slow, .mk-drift, .mk-flow-line:after {
    animation: none;
  }

  .mk-accent-word:after {
    animation: none;
    transform: scaleX(1);
  }

  .mk-parallax {
    transition: none;
  }

  .mk-stat-card:hover {
    transform: none;
  }

  .mk-pricing-canvas {
    display: none;
  }

  .mk-pricing-beam-spinner {
    opacity: 0;
    animation: none;
  }

  .mk-pricing-halo {
    opacity: .8;
    animation: none;
  }

  .mk-pricing-bridge-line:after {
    opacity: 0;
    animation: none;
  }

  .mk-pricing-cta-btn:after {
    opacity: .5;
    animation: none;
  }

  .mk-pricing-savings-fill {
    width: 100%;
    transition: none;
  }

  .mk-check-item {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-scroll-progress {
    display: none;
  }

  .mk-signal-dot {
    opacity: 1;
    animation: none;
  }

  .mk-neural-line {
    animation: none;
  }

  .mk-neural-core {
    animation: none;
    box-shadow: 0 0 16px #f8a0541a;
  }

  .mk-neural-node.mk-float, .mk-neural-node.mk-float-slow, .mk-neural-node.mk-drift {
    animation: none;
  }

  .mk-hero-blob {
    animation: none !important;
  }

  .mk-hero-haze, .mk-hero-washes:before, .mk-hero-washes:after {
    animation: none;
  }

  .mk-mockup-shimmer {
    opacity: 0;
    animation: none;
  }

  .mk-mockup-sheen {
    display: none;
  }

  .mk-hero-btn-primary:before, .mk-hero-btn-ghost:before {
    animation: none;
  }

  .mk-hero-btn-primary {
    animation: none;
    box-shadow: 0 0 20px #f8a05426, 0 0 60px #f8a0540f;
  }

  .mk-hero-mockup-3d {
    animation: none;
  }

  .mk-hero-mockup-shell {
    transition: none;
    transform: rotateY(-10deg)rotateX(2deg)scale(1.18);
  }

  .mk-hero-mockup-shell:before {
    animation: none;
  }

  .mk-hero-mockup-glow {
    opacity: .8;
    opacity: .8;
    animation: none;
  }

  .mk-nebula-blob {
    animation: none !important;
  }

  .mk-nebula-shimmer {
    opacity: 0 !important;
    animation: none !important;
  }

  .mk-nebula-glow {
    display: none;
  }

  .mk-stagger > * {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-ambient-dot {
    opacity: .2;
    animation: none !important;
  }

  .mk-stagger.is-visible .mk-pipeline-dot:before {
    animation: none;
  }
}

.mk-pa-term {
  animation: 20s ease-in-out infinite mk-pa-drift;
}

@keyframes mk-pa-drift {
  0%, 100% {
    translate: 0;
  }

  25% {
    translate: 3px -5px;
  }

  50% {
    translate: -2px 4px;
  }

  75% {
    translate: 4px -2px;
  }
}

.mk-pa-lifecycle-fill {
  animation: 2s cubic-bezier(.22, 1, .36, 1) .8s both mk-pa-fill;
}

@keyframes mk-pa-fill {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-pa-term {
    animation: none;
  }

  .mk-pa-lifecycle-fill {
    animation: none;
    transform: scaleX(1);
  }

  .mk-pa-hero-notif {
    opacity: 1;
    animation: none;
    transform: none;
  }
}

.mk-pa-hero-notif {
  opacity: 0;
}

.mk-pa-hero-notif-1 {
  animation: .7s cubic-bezier(.34, 1.56, .64, 1) 1.2s both mk-pa-notif-enter-r, 8s ease-in-out 2s infinite mk-pa-notif-float-1;
}

.mk-pa-hero-notif-2 {
  animation: .7s cubic-bezier(.34, 1.56, .64, 1) 1.6s both mk-pa-notif-enter-r, 10s ease-in-out 2.4s infinite mk-pa-notif-float-2;
}

.mk-pa-hero-notif-3 {
  animation: .6s cubic-bezier(.34, 1.56, .64, 1) 1.9s both mk-pa-notif-enter-l, 9s ease-in-out 2.6s infinite mk-pa-notif-float-3;
}

.mk-pa-hero-notif-4 {
  animation: .6s cubic-bezier(.34, 1.56, .64, 1) 1.4s both mk-pa-notif-enter-l, 11s ease-in-out 2.1s infinite mk-pa-notif-float-4;
}

@keyframes mk-pa-notif-enter-r {
  0% {
    opacity: 0;
    transform: translateX(24px)scale(.92);
  }

  60% {
    opacity: 1;
    transform: translateX(-3px)scale(1.01);
  }

  100% {
    opacity: 1;
    transform: translateX(0)scale(1);
  }
}

@keyframes mk-pa-notif-enter-l {
  0% {
    opacity: 0;
    transform: translateX(-20px)scale(.92);
  }

  60% {
    opacity: 1;
    transform: translateX(2px)scale(1.01);
  }

  100% {
    opacity: 1;
    transform: translateX(0)scale(1);
  }
}

@keyframes mk-pa-notif-float-1 {
  0%, 100% {
    transform: translate(0);
  }

  25% {
    transform: translate(2px, -4px);
  }

  50% {
    transform: translate(-1px, 3px);
  }

  75% {
    transform: translate(3px, -1px);
  }
}

@keyframes mk-pa-notif-float-2 {
  0%, 100% {
    transform: translate(0);
  }

  30% {
    transform: translate(-3px, -2px);
  }

  60% {
    transform: translate(2px, 4px);
  }

  85% {
    transform: translate(-1px, -3px);
  }
}

@keyframes mk-pa-notif-float-3 {
  0%, 100% {
    transform: translate(0);
  }

  20% {
    transform: translate(3px, 2px);
  }

  50% {
    transform: translate(-2px, -3px);
  }

  80% {
    transform: translate(1px, 4px);
  }
}

@keyframes mk-pa-notif-float-4 {
  0%, 100% {
    transform: translate(0);
  }

  35% {
    transform: translate(-2px, 3px);
  }

  65% {
    transform: translate(3px, -2px);
  }

  90% {
    transform: translate(-1px, 1px);
  }
}

.mk-roof-term {
  animation: 24s cubic-bezier(.25, .46, .45, .94) infinite mk-storm-settle;
}

@keyframes mk-storm-settle {
  0%, 100% {
    translate: 0;
    rotate: none;
  }

  15% {
    translate: 2px 6px;
    rotate: .5deg;
  }

  35% {
    translate: -1px 3px;
    rotate: -.3deg;
  }

  55% {
    translate: 3px 8px;
    rotate: .8deg;
  }

  75% {
    translate: -2px 5px;
    rotate: -.5deg;
  }

  90% {
    translate: 1px 2px;
    rotate: .2deg;
  }
}

.mk-notif-card {
  opacity: 0;
  transform: translateX(24px)scale(.96);
}

.mk-reveal.is-visible .mk-notif-card {
  animation: .5s cubic-bezier(.34, 1.56, .64, 1) both mk-notif-enter;
}

@keyframes mk-notif-enter {
  0% {
    opacity: 0;
    transform: translateX(24px)scale(.96);
  }

  60% {
    opacity: 1;
    transform: translateX(-3px)scale(1.01);
  }

  100% {
    opacity: 1;
    transform: translateX(0)scale(1);
  }
}

.mk-reveal.is-visible .mk-notif-card:nth-child(2) {
  animation-delay: .15s;
}

.mk-reveal.is-visible .mk-notif-card:nth-child(3) {
  animation-delay: .3s;
}

.mk-reveal.is-visible .mk-notif-card:nth-child(4) {
  animation-delay: .45s;
}

.mk-reveal.is-visible .mk-notif-card:nth-child(5) {
  animation-delay: .6s;
}

.mk-reveal.is-visible .mk-notif-card:nth-child(6) {
  animation-delay: .75s;
}

@keyframes mk-tab-breathe {
  0%, 100% {
    box-shadow: 0 0 16px #f8a0540f;
  }

  50% {
    box-shadow: 0 0 24px #f8a0541f;
  }
}

@keyframes mk-page-stack {
  0% {
    opacity: 0;
    transform: translateY(30px)rotate(1deg);
  }

  70% {
    opacity: 1;
    transform: translateY(-2px)rotate(-.2deg);
  }

  100% {
    opacity: 1;
    transform: translateY(0)rotate(0);
  }
}

.mk-workflow-spine-fill {
  transform-origin: top;
  transform: scaleY(0);
}

.mk-reveal.is-visible .mk-workflow-spine-fill {
  animation: 1.8s cubic-bezier(.22, 1, .36, 1) .3s both mk-workflow-fill;
}

@keyframes mk-workflow-fill {
  from {
    transform: scaleY(0);
  }

  to {
    transform: scaleY(1);
  }
}

.mk-workflow-node {
  opacity: 0;
  position: relative;
  transform: scale(.5);
}

.mk-workflow-node:before {
  content: "";
  background: var(--color-primary);
  z-index: -1;
  border-radius: 16px;
  position: absolute;
  inset: -6px;
}

.mk-reveal.is-visible .mk-workflow-node {
  animation: .4s cubic-bezier(.34, 1.56, .64, 1) both mk-workflow-node-pop;
}

.mk-reveal.is-visible .mk-workflow-node-1 {
  animation-delay: .35s;
}

.mk-reveal.is-visible .mk-workflow-node-2 {
  animation-delay: .7s;
}

.mk-reveal.is-visible .mk-workflow-node-3 {
  animation-delay: 1.05s;
}

.mk-reveal.is-visible .mk-workflow-node-4 {
  animation-delay: 1.4s;
}

@keyframes mk-workflow-node-pop {
  0% {
    opacity: 0;
    transform: scale(.5);
  }

  60% {
    opacity: 1;
    transform: scale(1.1);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.mk-workflow-flow-dot {
  opacity: 0;
}

.mk-reveal.is-visible .mk-workflow-flow-dot {
  animation: 5s ease-in-out 2.5s infinite mk-workflow-dot-travel;
}

.mk-reveal.is-visible .mk-workflow-flow-dot-2 {
  animation: 6s ease-in-out 4.5s infinite mk-workflow-dot-travel;
}

@keyframes mk-workflow-dot-travel {
  0% {
    opacity: 0;
    top: 5%;
  }

  6% {
    opacity: .7;
  }

  40% {
    opacity: .5;
  }

  80% {
    opacity: .25;
  }

  100% {
    opacity: 0;
    top: 95%;
  }
}

.mk-workflow-complete {
  box-shadow: 0 0 20px #f8a0540a;
}

.mk-reveal.is-visible .mk-workflow-complete {
  animation: 4s ease-in-out 2s infinite mk-workflow-complete-glow;
}

@keyframes mk-workflow-complete-glow {
  0%, 100% {
    box-shadow: 0 0 20px #f8a0540a;
  }

  50% {
    box-shadow: 0 0 35px #f8a0541a;
  }
}

.mk-workflow-data-shimmer {
  position: relative;
  overflow: hidden;
}

.mk-workflow-data-shimmer:after {
  content: "";
  pointer-events: none;
  background: linear-gradient(105deg, #0000 40%, #f8a0540f 50%, #0000 60%);
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
}

.mk-reveal.is-visible .mk-shimmer-row-1 .mk-workflow-data-shimmer:first-child:after {
  animation: 8s ease-in-out 3s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-1 .mk-workflow-data-shimmer:nth-child(2):after {
  animation: 8.4s ease-in-out 3.6s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-1 .mk-workflow-data-shimmer:nth-child(3):after {
  animation: 7.8s ease-in-out 4.2s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-2 .mk-workflow-data-shimmer:first-child:after {
  animation: 8.2s ease-in-out 5s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-2 .mk-workflow-data-shimmer:nth-child(2):after {
  animation: 7.6s ease-in-out 5.5s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-2 .mk-workflow-data-shimmer:nth-child(3):after {
  animation: 8.8s ease-in-out 6.1s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-3 .mk-workflow-data-shimmer:first-child:after {
  animation: 7.4s ease-in-out 7s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-3 .mk-workflow-data-shimmer:nth-child(2):after {
  animation: 8.6s ease-in-out 7.7s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-3 .mk-workflow-data-shimmer:nth-child(3):after {
  animation: 8s ease-in-out 8.3s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-4 .mk-workflow-data-shimmer:first-child:after {
  animation: 9s ease-in-out 4s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-4 .mk-workflow-data-shimmer:nth-child(2):after {
  animation: 8.3s ease-in-out 4.8s infinite mk-data-shimmer;
}

.mk-reveal.is-visible .mk-shimmer-row-4 .mk-workflow-data-shimmer:nth-child(3):after {
  animation: 7.7s ease-in-out 5.4s infinite mk-data-shimmer;
}

@keyframes mk-data-shimmer {
  0%, 25% {
    transform: translateX(-100%);
  }

  50%, 100% {
    transform: translateX(100%);
  }
}

.mk-replace-card {
  opacity: 0;
  transform: translateX(-24px);
}

.mk-reveal.is-visible .mk-replace-card {
  animation: .45s cubic-bezier(.34, 1.56, .64, 1) both mk-replace-slide;
}

@keyframes mk-replace-slide {
  0% {
    opacity: 0;
    transform: translateX(-24px);
  }

  60% {
    opacity: 1;
    transform: translateX(3px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.mk-reveal.is-visible .mk-replace-card-1 {
  animation-delay: .1s;
}

.mk-reveal.is-visible .mk-replace-card-2 {
  animation-delay: .22s;
}

.mk-reveal.is-visible .mk-replace-card-3 {
  animation-delay: .34s;
}

.mk-reveal.is-visible .mk-replace-card-4 {
  animation-delay: .46s;
}

.mk-reveal.is-visible .mk-replace-card-5 {
  animation-delay: .58s;
}

.mk-replace-unified {
  opacity: 0;
  transform: translateY(20px);
}

.mk-reveal.is-visible .mk-replace-unified {
  animation: .6s cubic-bezier(.22, 1, .36, 1) .85s both mk-replace-unified-enter;
}

@keyframes mk-replace-unified-enter {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-replace-glow {
  box-shadow: 0 0 24px #f8a0540a;
}

.mk-reveal.is-visible .mk-replace-glow {
  animation: 4.5s ease-in-out 1.6s infinite mk-replace-breathe;
}

@keyframes mk-replace-breathe {
  0%, 100% {
    box-shadow: 0 0 24px #f8a0540a;
  }

  50% {
    box-shadow: 0 0 44px #f8a0541a;
  }
}

.mk-replace-check {
  opacity: 0;
  transform: scale(0);
}

.mk-reveal.is-visible .mk-replace-check {
  animation: .35s cubic-bezier(.34, 1.56, .64, 1) both mk-replace-check-pop;
}

@keyframes mk-replace-check-pop {
  0% {
    opacity: 0;
    transform: scale(0);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.mk-reveal.is-visible .mk-replace-check-1 {
  animation-delay: 1.2s;
}

.mk-reveal.is-visible .mk-replace-check-2 {
  animation-delay: 1.35s;
}

.mk-reveal.is-visible .mk-replace-check-3 {
  animation-delay: 1.5s;
}

.mk-reveal.is-visible .mk-replace-check-4 {
  animation-delay: 1.65s;
}

.mk-reveal.is-visible .mk-replace-check-5 {
  animation-delay: 1.8s;
}

.mk-replace-closing {
  opacity: 0;
  transform: translateY(10px);
}

.mk-reveal.is-visible .mk-replace-closing {
  animation: .8s ease-out 2.1s both mk-replace-closing-enter;
}

@keyframes mk-replace-closing-enter {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-hotspot-ring {
  animation: 2.5s ease-in-out infinite mk-hotspot-pulse;
}

.mk-hotspot-ring-2 {
  animation-delay: .5s;
}

.mk-hotspot-ring-3 {
  animation-delay: 1s;
}

.mk-hotspot-ring-4 {
  animation-delay: 1.5s;
}

.mk-hotspot-ring-5 {
  animation-delay: 2s;
}

@keyframes mk-hotspot-pulse {
  0%, 100% {
    opacity: .6;
    transform: scale(1);
  }

  50% {
    opacity: 0;
    transform: scale(1.8);
  }
}

.mk-replace-zone {
  transition: border-color .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s cubic-bezier(.22, 1, .36, 1), background-color .35s cubic-bezier(.22, 1, .36, 1);
}

.mk-replace-zone.is-zone-active {
  box-shadow: 0 0 20px #f8a0541a, inset 0 0 12px #f8a05408;
  background-color: #f8a05406 !important;
  border-color: #f8a05466 !important;
}

.mk-mockup-badge-pulse {
  animation: 3s ease-in-out infinite mk-badge-breathe;
}

.mk-mockup-badge-pulse-2 {
  animation-delay: 1s;
}

@keyframes mk-badge-breathe {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 #d04e4d00;
  }

  50% {
    transform: scale(1.12);
    box-shadow: 0 0 6px 2px #d04e4d33;
  }
}

.mk-mockup-timeline-glow {
  position: relative;
  overflow: hidden;
}

.mk-mockup-timeline-glow:after {
  content: "";
  background: linear-gradient(105deg, #0000 40%, #ffffff1f 50%, #0000 60%);
  animation: 6s ease-in-out infinite mk-timeline-shimmer;
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
}

.mk-mockup-timeline-glow-2:after {
  animation-delay: 2s;
}

.mk-mockup-timeline-glow-3:after {
  animation-delay: 4s;
}

@keyframes mk-timeline-shimmer {
  0%, 70%, 100% {
    transform: translateX(-100%);
  }

  30%, 40% {
    transform: translateX(100%);
  }
}

.mk-mockup-fin-breathe {
  animation: 5s ease-in-out infinite mk-fin-glow;
}

.mk-mockup-fin-breathe-2 {
  animation-delay: 1.25s;
}

.mk-mockup-fin-breathe-3 {
  animation-delay: 2.5s;
}

.mk-mockup-fin-breathe-4 {
  animation-delay: 3.75s;
}

@keyframes mk-fin-glow {
  0%, 100% {
    filter: brightness();
  }

  50% {
    filter: brightness(1.15);
  }
}

.mk-mockup-status-dot {
  animation: 4s ease-in-out infinite mk-status-pulse;
}

.mk-mockup-status-dot-2 {
  animation-delay: 1.3s;
}

.mk-mockup-status-dot-3 {
  animation-delay: 2.6s;
}

@keyframes mk-status-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: .6;
    transform: scale(1.4);
  }
}

.mk-annotation-card:after {
  animation: 3.5s ease-in-out infinite mk-leader-dot-pulse;
}

.mk-annotation:nth-child(2) .mk-annotation-card:after {
  animation-delay: .7s;
}

.mk-annotation:nth-child(3) .mk-annotation-card:after {
  animation-delay: 1.4s;
}

.mk-annotation.is-anno-focused .mk-annotation-card:after {
  animation-play-state: paused;
}

@keyframes mk-leader-dot-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 8px #f8a0541f;
  }

  50% {
    transform: scale(1.25);
    box-shadow: 0 0 12px #f8a05440;
  }
}

.mk-mockup-active-tab {
  position: relative;
}

.mk-mockup-active-tab:after {
  content: "";
  background: #0e1e3126;
  border-radius: 1px;
  height: 2px;
  animation: 4s ease-in-out infinite mk-tab-glow;
  position: absolute;
  bottom: -1px;
  left: 15%;
  right: 15%;
}

@keyframes mk-tab-glow {
  0%, 100% {
    opacity: .4;
  }

  50% {
    opacity: 1;
  }
}

.mk-annotation {
  z-index: 30;
  pointer-events: auto;
}

.mk-annotation-card {
  opacity: 1;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background: #fffffff2;
  border: 1px solid #0000000f;
  border-radius: 10px;
  padding: 12px 14px;
  transition: border-color .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s cubic-bezier(.22, 1, .36, 1), transform .35s cubic-bezier(.22, 1, .36, 1), background .35s;
  position: relative;
  box-shadow: 0 2px 12px #0000000f, 0 1px 3px #0000000a;
}

.mk-annotation.is-anno-focused .mk-annotation-card {
  background: #fff;
  border-color: #f8a05466;
  transform: scale(1.03);
  box-shadow: 0 6px 24px #f8a05426, 0 2px 8px #0000000f;
}

.mk-annotation.is-anno-focused .mk-annotation-card[data-dir="right"] {
  transform: scale(1.03)translateX(3px);
}

.mk-annotation.is-anno-focused .mk-annotation-card[data-dir="left"] {
  transform: scale(1.03)translateX(-3px);
}

.mk-annotation-card:before {
  content: "";
  background: #f8a0542e;
  transition: background .35s cubic-bezier(.22, 1, .36, 1), width .35s cubic-bezier(.22, 1, .36, 1), height .35s cubic-bezier(.22, 1, .36, 1);
  position: absolute;
}

.mk-annotation.is-anno-focused .mk-annotation-card:before {
  background: #f8a05480;
}

.mk-annotation-card:after {
  content: "";
  opacity: 1;
  background: #f8a0544d;
  border-radius: 50%;
  width: 7px;
  height: 7px;
  transition: background .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s cubic-bezier(.22, 1, .36, 1), transform .35s cubic-bezier(.22, 1, .36, 1);
  position: absolute;
  box-shadow: 0 0 8px #f8a0541f;
}

.mk-annotation.is-anno-focused .mk-annotation-card:after {
  background: #f8a054cc;
  transform: scale(1.4);
  box-shadow: 0 0 14px #f8a05480;
}

.mk-annotation-card[data-dir="right"]:before {
  width: var(--leader-len, 32px);
  height: 1px;
  margin-top: -.5px;
  top: 50%;
  left: 100%;
}

.mk-annotation-card[data-dir="right"]:after {
  left: calc(100% + var(--leader-len, 32px) - 3px);
  margin-top: -3.5px;
  top: 50%;
}

.mk-annotation-card[data-dir="left"]:before {
  width: var(--leader-len, 32px);
  height: 1px;
  margin-top: -.5px;
  top: 50%;
  right: 100%;
}

.mk-annotation-card[data-dir="left"]:after {
  right: calc(100% + var(--leader-len, 32px) - 3px);
  margin-top: -3.5px;
  top: 50%;
}

.mk-annotation-card[data-dir="down"]:before {
  width: 1px;
  height: var(--leader-len, 24px);
  margin-left: -.5px;
  top: 100%;
  left: 50%;
}

.mk-annotation-card[data-dir="down"]:after {
  left: 50%;
  top: calc(100% + var(--leader-len, 24px) - 3px);
  margin-left: -3.5px;
}

.mk-annotation-card[data-dir="up"]:before {
  width: 1px;
  height: var(--leader-len, 24px);
  margin-left: -.5px;
  bottom: 100%;
  left: 50%;
}

.mk-annotation-card[data-dir="up"]:after {
  left: 50%;
  bottom: calc(100% + var(--leader-len, 24px) - 3px);
  margin-left: -3.5px;
}

@media (prefers-reduced-motion: reduce) {
  .mk-roof-term {
    animation: none;
  }

  .mk-notif-card {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-notif-card {
    animation: none;
  }

  .mk-workflow-spine-fill {
    transform: scaleY(1);
  }

  .mk-reveal.is-visible .mk-workflow-spine-fill {
    animation: none;
  }

  .mk-workflow-node {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-workflow-node {
    animation: none;
  }

  .mk-workflow-flow-dot {
    display: none;
  }

  .mk-reveal.is-visible .mk-workflow-complete, .mk-reveal.is-visible [class*="mk-shimmer-row"] .mk-workflow-data-shimmer:after {
    animation: none;
  }

  .mk-replace-card {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-replace-card {
    animation: none;
  }

  .mk-replace-unified {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-replace-unified, .mk-reveal.is-visible .mk-replace-glow {
    animation: none;
  }

  .mk-replace-check {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-replace-check {
    animation: none;
  }

  .mk-replace-closing {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-replace-closing {
    animation: none;
  }

  .mk-annotation-card, .mk-annotation-card:before {
    transition: none;
  }

  .mk-annotation-card:after {
    transition: none;
    animation: none;
  }

  .mk-hotspot-ring, .mk-mockup-badge-pulse, .mk-mockup-badge-pulse-2 {
    animation: none;
  }

  .mk-mockup-timeline-glow:after {
    animation: none;
    display: none;
  }

  .mk-mockup-fin-breathe, .mk-mockup-fin-breathe-2, .mk-mockup-fin-breathe-3, .mk-mockup-fin-breathe-4, .mk-mockup-status-dot, .mk-mockup-status-dot-2, .mk-mockup-status-dot-3, .mk-mockup-active-tab:after {
    animation: none;
  }
}

.mk-pain-conn {
  animation: 4s ease-in-out infinite mk-pain-conn-pulse;
}

@keyframes mk-pain-conn-pulse {
  0%, 100% {
    opacity: 1;
    stroke-dashoffset: 0;
  }

  50% {
    opacity: .3;
    stroke-dashoffset: 8px;
  }
}

.mk-pain-error-cell {
  animation: 3.5s ease-in-out infinite mk-pain-error-blink;
}

@keyframes mk-pain-error-blink {
  0%, 100% {
    opacity: 1;
  }

  40% {
    opacity: 1;
  }

  50% {
    opacity: .4;
  }

  60% {
    opacity: 1;
  }
}

.mk-pain-error-dot {
  animation: 3s ease-in-out infinite mk-pain-dot-breathe;
}

@keyframes mk-pain-dot-breathe {
  0%, 100% {
    opacity: .6;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.4);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-pain-conn, .mk-pain-error-cell, .mk-pain-error-dot, .mk-gear-spin {
    animation: none;
  }
}

.mk-gear-spin {
  animation: 12s linear infinite mk-gear-spin;
}

@keyframes mk-gear-spin {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

.mk-stagger > * {
  opacity: 0;
  transition: opacity .55s cubic-bezier(.22, 1, .36, 1), transform .55s cubic-bezier(.22, 1, .36, 1);
  transform: translateY(18px);
}

.mk-stagger.is-visible > * {
  opacity: 1;
  transform: translateY(0);
}

.mk-stagger.is-visible > :first-child {
  transition-delay: 0s;
}

.mk-stagger.is-visible > :nth-child(2) {
  transition-delay: 70ms;
}

.mk-stagger.is-visible > :nth-child(3) {
  transition-delay: .14s;
}

.mk-stagger.is-visible > :nth-child(4) {
  transition-delay: .21s;
}

.mk-stagger.is-visible > :nth-child(5) {
  transition-delay: .28s;
}

.mk-stagger.is-visible > :nth-child(6) {
  transition-delay: .35s;
}

.mk-stagger.is-visible > :nth-child(7) {
  transition-delay: .42s;
}

.mk-stagger.is-visible > :nth-child(8) {
  transition-delay: .49s;
}

.mk-wave {
  z-index: 5;
  pointer-events: none;
  width: 100%;
  height: 70px;
  margin-top: -35px;
  margin-bottom: -35px;
  line-height: 0;
  display: block;
  position: relative;
}

@media (min-width: 768px) {
  .mk-wave {
    height: 90px;
    margin-top: -45px;
    margin-bottom: -45px;
  }
}

@media (min-width: 1024px) {
  .mk-wave {
    height: 120px;
    margin-top: -60px;
    margin-bottom: -60px;
  }
}

.mk-wave svg {
  width: 100%;
  height: 100%;
  display: block;
}

.mk-plat-seamless:before, .mk-plat-seamless:after {
  display: none;
}

.mk-stat-callout {
  background: linear-gradient(145deg, #0e1e31 0%, #142a45 100%);
  border-radius: 1rem;
  padding: 2rem 2.5rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 24px #0e1e311f, 0 12px 48px #0e1e3114;
}

.mk-stat-callout:before {
  content: "";
  background: linear-gradient(90deg, transparent, var(--color-accent), transparent);
  border-radius: 2px;
  height: 2px;
  position: absolute;
  top: 0;
  left: 2.5rem;
  right: 2.5rem;
}

.mk-stat-callout-num {
  font-family: var(--font-heading);
  color: var(--color-accent);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
  display: block;
}

.mk-stat-callout-label {
  color: #ffffff59;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-top: .375rem;
  font-size: .7rem;
}

@media (min-width: 640px) {
  .mk-stat-callout {
    padding: 2.25rem 3rem;
  }

  .mk-stat-callout-num {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .mk-stat-callout {
    padding: 2.5rem 3.5rem;
  }

  .mk-stat-callout-num {
    font-size: 2.5rem;
  }
}

@keyframes mk-ai-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: .5;
    transform: scale(1.6);
  }
}

.mk-ai-pulse-dot {
  animation: 2.5s ease-in-out infinite mk-ai-pulse;
}

.mk-hub-section {
  pointer-events: none;
}

.mk-hub-section .mk-hub-node {
  pointer-events: auto;
}

.mk-agent-terminal {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  transition: box-shadow .4s;
  box-shadow: 0 2px 12px #0e1e310f, 0 8px 32px #0e1e310a;
}

@keyframes mk-agent-think-spin {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

.mk-agent-think-spin {
  animation: 3s linear infinite paused mk-agent-think-spin;
}

.is-visible .mk-agent-think-spin {
  animation-play-state: running;
}

@keyframes mk-agent-status-pulse {
  0%, 100% {
    opacity: 1;
    box-shadow: 0 0 #4ade8066;
  }

  50% {
    opacity: .7;
    box-shadow: 0 0 0 4px #4ade8000;
  }
}

.mk-agent-status-dot {
  animation: 2.5s ease-in-out infinite mk-agent-status-pulse;
}

.mk-agent-msg {
  opacity: 0;
  transform: translateY(8px);
}

.is-visible .mk-agent-msg {
  animation: .5s cubic-bezier(.22, 1, .36, 1) forwards mk-agent-msg-in;
}

@keyframes mk-agent-msg-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.is-visible .mk-agent-msg-user {
  animation-delay: .4s;
}

.is-visible .mk-agent-msg-think {
  animation-delay: 1s;
}

.is-visible .mk-agent-msg-reply {
  animation-delay: 1.6s;
}

@keyframes mk-cursor-blink {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }
}

.mk-agent-cursor {
  opacity: 0;
}

.is-visible .mk-agent-cursor {
  animation: 1s step-end 2.2s infinite mk-cursor-blink;
}

.mk-agent-typing {
  opacity: 0;
}

.is-visible .mk-agent-typing {
  animation: .3s cubic-bezier(.22, 1, .36, 1) 2.1s forwards mk-agent-msg-in;
}

.mk-agent-line {
  stroke-dasharray: 30;
  stroke-dashoffset: 30px;
}

.is-visible .mk-agent-line {
  animation: .6s cubic-bezier(.22, 1, .36, 1) forwards mk-agent-line-draw;
}

@keyframes mk-agent-line-draw {
  to {
    stroke-dashoffset: 0;
  }
}

.is-visible .mk-agent-line-1 {
  animation-delay: .8s;
}

.is-visible .mk-agent-line-2 {
  animation-delay: 1s;
}

.is-visible .mk-agent-line-3 {
  animation-delay: 1.2s;
}

.is-visible .mk-agent-line-4 {
  animation-delay: 1.4s;
}

.mk-agent-node {
  opacity: 0;
  transform: translateX(-6px);
}

.is-visible .mk-agent-node {
  animation: .4s cubic-bezier(.22, 1, .36, 1) forwards mk-agent-node-in;
}

@keyframes mk-agent-node-in {
  from {
    opacity: 0;
    transform: translateX(-6px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.is-visible .mk-agent-node-1 {
  animation-delay: .6s;
}

.is-visible .mk-agent-node-2 {
  animation-delay: .7s;
}

.is-visible .mk-agent-node-3 {
  animation-delay: .8s;
}

.is-visible .mk-agent-node-4 {
  animation-delay: .9s;
}

.is-visible .mk-agent-node-5 {
  animation-delay: 1s;
}

.is-visible .mk-agent-node-6 {
  animation-delay: 1.1s;
}

.is-visible .mk-agent-node-7 {
  animation-delay: 1.2s;
}

.is-visible .mk-agent-node-8 {
  animation-delay: 1.3s;
}

.mk-hub-center {
  opacity: 0;
  transform: translate(-50%, -50%)scale(.5);
}

.is-visible .mk-hub-center {
  animation: .7s cubic-bezier(.22, 1, .36, 1) .3s forwards mk-hub-center-in;
}

@keyframes mk-hub-center-in {
  from {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.5);
  }

  70% {
    transform: translate(-50%, -50%)scale(1.06);
  }

  to {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1);
  }
}

@keyframes mk-hub-ring-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: .5;
    transform: scale(1.1);
  }
}

.mk-hub-ring {
  animation: 4s ease-in-out infinite mk-hub-ring-pulse;
}

.mk-hub-ring-2 {
  animation-delay: .6s;
}

@keyframes mk-hub-orbit-spin {
  from {
    stroke-dashoffset: 0;
  }

  to {
    stroke-dashoffset: 20px;
  }
}

.mk-hub-orbit {
  animation: 8s linear infinite mk-hub-orbit-spin;
}

.mk-hub-node {
  opacity: 0;
  transform: translate(-50%, -50%)scale(.6);
}

.is-visible .mk-hub-node {
  animation: .5s cubic-bezier(.22, 1, .36, 1) forwards mk-hub-node-pop;
}

@keyframes mk-hub-node-pop {
  from {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.6);
  }

  70% {
    transform: translate(-50%, -50%)scale(1.06);
  }

  to {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1);
  }
}

.is-visible .mk-hub-node-1 {
  animation-delay: .5s;
}

.is-visible .mk-hub-node-2 {
  animation-delay: .6s;
}

.is-visible .mk-hub-node-3 {
  animation-delay: .7s;
}

.is-visible .mk-hub-node-4 {
  animation-delay: .8s;
}

.is-visible .mk-hub-node-5 {
  animation-delay: .9s;
}

.is-visible .mk-hub-node-6 {
  animation-delay: 1s;
}

.is-visible .mk-hub-node-7 {
  animation-delay: 1.1s;
}

.is-visible .mk-hub-node-8 {
  animation-delay: 1.2s;
}

.mk-hub-line {
  stroke-dasharray: 300;
  stroke-dashoffset: 300px;
}

.is-visible .mk-hub-line {
  animation: .8s cubic-bezier(.22, 1, .36, 1) forwards mk-hub-line-draw;
}

@keyframes mk-hub-line-draw {
  to {
    stroke-dashoffset: 0;
  }
}

.is-visible .mk-hub-line-1 {
  animation-delay: .5s;
}

.is-visible .mk-hub-line-2 {
  animation-delay: .6s;
}

.is-visible .mk-hub-line-3 {
  animation-delay: .7s;
}

.is-visible .mk-hub-line-4 {
  animation-delay: .8s;
}

.is-visible .mk-hub-line-5 {
  animation-delay: .9s;
}

.is-visible .mk-hub-line-6 {
  animation-delay: 1s;
}

.is-visible .mk-hub-line-7 {
  animation-delay: 1.1s;
}

.is-visible .mk-hub-line-8 {
  animation-delay: 1.2s;
}

.mk-hub-endpoint {
  opacity: 0;
}

.is-visible .mk-hub-endpoint {
  animation: .3s forwards mk-hub-endpoint-in;
}

@keyframes mk-hub-endpoint-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.is-visible .mk-hub-endpoint-1 {
  animation-delay: .8s;
}

.is-visible .mk-hub-endpoint-2 {
  animation-delay: .9s;
}

.is-visible .mk-hub-endpoint-3 {
  animation-delay: 1s;
}

.is-visible .mk-hub-endpoint-4 {
  animation-delay: 1.1s;
}

.is-visible .mk-hub-endpoint-5 {
  animation-delay: 1.2s;
}

.is-visible .mk-hub-endpoint-6 {
  animation-delay: 1.3s;
}

.is-visible .mk-hub-endpoint-7 {
  animation-delay: 1.4s;
}

.is-visible .mk-hub-endpoint-8 {
  animation-delay: 1.5s;
}

.mk-fetch-dot {
  opacity: 0;
}

@keyframes mk-fetch-dot-1 {
  0% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }

  2% {
    opacity: 1;
  }

  12% {
    opacity: .4;
  }

  14% {
    opacity: 0;
    top: 10%;
    left: 72%;
  }

  100% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }
}

@keyframes mk-fetch-ghost-1 {
  0%, 15% {
    opacity: 0;
    top: 10%;
    left: 72%;
    transform: translate(-50%, -50%)scale(1);
  }

  19% {
    opacity: .85;
    top: 10%;
    left: 72%;
    transform: translate(-50%, -50%)scale(1.05);
  }

  21% {
    transform: translate(-50%, -50%)scale(1);
  }

  50% {
    opacity: .9;
    top: 47%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.78);
  }

  54% {
    opacity: 1;
    top: 47%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.72);
  }

  68% {
    opacity: 1;
    top: 47%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.72);
  }

  79% {
    opacity: 0;
    top: 47%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.1);
  }

  80%, 100% {
    opacity: 0;
    top: 10%;
    left: 72%;
    transform: translate(-50%, -50%)scale(1);
  }
}

@keyframes mk-fetch-scan-1 {
  0%, 54% {
    opacity: 0;
    top: -2px;
  }

  55% {
    opacity: 1;
    top: 0;
  }

  64% {
    opacity: .5;
    top: calc(100% - 2px);
  }

  66%, 100% {
    opacity: 0;
    top: -2px;
  }
}

.is-visible .mk-fetch-dot-1 {
  animation: 7s ease-in-out 1.5s infinite mk-fetch-dot-1;
}

.is-visible .mk-fetch-ghost-1 {
  animation: 7s ease-in-out 1.5s infinite mk-fetch-ghost-1;
}

.is-visible .mk-fetch-ghost-1 .mk-fetch-ghost-inner:after {
  animation: 7s ease-in-out 1.5s infinite mk-fetch-scan-1;
}

@keyframes mk-fetch-dot-2 {
  0% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }

  2% {
    opacity: 1;
  }

  9% {
    opacity: .4;
  }

  11% {
    opacity: 0;
    top: 32%;
    left: 78%;
  }

  100% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }
}

@keyframes mk-fetch-ghost-2 {
  0%, 12% {
    opacity: 0;
    top: 32%;
    left: 78%;
    transform: translate(-50%, -50%)scale(1);
  }

  15% {
    opacity: .85;
    top: 32%;
    left: 78%;
    transform: translate(-50%, -50%)scale(1.05);
  }

  17% {
    transform: translate(-50%, -50%)scale(1);
  }

  39% {
    opacity: .9;
    top: 48%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.78);
  }

  42% {
    opacity: 1;
    top: 48%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.72);
  }

  53% {
    opacity: 1;
    top: 48%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.72);
  }

  62% {
    opacity: 0;
    top: 48%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.1);
  }

  63%, 100% {
    opacity: 0;
    top: 32%;
    left: 78%;
    transform: translate(-50%, -50%)scale(1);
  }
}

@keyframes mk-fetch-scan-2 {
  0%, 42% {
    opacity: 0;
    top: -2px;
  }

  43% {
    opacity: 1;
    top: 0;
  }

  50% {
    opacity: .5;
    top: calc(100% - 2px);
  }

  52%, 100% {
    opacity: 0;
    top: -2px;
  }
}

.is-visible .mk-fetch-dot-2 {
  animation: 9s ease-in-out 3s infinite mk-fetch-dot-2;
}

.is-visible .mk-fetch-ghost-2 {
  animation: 9s ease-in-out 3s infinite mk-fetch-ghost-2;
}

.is-visible .mk-fetch-ghost-2 .mk-fetch-ghost-inner:after {
  animation: 9s ease-in-out 3s infinite mk-fetch-scan-2;
}

@keyframes mk-fetch-dot-3 {
  0% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }

  2% {
    opacity: 1;
  }

  7% {
    opacity: .4;
  }

  9% {
    opacity: 0;
    top: 68%;
    left: 76%;
  }

  100% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }
}

@keyframes mk-fetch-ghost-3 {
  0%, 10% {
    opacity: 0;
    top: 68%;
    left: 76%;
    transform: translate(-50%, -50%)scale(1);
  }

  13% {
    opacity: .85;
    top: 68%;
    left: 76%;
    transform: translate(-50%, -50%)scale(1.05);
  }

  14% {
    transform: translate(-50%, -50%)scale(1);
  }

  32% {
    opacity: .9;
    top: 52%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.78);
  }

  35% {
    opacity: 1;
    top: 52%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.72);
  }

  44% {
    opacity: 1;
    top: 52%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.72);
  }

  51% {
    opacity: 0;
    top: 52%;
    left: 62%;
    transform: translate(-50%, -50%)scale(.1);
  }

  52%, 100% {
    opacity: 0;
    top: 68%;
    left: 76%;
    transform: translate(-50%, -50%)scale(1);
  }
}

@keyframes mk-fetch-scan-3 {
  0%, 35% {
    opacity: 0;
    top: -2px;
  }

  36% {
    opacity: 1;
    top: 0;
  }

  41% {
    opacity: .5;
    top: calc(100% - 2px);
  }

  43%, 100% {
    opacity: 0;
    top: -2px;
  }
}

.is-visible .mk-fetch-dot-3 {
  animation: 11s ease-in-out .8s infinite mk-fetch-dot-3;
}

.is-visible .mk-fetch-ghost-3 {
  animation: 11s ease-in-out .8s infinite mk-fetch-ghost-3;
}

.is-visible .mk-fetch-ghost-3 .mk-fetch-ghost-inner:after {
  animation: 11s ease-in-out .8s infinite mk-fetch-scan-3;
}

@keyframes mk-fetch-dot-4 {
  0% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }

  2% {
    opacity: 1;
  }

  10% {
    opacity: .4;
  }

  12% {
    opacity: 0;
    top: 92%;
    left: 92%;
  }

  100% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }
}

@keyframes mk-fetch-ghost-4 {
  0%, 13% {
    opacity: 0;
    top: 92%;
    left: 92%;
    transform: translate(-50%, -50%)scale(1);
  }

  17% {
    opacity: .85;
    top: 92%;
    left: 92%;
    transform: translate(-50%, -50%)scale(1.05);
  }

  19% {
    transform: translate(-50%, -50%)scale(1);
  }

  44% {
    opacity: .9;
    top: 53%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.78);
  }

  48% {
    opacity: 1;
    top: 53%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.72);
  }

  60% {
    opacity: 1;
    top: 53%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.72);
  }

  70% {
    opacity: 0;
    top: 53%;
    left: 61%;
    transform: translate(-50%, -50%)scale(.1);
  }

  71%, 100% {
    opacity: 0;
    top: 92%;
    left: 92%;
    transform: translate(-50%, -50%)scale(1);
  }
}

@keyframes mk-fetch-scan-4 {
  0%, 48% {
    opacity: 0;
    top: -2px;
  }

  49% {
    opacity: 1;
    top: 0;
  }

  57% {
    opacity: .5;
    top: calc(100% - 2px);
  }

  59%, 100% {
    opacity: 0;
    top: -2px;
  }
}

.is-visible .mk-fetch-dot-4 {
  animation: 8s ease-in-out 5.5s infinite mk-fetch-dot-4;
}

.is-visible .mk-fetch-ghost-4 {
  animation: 8s ease-in-out 5.5s infinite mk-fetch-ghost-4;
}

.is-visible .mk-fetch-ghost-4 .mk-fetch-ghost-inner:after {
  animation: 8s ease-in-out 5.5s infinite mk-fetch-scan-4;
}

@keyframes mk-fetch-dot-5 {
  0% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }

  2% {
    opacity: 1;
  }

  6% {
    opacity: .4;
  }

  8% {
    opacity: 0;
    top: 8%;
    left: 92%;
  }

  100% {
    opacity: 0;
    top: 50%;
    left: 60%;
  }
}

@keyframes mk-fetch-ghost-5 {
  0%, 9% {
    opacity: 0;
    top: 8%;
    left: 92%;
    transform: translate(-50%, -50%)scale(1);
  }

  11% {
    opacity: .85;
    top: 8%;
    left: 92%;
    transform: translate(-50%, -50%)scale(1.05);
  }

  12% {
    transform: translate(-50%, -50%)scale(1);
  }

  27% {
    opacity: .9;
    top: 47%;
    left: 63%;
    transform: translate(-50%, -50%)scale(.78);
  }

  29% {
    opacity: 1;
    top: 47%;
    left: 63%;
    transform: translate(-50%, -50%)scale(.72);
  }

  37% {
    opacity: 1;
    top: 47%;
    left: 63%;
    transform: translate(-50%, -50%)scale(.72);
  }

  43% {
    opacity: 0;
    top: 47%;
    left: 63%;
    transform: translate(-50%, -50%)scale(.1);
  }

  44%, 100% {
    opacity: 0;
    top: 8%;
    left: 92%;
    transform: translate(-50%, -50%)scale(1);
  }
}

@keyframes mk-fetch-scan-5 {
  0%, 29% {
    opacity: 0;
    top: -2px;
  }

  30% {
    opacity: 1;
    top: 0;
  }

  35% {
    opacity: .5;
    top: calc(100% - 2px);
  }

  37%, 100% {
    opacity: 0;
    top: -2px;
  }
}

.is-visible .mk-fetch-dot-5 {
  animation: 13s ease-in-out 7s infinite mk-fetch-dot-5;
}

.is-visible .mk-fetch-ghost-5 {
  animation: 13s ease-in-out 7s infinite mk-fetch-ghost-5;
}

.is-visible .mk-fetch-ghost-5 .mk-fetch-ghost-inner:after {
  animation: 13s ease-in-out 7s infinite mk-fetch-scan-5;
}

.mk-fetch-ghost {
  opacity: 0;
  transform: translate(-50%, -50%);
}

.mk-fetch-ghost-inner {
  position: relative;
}

.mk-fetch-ghost-inner:after {
  content: "";
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, #0000 0%, #f8a054e6 40%, #f8a054 50%, #f8a054e6 60%, #0000 100%);
  height: 2px;
  position: absolute;
  top: -2px;
  left: 0;
  right: 0;
}

.mk-hub-absorb-ring {
  transition: box-shadow .3s;
  box-shadow: 0 0 #f8a05400;
}

@keyframes mk-hub-absorb {
  0%, 80% {
    box-shadow: 0 0 #f8a05400;
  }

  90% {
    box-shadow: 0 0 24px 8px #f8a05433;
  }

  100% {
    box-shadow: 0 0 #f8a05400;
  }
}

.is-visible .mk-hub-absorb-ring {
  animation: 2s ease-in-out 6s infinite mk-hub-absorb;
}

.mk-tool-card {
  transition: box-shadow .4s, border-color .4s, transform .4s cubic-bezier(.22, 1, .36, 1);
}

.mk-tool-card:hover {
  border-color: #f8a05433;
  transform: translateY(-3px);
}

.mk-tool-illus {
  transition: transform .4s cubic-bezier(.22, 1, .36, 1);
}

.mk-tool-card:hover .mk-tool-illus {
  transform: translateY(-1px);
}

.mk-ai-trust-bar {
  transition: box-shadow .4s, border-color .4s;
  box-shadow: 0 2px 12px #0e1e3108;
}

.mk-ai-trust-bar:hover {
  border-color: #f8a0541f;
  box-shadow: 0 4px 24px #0e1e310f;
}

@keyframes mk-trust-float {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-2px);
  }
}

.mk-trust-icon {
  animation: 4s ease-in-out infinite mk-trust-float;
}

.mk-ai-trust-bar > div > :nth-child(2) .mk-trust-icon {
  animation-delay: .5s;
}

.mk-ai-trust-bar > div > :nth-child(3) .mk-trust-icon {
  animation-delay: 1s;
}

@media (prefers-reduced-motion: reduce) {
  .mk-ai-pulse-dot {
    animation: none;
  }

  .mk-agent-status-dot {
    opacity: 1;
    animation: none;
  }

  .mk-agent-msg {
    opacity: 1;
    transform: none;
  }

  .mk-agent-cursor {
    opacity: 1;
    animation: none;
  }

  .mk-agent-typing {
    opacity: 1;
  }

  .mk-agent-think-spin {
    animation: none;
  }

  .mk-agent-line {
    stroke-dashoffset: 0;
  }

  .mk-agent-node {
    opacity: 1;
    transform: none;
  }

  .mk-hub-center {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1);
  }

  .mk-hub-ring {
    animation: none;
  }

  .mk-hub-node {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1);
  }

  .mk-hub-line {
    stroke-dashoffset: 0;
  }

  .mk-hub-endpoint {
    opacity: 1;
  }

  .mk-hub-orbit {
    animation: none;
  }

  .mk-fetch-dot, .mk-fetch-ghost {
    display: none;
  }

  .mk-hub-absorb-ring, .mk-trust-icon {
    animation: none;
  }

  .mk-tool-card:hover {
    transform: none;
  }
}

.mk-funnel-stage {
  opacity: 0;
  transform: translateY(12px);
}

.is-visible .mk-funnel-stage {
  animation: .6s cubic-bezier(.22, 1, .36, 1) forwards mk-funnel-stage-in;
}

@keyframes mk-funnel-stage-in {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.is-visible .mk-funnel-stage-1 {
  animation-delay: .2s;
}

.is-visible .mk-funnel-stage-2 {
  animation-delay: .45s;
}

.is-visible .mk-funnel-stage-3 {
  animation-delay: .7s;
}

.mk-funnel-shimmer {
  background: linear-gradient(105deg, #0000 0% 45%, #ffffff04 47%, #ffffff08 50%, #ffffff04 53%, #0000 55% 100%) 150% 0 / 300% 100%;
  animation: 8s linear infinite mk-funnel-shimmer;
}

.mk-funnel-stage-2 .mk-funnel-shimmer {
  animation-delay: 2.5s;
}

.mk-funnel-stage-3 .mk-funnel-shimmer {
  animation-delay: 5s;
}

.mk-funnel-shimmer-accent {
  background: linear-gradient(105deg, #0000 0% 45%, #f8a05405 47%, #f8a0540a 50%, #f8a05405 53%, #0000 55% 100%) 150% 0 / 300% 100%;
}

@keyframes mk-funnel-shimmer {
  0% {
    background-position: 150% 0;
  }

  30% {
    background-position: -50% 0;
  }

  30.01%, 100% {
    background-position: 150% 0;
  }
}

.mk-funnel-convert {
  animation: 4s ease-in-out infinite mk-funnel-glow;
}

@keyframes mk-funnel-glow {
  0%, 100% {
    box-shadow: 0 0 25px #f8a0540d;
  }

  50% {
    box-shadow: 0 0 35px #f8a0541f, 0 0 60px #f8a0540a;
  }
}

.mk-funnel-icon-pulse {
  animation: 3s ease-in-out infinite mk-funnel-icon-pulse;
}

@keyframes mk-funnel-icon-pulse {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 0 6px #f8a05414;
  }
}

.mk-funnel-flow {
  opacity: 0;
}

.is-visible .mk-funnel-flow {
  animation-fill-mode: forwards;
}

.is-visible .mk-funnel-flow-1 {
  animation: 3s ease-in-out 2s infinite mk-funnel-flow-down;
}

.is-visible .mk-funnel-flow-1b {
  animation: 3s ease-in-out 3.5s infinite mk-funnel-flow-down;
}

.is-visible .mk-funnel-flow-2 {
  animation: 4s ease-in-out 2.8s infinite mk-funnel-flow-down;
}

@keyframes mk-funnel-flow-down {
  0% {
    opacity: 0;
    top: 0;
  }

  10% {
    opacity: .8;
  }

  80% {
    opacity: .5;
  }

  100% {
    opacity: 0;
    top: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-funnel-stage {
    opacity: 1;
    transform: none;
  }

  .mk-funnel-shimmer {
    animation: none;
  }

  .mk-funnel-convert {
    animation: none;
    box-shadow: 0 0 30px #f8a0540f;
  }

  .mk-funnel-icon-pulse {
    animation: none;
  }

  .mk-funnel-flow {
    display: none;
  }
}

.mk-task-shimmer {
  z-index: 1;
  background: linear-gradient(105deg, #0000 0% 45%, #ffffff03 47%, #ffffff05 50%, #ffffff03 53%, #0000 55% 100%) 150% 0 / 300% 100%;
}

.is-visible .mk-task-shimmer {
  animation: 10s linear 1.5s infinite mk-task-shimmer;
}

@keyframes mk-task-shimmer {
  0% {
    background-position: 150% 0;
  }

  30% {
    background-position: -50% 0;
  }

  30.01%, 100% {
    background-position: 150% 0;
  }
}

.mk-task-col {
  opacity: 0;
  transition: opacity .6s, transform .6s;
  transform: translateY(16px);
}

.is-visible .mk-task-col {
  opacity: 1;
  transform: translateY(0);
}

.is-visible .mk-task-col-1 {
  transition-delay: .3s;
}

.is-visible .mk-task-col-2 {
  transition-delay: .5s;
}

.is-visible .mk-task-col-3 {
  transition-delay: .7s;
}

.mk-task-card {
  transition: transform .5s, box-shadow .5s;
}

.is-visible .mk-task-card-1 {
  animation: 6s ease-in-out 2s infinite mk-task-float-1;
}

.is-visible .mk-task-card-2 {
  animation: 7s ease-in-out 2.5s infinite mk-task-float-2;
}

@keyframes mk-task-float-1 {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-2px);
  }
}

@keyframes mk-task-float-2 {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-1.5px);
  }
}

.mk-task-active {
  transition: box-shadow .5s;
}

.is-visible .mk-task-active {
  animation: 4s ease-in-out 1s infinite mk-task-active-glow;
}

@keyframes mk-task-active-glow {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 20px #f8a0540f, 0 0 40px #f8a05408;
  }
}

.mk-task-progress-fill {
  width: 0;
  transition: width 1.8s cubic-bezier(.22, 1, .36, 1);
}

.is-visible .mk-task-progress-fill {
  width: 65%;
  transition-delay: 1.2s;
}

.mk-task-timeline-fill {
  width: 0;
  transition: width 2.2s cubic-bezier(.22, 1, .36, 1);
}

.is-visible .mk-task-timeline-fill {
  width: 38%;
  transition-delay: 1.6s;
}

.mk-task-deadline-dot {
  animation: none;
}

.is-visible .mk-task-deadline-dot {
  animation: 3s ease-in-out 2.5s infinite mk-task-deadline-pulse;
}

@keyframes mk-task-deadline-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    transform: scale(1.3);
    box-shadow: 0 0 6px 3px #f8a05433;
  }
}

.mk-task-done {
  opacity: 0;
  transition: opacity .5s, transform .5s;
  transform: translateX(8px);
}

.is-visible .mk-task-done {
  opacity: .6;
  transform: translateX(0);
}

.is-visible .mk-task-done-1 {
  transition-delay: .9s;
}

.is-visible .mk-task-done-2 {
  transition-delay: 1.1s;
}

.mk-task-check {
  transition: transform .3s cubic-bezier(.34, 1.56, .64, 1);
  transform: scale(0);
}

.is-visible .mk-task-done-1 .mk-task-check {
  transition-delay: 1.1s;
  transform: scale(1);
}

.is-visible .mk-task-done-2 .mk-task-check {
  transition-delay: 1.3s;
  transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .mk-task-shimmer {
    animation: none !important;
  }

  .mk-task-col {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-task-card-1, .mk-task-card-2 {
    animation: none !important;
  }

  .mk-task-active {
    box-shadow: 0 0 20px #f8a0540a;
    animation: none !important;
  }

  .mk-task-progress-fill {
    width: 65%;
    transition: none;
  }

  .mk-task-timeline-fill {
    width: 38%;
    transition: none;
  }

  .mk-task-deadline-dot {
    animation: none !important;
  }

  .mk-task-done {
    opacity: .6;
    transition: none;
    transform: none;
  }

  .mk-task-check {
    transition: none;
    transform: scale(1);
  }
}

.mk-featured-card {
  border: 1px solid var(--color-border);
  background: #fff;
  border-radius: 1rem;
  padding: 2rem;
  transition: box-shadow .4s cubic-bezier(.22, 1, .36, 1), border-color .4s;
  position: relative;
  overflow: hidden;
}

.mk-featured-card:hover {
  border-color: #f8a05440;
  box-shadow: 0 8px 40px #0e1e3114;
}

.mk-featured-card:after {
  content: "";
  background: linear-gradient(90deg, var(--color-accent), var(--color-accent-hover), var(--color-accent));
  opacity: 0;
  height: 3px;
  transition: opacity .4s;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.mk-featured-card:hover:after {
  opacity: 1;
}

.mk-pipeline {
  padding-left: 2rem;
  position: relative;
}

.mk-pipeline:before {
  content: "";
  background: linear-gradient(#f8a0544d, #f8a0541f, #f8a0540d);
  width: 2px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 7px;
}

.mk-pipeline-step {
  padding: 1rem 0;
  position: relative;
}

.mk-pipeline-dot {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: flex;
  position: absolute;
  top: 1.25rem;
  left: -2rem;
}

.mk-pipeline-dot:before {
  content: "";
  background: var(--color-accent);
  border-radius: 50%;
  width: 8px;
  height: 8px;
  transition: box-shadow .4s;
  box-shadow: 0 0 0 4px #f8a0541f;
}

.mk-pipeline-step:hover .mk-pipeline-dot:before {
  box-shadow: 0 0 0 6px #f8a05433;
}

.mk-stagger.is-visible .mk-pipeline-dot:before {
  animation: .6s cubic-bezier(.22, 1, .36, 1) forwards mk-dot-pulse;
}

@keyframes mk-dot-pulse {
  0% {
    opacity: 0;
    transform: scale(0);
  }

  60% {
    transform: scale(1.3);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.mk-ambient-dots {
  pointer-events: none;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-ambient-dot {
  will-change: transform, opacity;
  background: #f8a05426;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  position: absolute;
}

.mk-ambient-dot-1 {
  animation: 12s cubic-bezier(.45, 0, .55, 1) infinite alternate mk-float-dot;
  top: 15%;
  left: 8%;
}

.mk-ambient-dot-2 {
  animation: 15s cubic-bezier(.45, 0, .55, 1) -3s infinite alternate-reverse mk-float-dot;
  top: 35%;
  right: 12%;
}

.mk-ambient-dot-3 {
  animation: 11s cubic-bezier(.45, 0, .55, 1) -7s infinite alternate mk-float-dot;
  bottom: 25%;
  left: 18%;
}

.mk-ambient-dot-4 {
  animation: 14s cubic-bezier(.45, 0, .55, 1) -2s infinite alternate-reverse mk-float-dot;
  top: 60%;
  right: 22%;
}

.mk-ambient-dot-5 {
  animation: 13s cubic-bezier(.45, 0, .55, 1) -5s infinite alternate mk-float-dot;
  bottom: 15%;
  right: 35%;
}

.mk-ambient-dot-6 {
  animation: 16s cubic-bezier(.45, 0, .55, 1) -9s infinite alternate-reverse mk-float-dot;
  top: 20%;
  left: 40%;
}

@keyframes mk-float-dot {
  0% {
    opacity: .15;
    transform: translate(0);
  }

  33% {
    opacity: .35;
  }

  66% {
    opacity: .1;
  }

  100% {
    opacity: .25;
    transform: translate(30px, -25px);
  }
}

.mk-dot-grid {
  pointer-events: none;
  opacity: .3;
  background-image: radial-gradient(circle, var(--color-border) 1px, transparent 1px);
  background-size: 32px 32px;
  position: absolute;
  inset: 0;
  -webkit-mask-image: radial-gradient(60% 50% at 80% 30%, #000 0%, #0000 70%);
  mask-image: radial-gradient(60% 50% at 80% 30%, #000 0%, #0000 70%);
}

.mk-hr-accent {
  background: linear-gradient(90deg, #0000, #f8a05433, #0000);
  border: none;
  height: 1px;
}

.mk-pipeline-light:before {
  background: linear-gradient(#f8a05433, #f8a05414, #f8a05408);
}

.mk-pipeline-light .mk-pipeline-dot:before {
  box-shadow: 0 0 0 4px #f8a05414;
}

.mk-pipeline-light .mk-pipeline-step:hover .mk-pipeline-dot:before {
  box-shadow: 0 0 0 6px #f8a05426;
}

.mk-workflow-connector {
  position: relative;
  overflow: hidden;
}

.mk-workflow-connector:after {
  content: "";
  background: var(--color-accent);
  border-radius: 50%;
  width: 8px;
  height: 8px;
  animation: 3s ease-in-out infinite mk-workflow-travel;
  position: absolute;
  top: 50%;
  left: -8px;
  transform: translateY(-50%);
  box-shadow: 0 0 12px #f8a05480, 0 0 4px #f8a054cc;
}

.mk-workflow-connector-d1:after {
  animation-delay: 0s;
}

.mk-workflow-connector-d2:after {
  animation-delay: -1s;
}

.mk-workflow-connector-d3:after {
  animation-delay: -2s;
}

@keyframes mk-workflow-travel {
  0% {
    opacity: 0;
    left: -8px;
  }

  10% {
    opacity: 1;
  }

  90% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    left: calc(100% + 8px);
  }
}

.mk-workflow-node-active {
  animation: 4s ease-in-out infinite alternate mk-workflow-node-glow;
}

@keyframes mk-workflow-node-glow {
  0% {
    box-shadow: 0 2px 8px #0e1e310f;
  }

  100% {
    box-shadow: 0 2px 16px #f8a0541f, 0 0 0 1px #f8a05414;
  }
}

.mk-workflow-running {
  animation: 2s ease-in-out infinite mk-workflow-blink;
}

@keyframes mk-workflow-blink {
  0%, 100% {
    opacity: .4;
  }

  50% {
    opacity: 1;
  }
}

.mk-workflow-log-line {
  animation: .5s ease-out both mk-workflow-log-appear;
}

.mk-workflow-log-d1 {
  animation-delay: 2s;
}

.mk-workflow-log-d2 {
  animation-delay: 4s;
}

.mk-workflow-log-d3 {
  animation-delay: 6s;
}

.mk-workflow-log-d4 {
  animation-delay: 8s;
}

@keyframes mk-workflow-log-appear {
  0% {
    opacity: 0;
    transform: translateY(4px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-workflow-connector:after {
    opacity: 0;
    animation: none;
  }

  .mk-workflow-node-active {
    animation: none;
  }

  .mk-workflow-running, .mk-workflow-log-line {
    opacity: 1;
    animation: none;
  }
}

.mk-sig-draw .mk-sig-path {
  stroke-dasharray: 220;
  stroke-dashoffset: 220px;
  animation: 3s 1.5s forwards mk-sig-draw;
}

.mk-sig-draw .mk-sig-shadow {
  animation-duration: 2.8s;
  animation-delay: 1.4s;
}

@keyframes mk-sig-draw {
  0% {
    stroke-dashoffset: 220px;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

.mk-sig-draw .mk-sig-pen {
  animation: 3s 1.5s forwards mk-sig-pen;
}

@keyframes mk-sig-pen {
  0% {
    opacity: 1;
    cx: 6;
    cy: 34;
  }

  14% {
    cx: 24;
    cy: 24;
  }

  28% {
    cx: 46;
    cy: 20;
  }

  42% {
    cx: 66;
    cy: 18;
  }

  57% {
    cx: 88;
    cy: 16;
  }

  71% {
    cx: 112;
    cy: 14;
  }

  85% {
    cx: 136;
    cy: 12;
  }

  95% {
    cx: 154;
    cy: 14;
    opacity: 1;
  }

  100% {
    cx: 154;
    cy: 14;
    opacity: 0;
  }
}

.mk-sig-stamp {
  opacity: 0;
  animation: .5s cubic-bezier(.34, 1.56, .64, 1) 4.5s forwards mk-sig-stamp;
  transform: scale(.6)rotate(-6deg);
}

@keyframes mk-sig-stamp {
  0% {
    opacity: 0;
    transform: scale(.6)rotate(-6deg);
  }

  60% {
    transform: scale(1.08)rotate(0);
  }

  100% {
    opacity: 1;
    transform: scale(1)rotate(0);
  }
}

.mk-sig-date {
  opacity: 0;
  animation: .6s ease-out 1.8s forwards mk-sig-fade;
}

@keyframes mk-sig-fade {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.mk-sig-step {
  opacity: 0;
  animation: .4s ease-out forwards mk-sig-step-in;
  transform: translateY(6px);
}

.mk-sig-step-d1 {
  animation-delay: .3s;
}

.mk-sig-step-d2 {
  animation-delay: .8s;
}

.mk-sig-step-d3 {
  animation-delay: 1.3s;
}

.mk-sig-step-d4 {
  animation-delay: 1.8s;
}

@keyframes mk-sig-step-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-sig-active-dot {
  animation: 2.5s ease-in-out infinite mk-sig-pulse;
}

@keyframes mk-sig-pulse {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 0 4px #f8a0541f;
  }
}

.mk-sig-progress {
  animation: 3s ease-in-out infinite mk-sig-progress-fill;
}

@keyframes mk-sig-progress-fill {
  0%, 100% {
    width: 60%;
  }

  50% {
    width: 85%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-sig-draw .mk-sig-path {
    stroke-dashoffset: 0;
    animation: none;
  }

  .mk-sig-draw .mk-sig-pen {
    opacity: 0;
    animation: none;
  }

  .mk-sig-stamp {
    opacity: 1;
    animation: none;
    transform: scale(1)rotate(0);
  }

  .mk-sig-date {
    opacity: 1;
    animation: none;
  }

  .mk-sig-step {
    opacity: 1;
    animation: none;
    transform: translateY(0);
  }

  .mk-sig-active-dot {
    animation: none;
  }

  .mk-sig-progress {
    width: 75%;
    animation: none;
  }
}

.mk-tpl-doc {
  background: #fff;
  border: 1px solid #e8e6e199;
  border-radius: 14px;
  transition: box-shadow .4s;
  box-shadow: 0 1px 4px #0e1e310a, 0 8px 40px #0e1e310f;
}

.mk-tpl-doc:hover {
  box-shadow: 0 1px 4px #0e1e310a, 0 12px 48px #0e1e3117;
}

.mk-tpl-slot {
  vertical-align: middle;
  display: inline-flex;
  position: relative;
}

.mk-tpl-slot-var, .mk-tpl-slot-val {
  transition: opacity .5s, transform .5s;
}

.mk-tpl-slot-var {
  background: #f8a0541a;
  border: 1px solid #f8a0542e;
  border-radius: 5px;
  align-items: center;
  gap: 2px;
  padding: 2px 7px;
  display: inline-flex;
}

.mk-tpl-slot-val {
  opacity: 0;
  white-space: nowrap;
  background: #34d39914;
  border: 1px solid #34d3992e;
  border-radius: 5px;
  align-items: center;
  padding: 2px 7px;
  display: inline-flex;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(2px);
}

.mk-reveal.is-visible .mk-tpl-slot-1 .mk-tpl-slot-var {
  animation: 9s ease-in-out 1.2s infinite mk-tpl-var-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-1 .mk-tpl-slot-val {
  animation: 9s ease-in-out 1.2s infinite mk-tpl-val-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-2 .mk-tpl-slot-var {
  animation: 9s ease-in-out 1.6s infinite mk-tpl-var-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-2 .mk-tpl-slot-val {
  animation: 9s ease-in-out 1.6s infinite mk-tpl-val-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-3 .mk-tpl-slot-var {
  animation: 9s ease-in-out 2s infinite mk-tpl-var-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-3 .mk-tpl-slot-val {
  animation: 9s ease-in-out 2s infinite mk-tpl-val-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-4 .mk-tpl-slot-var {
  animation: 9s ease-in-out 2.4s infinite mk-tpl-var-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-4 .mk-tpl-slot-val {
  animation: 9s ease-in-out 2.4s infinite mk-tpl-val-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-5 .mk-tpl-slot-var {
  animation: 9s ease-in-out 2.8s infinite mk-tpl-var-fade;
}

.mk-reveal.is-visible .mk-tpl-slot-5 .mk-tpl-slot-val {
  animation: 9s ease-in-out 2.8s infinite mk-tpl-val-fade;
}

@keyframes mk-tpl-var-fade {
  0%, 18% {
    opacity: 1;
    transform: translateY(0);
  }

  24%, 62% {
    opacity: 0;
    transform: translateY(-3px);
  }

  68%, 100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mk-tpl-val-fade {
  0%, 18% {
    opacity: 0;
    transform: translateY(3px);
  }

  24%, 62% {
    opacity: 1;
    transform: translateY(0);
  }

  68%, 100% {
    opacity: 0;
    transform: translateY(3px);
  }
}

.mk-reveal.is-visible .mk-tpl-slot:after {
  content: "";
  opacity: 0;
  pointer-events: none;
  background: #34d3991f;
  border-radius: 7px;
  position: absolute;
  inset: -2px;
}

.mk-reveal.is-visible .mk-tpl-slot-1:after {
  animation: 9s ease-in-out 1.2s infinite mk-tpl-flash;
}

.mk-reveal.is-visible .mk-tpl-slot-2:after {
  animation: 9s ease-in-out 1.6s infinite mk-tpl-flash;
}

.mk-reveal.is-visible .mk-tpl-slot-3:after {
  animation: 9s ease-in-out 2s infinite mk-tpl-flash;
}

.mk-reveal.is-visible .mk-tpl-slot-4:after {
  animation: 9s ease-in-out 2.4s infinite mk-tpl-flash;
}

.mk-reveal.is-visible .mk-tpl-slot-5:after {
  animation: 9s ease-in-out 2.8s infinite mk-tpl-flash;
}

@keyframes mk-tpl-flash {
  0%, 20% {
    opacity: 0;
  }

  24% {
    opacity: 1;
  }

  32%, 100% {
    opacity: 0;
  }
}

.mk-tpl-note {
  background: #fff;
  border: 1px solid #e8e6e180;
  border-radius: 10px;
  padding: 14px 16px;
  transition: border-color .3s, box-shadow .3s;
  position: relative;
  box-shadow: 0 1px 3px #0e1e310a;
}

.mk-tpl-note:hover {
  border-color: #f8a05440;
  box-shadow: 0 2px 12px #0e1e310f;
}

.mk-tpl-note-icon {
  background: #f8a05414;
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: flex;
}

.mk-tpl-note-left {
  opacity: 0;
  transition: opacity .5s, transform .5s cubic-bezier(.22, 1, .36, 1);
  transform: translateX(-12px);
}

.mk-tpl-note-right {
  opacity: 0;
  transition: opacity .5s, transform .5s cubic-bezier(.22, 1, .36, 1);
  transform: translateX(12px);
}

.mk-reveal.is-visible .mk-tpl-note-left, .mk-reveal.is-visible .mk-tpl-note-right {
  opacity: 1;
  transform: translateX(0);
}

.mk-reveal.is-visible .mk-tpl-note-d1 {
  transition-delay: .6s;
}

.mk-reveal.is-visible .mk-tpl-note-d2 {
  transition-delay: .8s;
}

.mk-reveal.is-visible .mk-tpl-note-d3 {
  transition-delay: 1s;
}

.mk-reveal.is-visible .mk-tpl-note-d4 {
  transition-delay: 1.2s;
}

.mk-tpl-source {
  animation: 6s ease-in-out 1.5s infinite mk-tpl-source-breathe;
}

@keyframes mk-tpl-source-breathe {
  0%, 100% {
    box-shadow: 0 1px 3px #0e1e310d;
  }

  50% {
    box-shadow: 0 3px 16px #f8a05412;
  }
}

.mk-tpl-particle {
  opacity: 0;
  background: #f8a05466;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  position: absolute;
}

.mk-reveal.is-visible .mk-tpl-particle-1 {
  animation: 5s ease-in-out 1s infinite mk-tpl-particle-down;
}

.mk-reveal.is-visible .mk-tpl-particle-2 {
  animation: 5s ease-in-out 2.6s infinite mk-tpl-particle-down;
}

.mk-reveal.is-visible .mk-tpl-particle-3 {
  animation: 5s ease-in-out 4.2s infinite mk-tpl-particle-down;
}

@keyframes mk-tpl-particle-down {
  0% {
    opacity: 0;
    transform: translateY(0);
  }

  10% {
    opacity: .6;
  }

  80% {
    opacity: .3;
  }

  100% {
    opacity: 0;
    transform: translateY(28px);
  }
}

.mk-tpl-sweep {
  pointer-events: none;
  border-radius: 14px;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mk-tpl-sweep:after {
  content: "";
  inset-block: 0;
  background: linear-gradient(90deg, #0000, #34d39908, #0000);
  width: 80px;
  position: absolute;
  left: -80px;
}

.mk-reveal.is-visible .mk-tpl-sweep:after {
  animation: 9s ease-in-out 1.8s infinite mk-tpl-sweep-pass;
}

@keyframes mk-tpl-sweep-pass {
  0%, 20% {
    opacity: 0;
    left: -80px;
  }

  24% {
    opacity: 1;
  }

  40% {
    opacity: .5;
    left: calc(100% + 80px);
  }

  45%, 100% {
    opacity: 0;
    left: calc(100% + 80px);
  }
}

.mk-tpl-status {
  position: relative;
  overflow: hidden;
}

.mk-tpl-status-generated {
  opacity: 0;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0;
}

.mk-reveal.is-visible .mk-tpl-status-template {
  animation: 9s ease-in-out 1s infinite mk-tpl-var-fade;
}

.mk-reveal.is-visible .mk-tpl-status-generated {
  animation: 9s ease-in-out 1s infinite mk-tpl-val-fade;
}

.mk-tpl-doc-enter {
  opacity: 0;
  transition: opacity .6s, transform .6s cubic-bezier(.22, 1, .36, 1);
  transform: translateY(16px);
}

.mk-reveal.is-visible .mk-tpl-doc-enter {
  opacity: 1;
  transition-delay: .3s;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .mk-tpl-slot .mk-tpl-slot-var, .mk-tpl-slot .mk-tpl-slot-val, .mk-tpl-slot:after {
    animation: none !important;
  }

  .mk-tpl-slot .mk-tpl-slot-val {
    opacity: 0 !important;
  }

  .mk-tpl-source {
    animation: none !important;
  }

  .mk-tpl-particle {
    opacity: 0 !important;
    animation: none !important;
  }

  .mk-tpl-sweep:after {
    animation: none !important;
  }

  .mk-tpl-note-left, .mk-tpl-note-right {
    opacity: 1 !important;
    transform: none !important;
  }

  .mk-tpl-status-template {
    opacity: 1 !important;
    animation: none !important;
  }

  .mk-tpl-status-generated {
    opacity: 0 !important;
    animation: none !important;
  }

  .mk-tpl-doc-enter {
    opacity: 1 !important;
    transform: none !important;
  }
}

.mk-fields-panel {
  transition: box-shadow .6s;
}

.is-visible .mk-fields-panel {
  animation: 6s ease-in-out 2s infinite mk-fields-shadow;
}

@keyframes mk-fields-shadow {
  0%, 100% {
    box-shadow: 0 4px 16px #0e1e310f, 0 1px 4px #0e1e3108;
  }

  50% {
    box-shadow: 0 8px 32px #0e1e3114, 0 2px 8px #0e1e310a;
  }
}

.mk-fields-shimmer {
  background: linear-gradient(105deg, #0000 0% 45%, #f8a05404 48%, #f8a05408 50%, #f8a05404 52%, #0000 55% 100%) 150% 0 / 300% 100%;
}

.is-visible .mk-fields-shimmer {
  animation: 14s linear 3s infinite mk-fields-shimmer;
}

@keyframes mk-fields-shimmer {
  0% {
    background-position: 150% 0;
  }

  25% {
    background-position: -50% 0;
  }

  25.01%, 100% {
    background-position: 150% 0;
  }
}

.mk-field-type {
  opacity: 0;
  transition: opacity .35s, transform .35s, border-color .2s, background-color .2s;
  transform: translateX(-8px);
}

.is-visible .mk-field-type {
  opacity: 1;
  transform: translateX(0);
}

.is-visible .mk-field-type-1 {
  transition-delay: .4s, .4s, 0s, 0s;
}

.is-visible .mk-field-type-2 {
  transition-delay: .48s, .48s, 0s, 0s;
}

.is-visible .mk-field-type-3 {
  transition-delay: .56s, .56s, 0s, 0s;
}

.is-visible .mk-field-type-4 {
  transition-delay: .64s, .64s, 0s, 0s;
}

.is-visible .mk-field-type-5 {
  transition-delay: .76s, .76s, 0s, 0s;
}

.is-visible .mk-field-type-6 {
  transition-delay: .84s, .84s, 0s, 0s;
}

.is-visible .mk-field-type-7 {
  transition-delay: .92s, .92s, 0s, 0s;
}

.is-visible .mk-field-type-8 {
  transition-delay: 1.08s, 1.08s, 0s, 0s;
}

.is-visible .mk-field-type-9 {
  transition-delay: 1.16s, 1.16s, 0s, 0s;
}

.is-visible .mk-field-type-10 {
  transition-delay: 1.24s, 1.24s, 0s, 0s;
}

.is-visible .mk-field-type-11 {
  transition-delay: 1.32s, 1.32s, 0s, 0s;
}

.mk-fields-group {
  opacity: 0;
  transition: opacity .5s, transform .5s;
  transform: translateY(8px);
}

.is-visible .mk-fields-group-1 {
  opacity: 1;
  transition-delay: .8s;
  transform: translateY(0);
}

.is-visible .mk-fields-group-2 {
  opacity: 1;
  transition-delay: 1.4s;
  transform: translateY(0);
}

.is-visible .mk-fields-group-3 {
  opacity: 1;
  transition-delay: 2s;
  transform: translateY(0);
}

.mk-fields-row {
  opacity: 0;
  transition: opacity .35s, transform .35s;
  transform: translateX(-6px);
}

.is-visible .mk-fields-row-1 {
  opacity: 1;
  transition-delay: 1s;
  transform: translateX(0);
}

.is-visible .mk-fields-row-2 {
  opacity: 1;
  transition-delay: 1.1s;
  transform: translateX(0);
}

.is-visible .mk-fields-row-3 {
  opacity: 1;
  transition-delay: 1.2s;
  transform: translateX(0);
}

.is-visible .mk-fields-row-4 {
  opacity: 1;
  transition-delay: 1.3s;
  transform: translateX(0);
}

.is-visible .mk-fields-row-5 {
  opacity: 1;
  transition-delay: 1.6s;
  transform: translateX(0);
}

.is-visible .mk-fields-row-6 {
  opacity: 1;
  transition-delay: 1.7s;
  transform: translateX(0);
}

.is-visible .mk-fields-row-7 {
  opacity: 1;
  transition-delay: 1.8s;
  transform: translateX(0);
}

.is-visible .mk-fields-formula {
  opacity: 1;
  transition-delay: 1.95s;
  transform: translateX(0);
}

.mk-fields-formula-flash {
  opacity: 0;
  background: linear-gradient(90deg, #0000, #f8a05414, #0000);
}

.is-visible .mk-fields-formula-flash {
  animation: .6s ease-out 2.2s both mk-fields-formula-flash;
}

@keyframes mk-fields-formula-flash {
  0% {
    opacity: 0;
    transform: translateX(-100%);
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: translateX(100%);
  }
}

.mk-fields-formula-bar {
  transition: box-shadow .4s;
}

.is-visible .mk-fields-formula-bar {
  animation: 5s ease-in-out 3s infinite mk-fields-formula-glow;
}

@keyframes mk-fields-formula-glow {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 12px #f8a0540f, 0 0 24px #f8a05408;
  }
}

.mk-fields-formula-value {
  opacity: 0;
  transition: opacity .3s, transform .3s cubic-bezier(.34, 1.56, .64, 1);
  transform: scale(.9);
}

.is-visible .mk-fields-formula-value {
  opacity: 1;
  transition-delay: 2.1s;
  transform: scale(1);
}

.is-visible .mk-field-type-formula {
  animation: 4s ease-in-out 3s infinite mk-field-formula-pulse;
}

@keyframes mk-field-formula-pulse {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 8px #f8a05414, 0 0 16px #f8a0540a;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-fields-panel, .mk-fields-shimmer {
    animation: none !important;
  }

  .mk-field-type {
    opacity: 1;
    transition: border-color .2s, background-color .2s;
    transform: none;
  }

  .mk-field-type-formula {
    animation: none !important;
  }

  .mk-fields-group, .mk-fields-row {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-fields-formula-flash, .mk-fields-formula-bar {
    animation: none !important;
  }

  .mk-fields-formula-value {
    opacity: 1;
    transition: none;
    transform: none;
  }
}

.mk-portal-browser {
  transition: box-shadow .6s, transform .6s;
}

.mk-portal-browser:hover {
  box-shadow: 0 12px 40px #0e1e3114, 0 2px 8px #0e1e310a;
}

.is-visible .mk-portal-browser {
  animation: 6s ease-in-out 2s infinite mk-portal-shadow-breathe;
}

@keyframes mk-portal-shadow-breathe {
  0%, 100% {
    box-shadow: 0 4px 16px #0e1e310f, 0 1px 4px #0e1e3108;
  }

  50% {
    box-shadow: 0 8px 32px #0e1e3114, 0 2px 8px #0e1e310a;
  }
}

.mk-portal-urlbar-shimmer {
  background: linear-gradient(105deg, #0000 0% 45%, #f8a05408 48%, #f8a0540d 50%, #f8a05408 52%, #0000 55% 100%) 150% 0 / 300% 100%;
}

.is-visible .mk-portal-urlbar-shimmer {
  animation: 12s linear 3s infinite mk-portal-urlbar-shimmer;
}

@keyframes mk-portal-urlbar-shimmer {
  0% {
    background-position: 150% 0;
  }

  25% {
    background-position: -50% 0;
  }

  25.01%, 100% {
    background-position: 150% 0;
  }
}

.mk-portal-logo {
  opacity: 0;
  transition: opacity .5s, transform .5s;
  transform: translateY(4px);
}

.is-visible .mk-portal-logo {
  opacity: 1;
  transition-delay: .6s;
  transform: translateY(0);
}

.mk-portal-step {
  opacity: 0;
  transition: opacity .4s, transform .4s cubic-bezier(.34, 1.56, .64, 1);
  transform: scale(.5);
}

.is-visible .mk-portal-step-1 {
  opacity: 1;
  transition-delay: .9s;
  transform: scale(1);
}

.is-visible .mk-portal-step-2 {
  opacity: 1;
  transition-delay: 1.4s;
  transform: scale(1);
}

.is-visible .mk-portal-step-3 {
  opacity: 1;
  transition-delay: 1.9s;
  transform: scale(1);
}

.is-visible .mk-portal-step-4 {
  opacity: 1;
  transition-delay: 2.6s;
  transform: scale(1);
}

.mk-portal-check {
  opacity: 0;
  transition: opacity .3s, transform .3s cubic-bezier(.34, 1.56, .64, 1);
  transform: scale(0)rotate(-45deg);
}

.is-visible .mk-portal-step-1 .mk-portal-check {
  opacity: 1;
  transition-delay: 1.1s;
  transform: scale(1)rotate(0);
}

.is-visible .mk-portal-step-2 .mk-portal-check {
  opacity: 1;
  transition-delay: 1.6s;
  transform: scale(1)rotate(0);
}

.mk-portal-connector-fill {
  width: 0;
  transition: width .5s cubic-bezier(.22, 1, .36, 1);
}

.is-visible .mk-portal-connector-1 .mk-portal-connector-fill {
  width: 100%;
  transition-delay: 1.1s;
}

.is-visible .mk-portal-connector-2 .mk-portal-connector-fill {
  width: 100%;
  transition-delay: 1.6s;
}

.mk-portal-active-ping {
  opacity: 0;
  transform: scale(.5);
}

.is-visible .mk-portal-active-ping {
  animation: 2.5s ease-in-out 2.2s infinite mk-portal-ping;
}

@keyframes mk-portal-ping {
  0% {
    opacity: .6;
    transform: scale(.8);
  }

  50% {
    opacity: 0;
    transform: scale(2);
  }

  100% {
    opacity: 0;
    transform: scale(2);
  }
}

.mk-portal-step-label-active {
  opacity: 0;
  transition: opacity .4s;
}

.is-visible .mk-portal-step-label-active {
  opacity: 1;
  transition-delay: 2.1s;
}

.mk-portal-doc {
  opacity: 0;
  transition: opacity .4s, transform .4s;
  transform: translateX(-8px);
}

.is-visible .mk-portal-doc-1 {
  opacity: 1;
  transition-delay: 2.4s;
  transform: translateX(0);
}

.is-visible .mk-portal-doc-2 {
  opacity: 1;
  transition-delay: 2.6s;
  transform: translateX(0);
}

.mk-portal-cta {
  opacity: 0;
  transition: opacity .4s, transform .4s;
  transform: translateY(4px);
}

.is-visible .mk-portal-cta {
  opacity: 1;
  transition-delay: 2.8s;
  animation: 4s ease-in-out 3.5s infinite mk-portal-cta-glow;
  transform: translateY(0);
}

@keyframes mk-portal-cta-glow {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 16px #f8a05414, 0 0 32px #f8a0540a;
  }
}

.mk-portal-anno {
  opacity: 0;
  transition: opacity .5s ease-out, transform .5s ease-out;
}

.mk-portal-anno-r1, .mk-portal-anno-r2, .mk-portal-anno-r3 {
  transform: translateX(-12px);
}

.mk-portal-anno-l1 {
  transform: translateX(12px);
}

.is-visible .mk-portal-anno-r1 {
  opacity: 1;
  transition-delay: 1.2s;
  transform: translateX(0);
}

.is-visible .mk-portal-anno-r2 {
  opacity: 1;
  transition-delay: 1.6s;
  transform: translateX(0);
}

.is-visible .mk-portal-anno-r3 {
  opacity: 1;
  transition-delay: 2s;
  transform: translateX(0);
}

.is-visible .mk-portal-anno-l1 {
  opacity: 1;
  transition-delay: 2.4s;
  transform: translateX(0);
}

.mk-portal-connector-line {
  transition: transform .3s ease-out;
  transform: scaleX(0);
}

.is-visible .mk-portal-anno-r1 .mk-portal-connector-line {
  transition-delay: 1.4s;
  transform: scaleX(1);
}

.is-visible .mk-portal-anno-r2 .mk-portal-connector-line {
  transition-delay: 1.8s;
  transform: scaleX(1);
}

.is-visible .mk-portal-anno-r3 .mk-portal-connector-line {
  transition-delay: 2.2s;
  transform: scaleX(1);
}

.is-visible .mk-portal-anno-l1 .mk-portal-connector-line {
  transition-delay: 2.6s;
  transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
  .mk-portal-browser, .mk-portal-urlbar-shimmer {
    animation: none !important;
  }

  .mk-portal-logo {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-portal-step {
    opacity: 1;
    transition: none;
    transform: scale(1);
  }

  .mk-portal-check {
    opacity: 1;
    transition: none;
    transform: scale(1)rotate(0);
  }

  .mk-portal-connector-fill {
    width: 100%;
    transition: none;
  }

  .mk-portal-active-ping {
    opacity: 0;
    animation: none !important;
  }

  .mk-portal-step-label-active {
    opacity: 1;
    transition: none;
  }

  .mk-portal-doc {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-portal-cta {
    opacity: 1;
    transition: none;
    transform: none;
    animation: none !important;
  }

  .mk-portal-anno {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-portal-connector-line {
    transition: none;
    transform: scaleX(1);
  }
}

.mk-inbox-viewport {
  --inbox-row-h: 60px;
  height: calc(3 * var(--inbox-row-h));
  position: relative;
  -webkit-mask-image: linear-gradient(#000 0% 68%, #0000 100%);
  mask-image: linear-gradient(#000 0% 68%, #0000 100%);
}

.mk-inbox-tape {
  transform: translateY(calc(-3 * var(--inbox-row-h)));
}

.is-visible .mk-inbox-tape {
  animation: 15s ease-in-out 2s infinite mk-inbox-cycle;
}

.mk-inbox-email {
  height: var(--inbox-row-h);
  box-sizing: border-box;
}

.mk-inbox-highlight {
  height: var(--inbox-row-h);
  z-index: 2;
  background: linear-gradient(to right, #f8a0540f, #f8a05405 60%, #0000);
  border-left: 3px solid #f8a05466;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.mk-inbox-receipt {
  opacity: 0;
}

.is-visible .mk-inbox-receipt {
  animation: 15s ease-in-out 2s infinite mk-inbox-receipt;
}

@keyframes mk-inbox-receipt {
  0%, 5% {
    opacity: 0;
    transform: translate(0, -50%)translateX(4px);
  }

  12%, 24% {
    opacity: 1;
    transform: translate(0, -50%)translateX(0);
  }

  27%, 33% {
    opacity: 0;
    transform: translate(0, -50%)translateX(4px);
  }

  38%, 57% {
    opacity: 1;
    transform: translate(0, -50%)translateX(0);
  }

  60%, 67% {
    opacity: 0;
    transform: translate(0, -50%)translateX(4px);
  }

  72%, 90% {
    opacity: 1;
    transform: translate(0, -50%)translateX(0);
  }

  93%, 100% {
    opacity: 0;
    transform: translate(0, -50%)translateX(4px);
  }
}

.mk-inbox-cursor {
  top: calc(var(--inbox-row-h) * .5);
  z-index: 3;
  opacity: 0;
  background: #f8a0541a;
  border: 1.5px solid #f8a05433;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  position: absolute;
  left: 55%;
  transform: translate(-50%, -50%)scale(.5);
}

.is-visible .mk-inbox-cursor {
  animation: 15s ease-in-out 2s infinite mk-inbox-cursor;
}

@keyframes mk-inbox-cursor {
  0%, 8% {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.5);
  }

  12% {
    opacity: .8;
    transform: translate(-50%, -50%)scale(1);
  }

  15% {
    opacity: .9;
    transform: translate(-50%, -50%)scale(.75);
  }

  17% {
    opacity: .8;
    transform: translate(-50%, -50%)scale(1);
  }

  22%, 27% {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.5);
  }

  33%, 41% {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.5);
  }

  45% {
    opacity: .8;
    transform: translate(-50%, -50%)scale(1);
  }

  48% {
    opacity: .9;
    transform: translate(-50%, -50%)scale(.75);
  }

  50% {
    opacity: .8;
    transform: translate(-50%, -50%)scale(1);
  }

  55%, 60% {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.5);
  }

  67%, 75% {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.5);
  }

  79% {
    opacity: .8;
    transform: translate(-50%, -50%)scale(1);
  }

  82% {
    opacity: .9;
    transform: translate(-50%, -50%)scale(.75);
  }

  84% {
    opacity: .8;
    transform: translate(-50%, -50%)scale(1);
  }

  89%, 100% {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.5);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-inbox-tape {
    transform: translateY(calc(-3 * var(--inbox-row-h)));
    animation: none !important;
  }

  .mk-inbox-receipt {
    opacity: 1;
    transform: translate(0, -50%);
    animation: none !important;
  }

  .mk-inbox-cursor {
    display: none;
  }

  .mk-inbox-viewport {
    -webkit-mask-image: none;
    mask-image: none;
  }
}

.mk-comm-inbox {
  transition: box-shadow .4s;
}

.mk-comm-inbox:hover {
  box-shadow: 0 8px 32px #0e1e3114, 0 2px 8px #0e1e310a;
}

.mk-comm-badge {
  animation: 3s ease-in-out infinite mk-comm-badge-pulse;
}

@keyframes mk-comm-badge-pulse {
  0%, 100% {
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    box-shadow: 0 0 0 4px #f8a05414;
  }
}

.mk-comm-pulse {
  animation: 2s ease-in-out infinite mk-comm-dot-pulse;
}

@keyframes mk-comm-dot-pulse {
  0%, 100% {
    opacity: .5;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.4);
  }
}

.mk-comm-anno {
  opacity: 0;
  transition: opacity .5s ease-out, transform .5s ease-out;
}

.mk-comm-anno-l1, .mk-comm-anno-l2 {
  transform: translateX(12px);
}

.mk-comm-anno-r1, .mk-comm-anno-r2 {
  transform: translateX(-12px);
}

.mk-reveal.is-visible .mk-comm-anno-l1 {
  opacity: 1;
  transition-delay: .3s;
  transform: translateX(0);
}

.mk-reveal.is-visible .mk-comm-anno-r1 {
  opacity: 1;
  transition-delay: .6s;
  transform: translateX(0);
}

.mk-reveal.is-visible .mk-comm-anno-l2 {
  opacity: 1;
  transition-delay: .9s;
  transform: translateX(0);
}

.mk-reveal.is-visible .mk-comm-anno-r2 {
  opacity: 1;
  transition-delay: 1.2s;
  transform: translateX(0);
}

.mk-comm-connector {
  transition: transform .3s ease-out;
  transform: scaleX(0);
}

.mk-reveal.is-visible .mk-comm-anno-l1 .mk-comm-connector {
  transition-delay: .5s;
  transform: scaleX(1);
}

.mk-reveal.is-visible .mk-comm-anno-r1 .mk-comm-connector {
  transition-delay: .8s;
  transform: scaleX(1);
}

.mk-reveal.is-visible .mk-comm-anno-l2 .mk-comm-connector {
  transition-delay: 1.1s;
  transform: scaleX(1);
}

.mk-reveal.is-visible .mk-comm-anno-r2 .mk-comm-connector {
  transition-delay: 1.4s;
  transform: scaleX(1);
}

.mk-comm-row {
  transition: background-color .3s, transform .2s;
}

.mk-comm-row:hover {
  transform: translateX(2px);
}

.mk-comm-notif:hover .mk-comm-pulse {
  opacity: 1;
  animation: none;
  transform: scale(1.5);
}

@media (prefers-reduced-motion: reduce) {
  .mk-comm-badge {
    animation: none;
  }

  .mk-comm-pulse {
    opacity: .5;
    animation: none;
  }

  .mk-comm-anno {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-comm-connector {
    transition: none;
    transform: scaleX(1);
  }

  .mk-comm-row {
    transition: background-color .3s;
  }

  .mk-comm-row:hover {
    transform: none;
  }
}

.mk-est-round {
  opacity: 0;
  animation: .6s ease-out forwards mk-est-round-in;
  transform: translateY(12px);
}

@keyframes mk-est-round-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-est-drawer {
  opacity: 0;
  transition: opacity .5s ease-out, transform .5s ease-out;
  transform: translateX(-20px);
}

.mk-reveal.is-visible .mk-est-drawer {
  opacity: 1;
  transform: translateX(0);
}

.mk-est-drawer-1 {
  transition-delay: .1s;
}

.mk-est-drawer-2 {
  transition-delay: .2s;
}

.mk-est-drawer-3 {
  transition-delay: .3s;
}

.mk-est-drawer-4 {
  transition-delay: .4s;
}

.mk-est-drawer-5 {
  transition-delay: .5s;
}

.mk-est-drawer-6 {
  transition-delay: .6s;
}

.mk-est-panel {
  opacity: 0;
  transition: opacity .6s ease-out, transform .6s ease-out;
  transform: translateY(16px);
}

.mk-reveal.is-visible .mk-est-panel {
  opacity: 1;
  transform: translateY(0);
}

.mk-est-panel-1 {
  transition-delay: .15s;
}

.mk-est-panel-2 {
  transition-delay: .35s;
}

.mk-est-panel-3 {
  transition-delay: .55s;
}

.mk-est-feat-line {
  transform-origin: 0;
  transition: transform .5s ease-out;
  transform: scaleX(0);
}

.mk-reveal.is-visible .mk-est-feat-line {
  transform: scaleX(1);
}

.mk-est-node {
  animation: 3s ease-in-out infinite mk-est-node-pulse;
}

@keyframes mk-est-node-pulse {
  0%, 100% {
    box-shadow: 0 0 #f8a05426;
  }

  50% {
    box-shadow: 0 0 0 6px #f8a05400;
  }
}

.mk-est-connector {
  transform-origin: top;
  transition: transform .4s ease-out;
  transform: scaleY(0);
}

.mk-reveal.is-visible .mk-est-connector {
  transform: scaleY(1);
}

.mk-est-connector-1 {
  transition-delay: .3s;
}

.mk-est-connector-2 {
  transition-delay: .6s;
}

.mk-est-connector-3 {
  transition-delay: .9s;
}

.mk-est-bar {
  transform-origin: 0;
  transition: transform .8s cubic-bezier(.22, 1, .36, 1);
  transform: scaleX(0);
}

.mk-reveal.is-visible .mk-est-bar {
  transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
  .mk-est-round {
    opacity: 1;
    animation: none;
    transform: none;
  }

  .mk-est-drawer, .mk-est-panel {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-est-feat-line {
    transition: none;
    transform: scaleX(1);
  }

  .mk-est-node {
    animation: none;
  }

  .mk-est-connector {
    transition: none;
    transform: scaleY(1);
  }

  .mk-est-bar {
    transition: none;
    transform: scaleX(1);
  }
}

.mk-rest-job {
  opacity: 0;
  animation: .4s cubic-bezier(.22, 1, .36, 1) forwards mk-rest-job-in;
  transform: scale(.96)translateY(10px);
}

@keyframes mk-rest-job-in {
  to {
    opacity: 1;
    transform: scale(1)translateY(0);
  }
}

.mk-rest-urgent {
  animation: 2s ease-in-out infinite mk-rest-urgent-pulse;
}

@keyframes mk-rest-urgent-pulse {
  0%, 100% {
    box-shadow: 0 0 #ef44444d;
  }

  50% {
    box-shadow: 0 0 0 4px #ef444400;
  }
}

.mk-rest-col-left {
  opacity: 0;
  transition: opacity .6s ease-out, transform .6s ease-out;
  transform: translateX(-16px);
}

.mk-rest-col-right {
  opacity: 0;
  transition: opacity .6s ease-out, transform .6s ease-out;
  transform: translateX(16px);
}

.mk-reveal.is-visible .mk-rest-col-left, .mk-reveal.is-visible .mk-rest-col-right {
  opacity: 1;
  transform: translateX(0);
}

.mk-rest-pain {
  opacity: 0;
  transition: opacity .4s ease-out, transform .4s ease-out;
  transform: translateY(12px);
}

.mk-reveal.is-visible .mk-rest-pain {
  opacity: 1;
  transform: translateY(0);
}

.mk-rest-pain-1 {
  transition-delay: .1s;
}

.mk-rest-pain-2 {
  transition-delay: .25s;
}

.mk-rest-pain-3 {
  transition-delay: .4s;
}

.mk-rest-vignette {
  opacity: 0;
  transition: opacity .4s ease-out;
}

.mk-rest-pain-1 .mk-rest-vignette {
  transition-delay: .4s;
}

.mk-rest-pain-2 .mk-rest-vignette {
  transition-delay: .55s;
}

.mk-rest-pain-3 .mk-rest-vignette {
  transition-delay: .7s;
}

.mk-reveal.is-visible .mk-rest-vignette {
  opacity: 1;
}

.mk-rest-layer {
  opacity: 0;
  transition: opacity .5s ease-out, transform .5s ease-out;
  transform: translateY(16px);
}

.mk-reveal.is-visible .mk-rest-layer {
  opacity: 1;
  transform: translateY(0);
}

.mk-rest-layer-1 {
  transition-delay: .1s;
}

.mk-rest-layer-2 {
  transition-delay: .3s;
}

.mk-rest-layer-3 {
  transition-delay: .5s;
}

.mk-rest-connector {
  opacity: 0;
  transition: opacity .4s ease-out .2s;
}

.mk-reveal.is-visible .mk-rest-connector {
  opacity: 1;
}

.mk-rest-gap {
  animation: 5s ease-in-out infinite mk-rest-gap-breathe;
}

@keyframes mk-rest-gap-breathe {
  0%, 100% {
    border-color: #f8a05426;
  }

  50% {
    border-color: #f8a0544d;
  }
}

.mk-rest-phase-bar {
  transform-origin: 0;
  transition: transform .6s cubic-bezier(.22, 1, .36, 1);
  transform: scaleX(0);
}

.mk-reveal.is-visible .mk-rest-phase-bar {
  transform: scaleX(1);
}

.mk-rest-step {
  opacity: 0;
  transition: opacity .5s ease-out, transform .5s ease-out;
  transform: translateY(20px);
}

.mk-reveal.is-visible .mk-rest-step, .mk-rest-step.mk-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.mk-rest-step-1 {
  transition-delay: .1s;
}

.mk-rest-step-2 {
  transition-delay: .25s;
}

.mk-rest-step-3 {
  transition-delay: .4s;
}

.mk-rest-step-4 {
  transition-delay: .55s;
}

.mk-rest-track {
  transform-origin: 0;
  transition: transform 1.2s cubic-bezier(.22, 1, .36, 1) .2s;
  transform: scaleX(0);
}

.mk-reveal.is-visible .mk-rest-track {
  transform: scaleX(1);
}

.mk-rest-node {
  opacity: 0;
  transition: opacity .4s cubic-bezier(.22, 1, .36, 1), transform .4s cubic-bezier(.22, 1, .36, 1);
  transform: scale(.7);
}

.mk-reveal.is-visible .mk-rest-node {
  opacity: 1;
  transform: scale(1);
}

.mk-rest-node-1 {
  transition-delay: .15s;
}

.mk-rest-node-2 {
  transition-delay: .35s;
}

.mk-rest-node-3 {
  transition-delay: .55s;
}

.mk-rest-node-4 {
  transition-delay: .75s;
}

@media (prefers-reduced-motion: reduce) {
  .mk-rest-job {
    opacity: 1;
    animation: none;
    transform: none;
  }

  .mk-rest-urgent {
    animation: none;
  }

  .mk-rest-col-left, .mk-rest-col-right, .mk-rest-pain {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-rest-vignette {
    opacity: 1;
    transition: none;
  }

  .mk-rest-layer {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-rest-connector {
    opacity: 1;
    transition: none;
  }

  .mk-rest-gap {
    border-color: #f8a05433;
    animation: none;
  }

  .mk-rest-phase-bar {
    transition: none;
    transform: scaleX(1);
  }

  .mk-rest-step {
    opacity: 1;
    transition: none;
    transform: none;
  }

  .mk-rest-track {
    transition: none;
    transform: scaleX(1);
  }

  .mk-rest-node {
    opacity: 1;
    transition: none;
    transform: none;
  }
}

.mk-warm-gradient {
  background: linear-gradient(165deg, var(--color-surface-alt) 0%, #fbf4eb73 50%, var(--color-surface-alt) 100%);
  position: relative;
}

.mk-cta-card {
  transition: transform .4s cubic-bezier(.22, 1, .36, 1), box-shadow .4s;
}

.mk-cta-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 40px #0003;
}

.mk-cta-primary-btn {
  position: relative;
}

.mk-cta-primary-btn:after {
  content: "";
  border-radius: inherit;
  pointer-events: none;
  background: none;
  animation: 3s ease-in-out infinite mk-cta-glow;
  position: absolute;
  inset: -1px;
  box-shadow: 0 0 20px 4px #f8a0541f;
}

@keyframes mk-cta-glow {
  0%, 100% {
    opacity: .4;
  }

  50% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-cta-card {
    transition: none;
  }

  .mk-cta-card:hover {
    transform: none;
  }

  .mk-cta-primary-btn:after {
    opacity: .7;
    animation: none;
  }
}

.mk-ia-term {
  animation: 20s ease-in-out infinite mk-ia-drift;
}

@keyframes mk-ia-drift {
  0%, 100% {
    translate: 0;
  }

  25% {
    translate: 2px -6px;
  }

  50% {
    translate: -3px 3px;
  }

  75% {
    translate: 4px -3px;
  }
}

.mk-ia-source-node {
  opacity: 0;
  animation: .5s cubic-bezier(.22, 1, .36, 1) both mk-ia-source-enter;
  animation-delay: calc(.9s + var(--node-delay, 0s));
  transform: translateX(-12px);
}

@keyframes mk-ia-source-enter {
  0% {
    opacity: 0;
    transform: translateX(-12px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes mk-ia-node-ping {
  0% {
    opacity: .15;
    transform: scale(1);
  }

  50% {
    opacity: 0;
    transform: scale(2.5);
  }

  100% {
    opacity: 0;
    transform: scale(2.5);
  }
}

.mk-ia-flow-line {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000px;
  animation: 1.2s ease-out both mk-ia-line-draw;
  animation-delay: calc(1.1s + var(--flow-delay, 0s));
}

@keyframes mk-ia-line-draw {
  0% {
    stroke-dashoffset: 1000px;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

.mk-ia-dest-card {
  opacity: 0;
  animation: .7s cubic-bezier(.22, 1, .36, 1) 1.6s both mk-ia-dest-enter;
  transform: translateX(20px);
}

@keyframes mk-ia-dest-enter {
  0% {
    opacity: 0;
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.mk-ia-bar {
  opacity: 0;
  transform: translateY(8px);
}

.mk-reveal.is-visible .mk-ia-bar {
  animation: .5s cubic-bezier(.22, 1, .36, 1) both mk-ia-bar-enter;
}

@keyframes mk-ia-bar-enter {
  0% {
    opacity: 0;
    transform: translateY(8px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-ia-stage {
  opacity: 0;
  transform: translateY(12px);
}

.mk-reveal.is-visible .mk-ia-stage {
  animation: .6s cubic-bezier(.22, 1, .36, 1) both mk-ia-stage-enter;
}

@keyframes mk-ia-stage-enter {
  0% {
    opacity: 0;
    transform: translateY(12px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-ia-progress {
  transform-origin: 0;
  transform: scaleX(0);
}

.mk-reveal.is-visible .mk-ia-progress {
  animation: .8s cubic-bezier(.22, 1, .36, 1) .4s both mk-ia-progress-fill;
}

@keyframes mk-ia-progress-fill {
  0% {
    transform: scaleX(0);
  }

  100% {
    transform: scaleX(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mk-ia-term {
    animation: none;
  }

  .mk-ia-source-node {
    opacity: 1;
    animation: none;
    transform: none;
  }

  .mk-ia-flow-line {
    stroke-dashoffset: 0;
    animation: none;
  }

  .mk-ia-flow-pulse {
    animation: none;
  }

  .mk-ia-dest-card {
    opacity: 1;
    animation: none;
    transform: none;
  }

  .mk-ia-bar {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-ia-bar {
    animation: none;
  }

  .mk-ia-stage {
    opacity: 1;
    transform: none;
  }

  .mk-reveal.is-visible .mk-ia-stage {
    animation: none;
  }

  .mk-ia-progress {
    transform: scaleX(1);
  }

  .mk-reveal.is-visible .mk-ia-progress {
    animation: none;
  }
}

html {
  background-color: var(--color-primary-darker);
  overflow-x: hidden;
}

.mk-footer {
  background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-dark) 40%, var(--color-primary-darker) 100%);
}

.mk-footer-grid {
  background-image: radial-gradient(circle, #ffffff05 1px, #0000 1px);
  background-size: 24px 24px;
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(#0000 0%, #0006 30%, #0009 60%, #0000 100%);
  mask-image: linear-gradient(#0000 0%, #0006 30%, #0009 60%, #0000 100%);
}

.mk-footer-constellation {
  height: 36px;
  position: relative;
}

.mk-constellation-canvas {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.mk-ember {
  opacity: 0;
  will-change: transform, opacity;
  width: 2px;
  height: 2px;
  animation: 14s ease-out infinite mk-ember-rise;
  animation-delay: var(--d, 0s);
  background: #f8a05459;
  border-radius: 50%;
  position: absolute;
  bottom: 0;
}

.mk-ember:nth-child(2n) {
  background: #f8b47840;
  width: 1.5px;
  height: 1.5px;
}

.mk-ember:nth-child(3n) {
  background: #f8a05433;
  width: 2.5px;
  height: 2.5px;
}

@keyframes mk-ember-rise {
  0% {
    opacity: 0;
    transform: translateY(0)translateX(0);
  }

  8% {
    opacity: .7;
  }

  40% {
    opacity: .4;
  }

  100% {
    transform: translateY(calc(var(--h, 100px) * -1)) translateX(12px);
    opacity: 0;
  }
}

.mk-footer-heading {
  text-transform: uppercase;
  letter-spacing: .15em;
  color: #ffffff4d;
  margin-bottom: 1rem;
  padding-bottom: .5rem;
  font-size: .65rem;
  font-weight: 600;
  position: relative;
}

.mk-footer-heading:after {
  content: "";
  background: linear-gradient(to right, #f8a05433, #0000);
  width: 16px;
  height: 1px;
  transition: width .4s cubic-bezier(.22, 1, .36, 1);
  position: absolute;
  bottom: 0;
  left: 0;
}

.mk-footer-link {
  color: #ffffff59;
  padding: 1px 0;
  font-size: .8rem;
  text-decoration: none;
  transition: color .2s, transform .2s;
  display: inline-block;
}

.mk-footer-link:hover {
  color: #ffffffd9;
  transform: translateX(2px);
}

.mk-footer-pulse {
  animation: 4s ease-in-out infinite mk-footer-pulse;
}

@keyframes mk-footer-pulse {
  0%, 100% {
    opacity: .4;
    box-shadow: 0 0 #f8a05400;
  }

  50% {
    opacity: 1;
    box-shadow: 0 0 8px 2px #f8a0541f;
  }
}

.mk-footer-badge {
  color: #ffffff2e;
  letter-spacing: .02em;
  align-items: center;
  gap: 4px;
  font-size: .6rem;
  display: flex;
}

@media (prefers-reduced-motion: reduce) {
  .mk-footer-pulse, .mk-ember {
    animation: none !important;
  }

  .mk-footer-pulse {
    opacity: .6;
  }

  .mk-constellation-canvas {
    display: none;
  }

  .mk-ember {
    opacity: 0;
  }
}

@media (max-width: 639px) {
  .mk-footer-grid {
    background-size: 20px 20px;
  }

  .mk-ember:nth-child(n+5) {
    display: none;
  }
}

.mk-event-pulse {
  animation: 2.5s cubic-bezier(.37, 0, .63, 1) infinite mk-event-pulse;
}

@keyframes mk-event-pulse {
  0%, 100% {
    opacity: .4;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.4);
  }
}

.mk-event-panel {
  background: #fafaf8eb;
  border: 1px solid #e8e6e180;
  border-radius: 16px;
  height: 100%;
  padding: 28px;
  transition: transform .4s cubic-bezier(.22, 1, .36, 1), box-shadow .4s cubic-bezier(.22, 1, .36, 1), border-color .35s, background .35s;
}

.mk-event-panel:hover {
  background: #fffffff7;
  border-color: #f8a05440;
  transform: translateY(-3px);
  box-shadow: 0 8px 24px #0e1e310a, 0 2px 6px #f8a0540f;
}

.mk-event-illust {
  border-radius: 10px;
  width: 100%;
  height: 80px;
  overflow: hidden;
}

.mk-event-dark {
  background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
}

@media (prefers-reduced-motion: reduce) {
  .mk-event-pulse {
    opacity: .6;
    animation: none !important;
  }
}

@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-divide-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-gradient-position {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-stops {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}

@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}

@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-tracking {
  syntax: "*";
  inherits: false
}

@property --tw-ordinal {
  syntax: "*";
  inherits: false
}

@property --tw-slashed-zero {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-figure {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-duration {
  syntax: "*";
  inherits: false
}

@property --tw-ease {
  syntax: "*";
  inherits: false
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}