@charset "UTF-8";
/* ================================================
 * Generated by Dopamine Fluid
 *
 * Default viewport : 320px – 1440px
 * Breakpoints      : sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px, xxxl: 1600px, xxxxl: 1920px
 * Generated        : 8/11/2026, 5:24:40 PM
 * Rules            : 290
 * ============================================== */
/* Reset */
*, *::before, *::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

body {
  min-height: 100vh;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

/* Grid */
.container-1200 {
  width: 100%;
  max-width: 75rem;
  margin-left: auto;
  margin-right: auto;
}

.fw-medium {
  font-weight: 500;
}

.container-960 {
  width: 100%;
  max-width: 60rem;
  margin-left: auto;
  margin-right: auto;
}

.fw-bold {
  font-weight: 700;
}

.grid {
  display: grid;
}

.text-start {
  text-align: start;
}

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

.text-end {
  text-align: end;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.overflow-hidden {
  overflow: hidden;
}

.flex {
  display: flex;
}

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

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

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

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

.overflow-auto {
  overflow: auto;
}

.overflow-scroll {
  overflow: scroll;
}

.overflow-visible {
  overflow: visible;
}

.text-right {
  text-align: right;
}

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

.fw-light {
  font-weight: 300;
}

.fw-normal {
  font-weight: 400;
}

.fw-semibold {
  font-weight: 600;
}

.container-1100 {
  width: 100%;
  max-width: 68.75rem;
  margin-left: auto;
  margin-right: auto;
}

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

.container-860 {
  width: 100%;
  max-width: 53.75rem;
  margin-left: auto;
  margin-right: auto;
}

.container-1920 {
  width: 100%;
  max-width: 120rem;
  margin-left: auto;
  margin-right: auto;
}

.text-left {
  text-align: left;
}

.container-1440 {
  width: 100%;
  max-width: 90rem;
  margin-left: auto;
  margin-right: auto;
}

.container-800 {
  width: 100%;
  max-width: 50rem;
  margin-left: auto;
  margin-right: auto;
}

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

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

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

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

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

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

.justify-self-start {
  justify-self: start;
}

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

.justify-self-end {
  justify-self: end;
}

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

.hidden {
  display: none;
}

.block {
  display: block;
}

.inline {
  display: inline;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/* Base */
.p-8 {
  /* fixed at 8px */
  padding: 0.5rem;
}

.fs-24 {
  /* fixed at 24px */
  font-size: 1.5rem;
}

.px-16-48 {
  padding-left: clamp(1rem, 2.8571vw + 0.4286rem, 3rem);
  padding-right: clamp(1rem, 2.8571vw + 0.4286rem, 3rem);
}

.py-16 {
  /* fixed at 16px */
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.maxw-360 {
  /* fixed at 360px */
  max-width: 22.5rem;
}

.px-16 {
  /* fixed at 16px */
  padding-left: 1rem;
  padding-right: 1rem;
}

.py-8 {
  /* fixed at 8px */
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.fs-14 {
  /* fixed at 14px */
  font-size: 0.875rem;
}

.radius-100 {
  /* fixed at 100px */
  border-radius: 6.25rem;
}

.fs-32-72 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(2rem, 3.7559vw + 1.1197rem, 4.5rem);
}

.mt-40-80 {
  margin-top: clamp(2.5rem, 3.5714vw + 1.7857rem, 5rem);
}

.mb-8-16 {
  margin-bottom: clamp(0.5rem, 0.7143vw + 0.3571rem, 1rem);
}

.fs-16-24 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1rem, 0.7512vw + 0.8239rem, 1.5rem);
}

.lh-1\.5 {
  line-height: 1.5;
}

.mb-40-80 {
  margin-bottom: clamp(2.5rem, 3.5714vw + 1.7857rem, 5rem);
}

.fs-24-48 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1.5rem, 2.2535vw + 0.9718rem, 3rem);
}

.mb-12-24 {
  margin-bottom: clamp(0.75rem, 1.0714vw + 0.5357rem, 1.5rem);
}

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

.gap-16-32 {
  gap: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
}

.mb-16-32 {
  margin-bottom: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
}

.p-12-32 {
  padding: clamp(0.75rem, 1.7857vw + 0.3929rem, 2rem);
}

.radius-4-12 {
  border-radius: clamp(0.25rem, 0.7143vw + 0.1071rem, 0.75rem);
}

.fs-18-24 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1.125rem, 0.5634vw + 0.993rem, 1.5rem);
}

.fs-14-18 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(0.875rem, 0.3756vw + 0.787rem, 1.125rem);
}

.p-12-24 {
  padding: clamp(0.75rem, 1.0714vw + 0.5357rem, 1.5rem);
}

.radius-4-8 {
  border-radius: clamp(0.25rem, 0.3571vw + 0.1786rem, 0.5rem);
}

.minh-120 {
  /* fixed at 120px */
  min-height: 7.5rem;
}

.mb-4-8 {
  margin-bottom: clamp(0.25rem, 0.3571vw + 0.1786rem, 0.5rem);
}

.bottom-8 {
  /* fixed at 8px */
  bottom: 0.5rem;
}

.end-8 {
  /* fixed at 8px */
  inset-inline-end: 0.5rem;
}

.fs-12-16 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(0.75rem, 0.3756vw + 0.662rem, 1rem);
}

.inset-0 {
  /* fixed at 0px */
  inset: 0rem;
}

.top-10-30 {
  top: clamp(0.625rem, 1.7857vw + 0.2679rem, 1.875rem);
}

.start-16 {
  /* fixed at 16px */
  inset-inline-start: 1rem;
}

.ratio-16\/9 {
  aspect-ratio: 16/9;
}

.ratio-1\/1 {
  aspect-ratio: 1/1;
}

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

.maxh-100 {
  /* fixed at 100px */
  max-height: 6.25rem;
}

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

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

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

.mt-16-32 {
  margin-top: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
}

.pt-24-48 {
  padding-top: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.mb-24-48 {
  margin-bottom: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.gap-8 {
  /* fixed at 8px */
  gap: 0.5rem;
}

.fs-48-96 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(3rem, 4.507vw + 1.9437rem, 6rem);
}

.fs-20-32 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1.25rem, 1.1268vw + 0.9859rem, 2rem);
}

.fs-12 {
  /* fixed at 12px */
  font-size: 0.75rem;
}

.fs-16 {
  /* fixed at 16px */
  font-size: 1rem;
}

.fs-20 {
  /* fixed at 20px */
  font-size: 1.25rem;
}

.fs-32 {
  /* fixed at 32px */
  font-size: 2rem;
}

.p-16-32 {
  padding: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
}

.fs-16-48--480-1920 {
  /* viewport: 480px–1920px [inline] */
  font-size: clamp(1rem, 2.2222vw + 0.3333rem, 3rem);
}

.fs-20-28 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1.25rem, 0.7512vw + 1.0739rem, 1.75rem);
}

.fw-100 {
  font-weight: 100;
}

.fw-200 {
  font-weight: 200;
}

.fw-300 {
  font-weight: 300;
}

.fw-400 {
  font-weight: 400;
}

.fw-500 {
  font-weight: 500;
}

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.fw-800 {
  font-weight: 800;
}

.fw-900 {
  font-weight: 900;
}

.fs-16-20 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1rem, 0.3756vw + 0.912rem, 1.25rem);
}

.lh-1\.2 {
  line-height: 1.2;
}

.lh-2 {
  line-height: 2;
}

.ls-2 {
  letter-spacing: 0.02em;
}

.ls-5 {
  letter-spacing: 0.05em;
}

.ls-10 {
  letter-spacing: 0.1em;
}

.fs-12-14 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(0.75rem, 0.1878vw + 0.706rem, 0.875rem);
}

.mt-8-16 {
  margin-top: clamp(0.5rem, 0.7143vw + 0.3571rem, 1rem);
}

.fs-32-64 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(2rem, 3.0047vw + 1.2958rem, 4rem);
}

.ls-n2 {
  letter-spacing: -0.02em;
}

.gap-8-16 {
  gap: clamp(0.5rem, 0.7143vw + 0.3571rem, 1rem);
}

.p-8-16 {
  padding: clamp(0.5rem, 0.7143vw + 0.3571rem, 1rem);
}

.p-24-48 {
  padding: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.p-32-64 {
  padding: clamp(2rem, 2.8571vw + 1.4286rem, 4rem);
}

.pt-24 {
  /* fixed at 24px */
  padding-top: 1.5rem;
}

.pb-24 {
  /* fixed at 24px */
  padding-bottom: 1.5rem;
}

.ps-24 {
  /* fixed at 24px */
  padding-inline-start: 1.5rem;
}

.pe-24 {
  /* fixed at 24px */
  padding-inline-end: 1.5rem;
}

.px-24-48 {
  padding-left: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
  padding-right: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.py-24-48 {
  padding-top: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
  padding-bottom: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.m-16 {
  /* fixed at 16px */
  margin: 1rem;
}

.mt-16 {
  /* fixed at 16px */
  margin-top: 1rem;
}

.mb-16 {
  /* fixed at 16px */
  margin-bottom: 1rem;
}

.ms-16 {
  /* fixed at 16px */
  margin-inline-start: 1rem;
}

.me-16 {
  /* fixed at 16px */
  margin-inline-end: 1rem;
}

.mt-16-48 {
  margin-top: clamp(1rem, 2.8571vw + 0.4286rem, 3rem);
}

.mb-16-48 {
  margin-bottom: clamp(1rem, 2.8571vw + 0.4286rem, 3rem);
}

.mx-24-48 {
  margin-left: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
  margin-right: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.my-24-48 {
  margin-top: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
  margin-bottom: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.maxw-400 {
  /* fixed at 400px */
  max-width: 25rem;
}

.ms-auto {
  margin-inline-start: auto;
}

:where(.stack-16-32) > * + * {
  margin-top: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
}

.p-16 {
  /* fixed at 16px */
  padding: 1rem;
}

:where(.stack-8-16) > * + * {
  margin-top: clamp(0.5rem, 0.7143vw + 0.3571rem, 1rem);
}

.mt-32-48 {
  margin-top: clamp(2rem, 1.4286vw + 1.7143rem, 3rem);
}

.mt-0 {
  /* fixed at 0px */
  margin-top: 0rem;
}

.p-24 {
  /* fixed at 24px */
  padding: 1.5rem;
}

.mt-n10 {
  /* fixed at -10px */
  margin-top: -0.625rem;
}

.ms-n16 {
  /* fixed at -16px */
  margin-inline-start: -1rem;
}

.me-n16 {
  /* fixed at -16px */
  margin-inline-end: -1rem;
}

.w-200 {
  /* fixed at 200px */
  width: 12.5rem;
}

.h-80 {
  /* fixed at 80px */
  height: 5rem;
}

.w-100-400 {
  width: clamp(6.25rem, 26.7857vw + 0.8929rem, 25rem);
}

.h-120 {
  /* fixed at 120px */
  height: 7.5rem;
}

.maxw-600 {
  /* fixed at 600px */
  max-width: 37.5rem;
}

.minw-320 {
  /* fixed at 320px */
  min-width: 20rem;
}

.maxw-800 {
  /* fixed at 800px */
  max-width: 50rem;
}

.minh-150 {
  /* fixed at 150px */
  min-height: 9.375rem;
}

.w-50\% {
  width: 50%;
}

.w-100\% {
  width: 100%;
}

.maxw-80\% {
  max-width: 80%;
}

.minh-50\% {
  min-height: 50%;
}

.maxw-65ch {
  max-width: 65ch;
}

.gap-16 {
  /* fixed at 16px */
  gap: 1rem;
}

.w-80 {
  /* fixed at 80px */
  width: 5rem;
}

.radius-4 {
  /* fixed at 4px */
  border-radius: 0.25rem;
}

.radius-8 {
  /* fixed at 8px */
  border-radius: 0.5rem;
}

.radius-16 {
  /* fixed at 16px */
  border-radius: 1rem;
}

.radius-4-16 {
  border-radius: clamp(0.25rem, 1.0714vw + 0.0357rem, 1rem);
}

.radius-40 {
  /* fixed at 40px */
  border-radius: 2.5rem;
}

.radius-8-16 {
  border-radius: clamp(0.5rem, 0.7143vw + 0.3571rem, 1rem);
}

.p-24-80 {
  padding: clamp(1.5rem, 5vw + 0.5rem, 5rem);
}

.fs-48-120 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(3rem, 6.7606vw + 1.4155rem, 7.5rem);
}

.mb-8-24 {
  margin-bottom: clamp(0.5rem, 1.4286vw + 0.2143rem, 1.5rem);
}

.fs-18-28 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1.125rem, 0.939vw + 0.9049rem, 1.75rem);
}

.lh-1\.6 {
  line-height: 1.6;
}

.mb-16-40 {
  margin-bottom: clamp(1rem, 2.1429vw + 0.5714rem, 2.5rem);
}

.px-16-32 {
  padding-left: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
  padding-right: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
}

.mb-24-40 {
  margin-bottom: clamp(1.5rem, 1.4286vw + 1.2143rem, 2.5rem);
}

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

.gap-8-40 {
  gap: clamp(0.5rem, 2.8571vw - 0.0714rem, 2.5rem);
}

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

.gapx-32-48 {
  column-gap: clamp(2rem, 1.4286vw + 1.7143rem, 3rem);
}

.gapy-4-8 {
  row-gap: clamp(0.25rem, 0.3571vw + 0.1786rem, 0.5rem);
}

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

.minh-200 {
  /* fixed at 200px */
  min-height: 12.5rem;
}

.p-4 {
  /* fixed at 4px */
  padding: 0.25rem;
}

.gap-4 {
  /* fixed at 4px */
  gap: 0.25rem;
}

.minh-100 {
  /* fixed at 100px */
  min-height: 6.25rem;
}

.mt-24-48 {
  margin-top: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
}

.fs-14-16 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(0.875rem, 0.1878vw + 0.831rem, 1rem);
}

.lh-1\.3 {
  line-height: 1.3;
}

.gap-12 {
  /* fixed at 12px */
  gap: 0.75rem;
}

.py-12 {
  /* fixed at 12px */
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.me-auto {
  margin-inline-end: auto;
}

.p-12-16 {
  padding: clamp(0.75rem, 0.3571vw + 0.6786rem, 1rem);
}

.p-0 {
  /* fixed at 0px */
  padding: 0rem;
}

.m-0 {
  /* fixed at 0px */
  margin: 0rem;
}

.mt-48 {
  /* fixed at 48px */
  margin-top: 3rem;
}

.mb-8 {
  /* fixed at 8px */
  margin-bottom: 0.5rem;
}

.py-14 {
  /* fixed at 14px */
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}

.px-12 {
  /* fixed at 12px */
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.w-100 {
  /* fixed at 100px */
  width: 6.25rem;
}

.py-24 {
  /* fixed at 24px */
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.p-8-12 {
  padding: clamp(0.5rem, 0.3571vw + 0.4286rem, 0.75rem);
}

.lh-1 {
  line-height: 1;
}

.fs-28-48 {
  /* viewport: 375px–1440px [prefix-config] */
  font-size: clamp(1.75rem, 1.8779vw + 1.3099rem, 3rem);
}

.my-40-80 {
  margin-top: clamp(2.5rem, 3.5714vw + 1.7857rem, 5rem);
  margin-bottom: clamp(2.5rem, 3.5714vw + 1.7857rem, 5rem);
}

.mt-12-24 {
  margin-top: clamp(0.75rem, 1.0714vw + 0.5357rem, 1.5rem);
}

.cols-fit-250 {
  grid-template-columns: repeat(auto-fit, minmax(min(15.625rem, 100%), 1fr));
}

.cols-fit-200 {
  grid-template-columns: repeat(auto-fit, minmax(min(12.5rem, 100%), 1fr));
}

.cols-fill-200 {
  grid-template-columns: repeat(auto-fill, minmax(min(12.5rem, 100%), 1fr));
}

.order-1 {
  order: 1;
}

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

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

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

.span-10 {
  grid-column: span 10;
}

.span-4 {
  grid-column: span 4;
}

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

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

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

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

.p-16-24 {
  padding: clamp(1rem, 0.7143vw + 0.8571rem, 1.5rem);
}

.mt-24-40 {
  margin-top: clamp(1.5rem, 1.4286vw + 1.2143rem, 2.5rem);
}

.maxw-500 {
  /* fixed at 500px */
  max-width: 31.25rem;
}

.px-8 {
  /* fixed at 8px */
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.py-4 {
  /* fixed at 4px */
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.mt-4 {
  /* fixed at 4px */
  margin-top: 0.25rem;
}

/* sm — min-width: 576px */
@media (min-width: 576px) {
  .fs-sm-16-24 {
    /* viewport: 375px–1440px [prefix-config] */
    font-size: clamp(1rem, 0.7512vw + 0.8239rem, 1.5rem);
  }
  .cols-sm-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* md — min-width: 768px */
@media (min-width: 768px) {
  .text-md-start {
    text-align: start;
  }
  .block-md {
    display: block;
  }
  .hidden-md {
    display: none;
  }
  .flex-row-md {
    flex-direction: row;
  }
  .flex-md-row {
    flex-direction: row;
  }
  .cols-md-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .cols-md-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .ratio-md-21\/9 {
    aspect-ratio: 21/9;
  }
  .fs-md-18-32 {
    /* viewport: 375px–1440px [prefix-config] */
    font-size: clamp(1.125rem, 1.3146vw + 0.8169rem, 2rem);
  }
  .ls-md-2 {
    letter-spacing: 0.02em;
  }
  .p-md-16-48 {
    padding: clamp(1rem, 2.8571vw + 0.4286rem, 3rem);
  }
  .mb-md-16-32 {
    margin-bottom: clamp(1rem, 1.4286vw + 0.7143rem, 2rem);
  }
  .w-md-300 {
    /* fixed at 300px */
    width: 18.75rem;
  }
  .minh-md-200 {
    /* fixed at 200px */
    min-height: 12.5rem;
  }
  .cols-md-1\.3 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
  }
  .cols-md-1\.3\.1 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr) minmax(0, 1fr);
  }
  .cols-md-1\.1\.1 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
  }
  .mt-md-0 {
    /* fixed at 0px */
    margin-top: 0rem;
  }
  .cols-md-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .p-md-0 {
    /* fixed at 0px */
    padding: 0rem;
  }
  .w-md-auto {
    width: auto;
  }
  .cols-md-2\.1 {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  }
  .cols-md-1\:3 {
    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
  }
  .span-md-2 {
    grid-column: span 2;
  }
  .cols-md-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .span-md-3 {
    grid-column: span 3;
  }
  .span-md-9 {
    grid-column: span 9;
  }
  .order-md-2 {
    order: 2;
  }
}
/* lg — min-width: 992px */
@media (min-width: 992px) {
  .text-left-lg {
    text-align: left;
  }
  .block-lg {
    display: block;
  }
  .fs-lg-24-48 {
    /* viewport: 375px–1440px [prefix-config] */
    font-size: clamp(1.5rem, 2.2535vw + 0.9718rem, 3rem);
  }
  .cols-lg-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .p-lg-24-64 {
    padding: clamp(1.5rem, 3.5714vw + 0.7857rem, 4rem);
  }
  .mt-lg-24-48 {
    margin-top: clamp(1.5rem, 2.1429vw + 1.0714rem, 3rem);
  }
  .maxw-lg-600 {
    /* fixed at 600px */
    max-width: 37.5rem;
  }
  .cols-lg-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .order-lg-4 {
    order: 4;
  }
}
/* xl — min-width: 1200px */
@media (min-width: 1200px) {
  .cols-xl-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
/* xxl — min-width: 1400px */
@media (min-width: 1400px) {
  .block-xxl {
    display: block;
  }
  .cols-xxl-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}

code {
  background: rgba(0, 0, 0, 0.06);
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 0.82em;
  color: #0f0f0f;
  font-weight: 600;
}

pre {
  background: #0f0f0f !important;
}
pre code {
  background: none;
  color: #6ee7b7;
  font-weight: 400;
  font-size: 0.875rem;
  padding: 0;
  border-radius: 0;
}

a {
  color: #0f0f0f;
  text-decoration: none;
}

.docs-nav {
  background: #0f0f0f;
  position: sticky;
  top: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.6rem 1rem;
}
.docs-nav a {
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.4rem 0.85rem;
  border: 1.5px solid transparent;
  border-radius: 100px;
  transition: all 0.15s ease;
}
.docs-nav a:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.2);
}
.docs-nav a.active {
  color: #0f0f0f;
  background: #fff;
  border-color: #fff;
}
.docs-nav .docs-nav__github {
  margin-left: auto;
}
.docs-nav .docs-nav__brand {
  color: #fff;
  font-weight: 900;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-right: auto;
}
.docs-nav .docs-nav__brand.active {
  background: none;
  border-color: transparent;
  color: #fff;
}
.docs-nav .docs-nav__brand:hover {
  border-color: transparent;
}
.docs-nav .menu__toggle {
  color: #fff;
  font-size: 1.5rem;
  padding: 0.25rem 0.5rem;
}
.docs-nav .menu__close {
  color: #fff;
}
.docs-nav .menu__drawer {
  background: #0f0f0f;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.5rem 1rem;
}
.docs-nav .menu__overlay {
  background: rgba(0, 0, 0, 0.5);
}
@media (min-width: 768px) {
  .docs-nav .menu__drawer {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    padding: 0;
    background: none;
  }
}

.docs-search {
  background: #fff;
  border-bottom: 2px solid #0f0f0f;
  position: sticky;
  top: 44px;
  z-index: 99;
}
.docs-search input {
  width: 100%;
  border: 2px solid #0f0f0f;
  outline: none;
  transition: box-shadow 0.15s;
}
.docs-search input:focus {
  box-shadow: 4px 4px 0 #0f0f0f;
}
.docs-search input::placeholder {
  color: #9ca3af;
}

.docs-section[hidden] {
  display: none;
}

.docs-table {
  width: 100%;
  border-collapse: collapse;
}
.docs-table th {
  text-align: left;
}
.docs-table th, .docs-table td {
  border-bottom: 1px solid #e0e0e0;
}
.docs-table tr:last-child td {
  border-bottom: none;
}

.docs-hero {
  color: #0f0f0f;
  border-bottom: 3px solid #0f0f0f;
  animation: hero-colors 20s ease infinite;
}

@keyframes hero-colors {
  0%, 100% {
    background: #6ee7b7;
  }
  50% {
    background: #bef264;
  }
}
.docs-content section > h2 {
  text-transform: uppercase;
  letter-spacing: -0.02em;
  border-bottom: 3px solid #0f0f0f;
}

.demo-box {
  border: 2px solid #0f0f0f;
  transition: box-shadow 0.15s, transform 0.15s;
}
.demo-box:hover {
  box-shadow: 4px 4px 0 #0f0f0f;
  transform: translate(-2px, -2px);
}

.demo-box--blue {
  background: #7dd3fc;
  border: 2px solid #0f0f0f;
}

.demo-box--green {
  background: #6ee7b7;
  border: 2px solid #0f0f0f;
}

.demo-box--orange {
  background: #fdba74;
  border: 2px solid #0f0f0f;
}

.demo-box--purple {
  background: #c4b5fd;
  border: 2px solid #0f0f0f;
}

.demo-box--red {
  background: #f9a8d4;
  border: 2px solid #0f0f0f;
}

.demo-box--dashed {
  background: #fafafa;
  border: 2px dashed #0f0f0f;
}

.docs-content .grid > div,
.docs-content .grid > aside,
.docs-content .grid > main {
  background: #6ee7b7;
  border: 2px solid #0f0f0f;
  transition: box-shadow 0.15s, transform 0.15s;
}
.docs-content .grid > div:hover,
.docs-content .grid > aside:hover,
.docs-content .grid > main:hover {
  box-shadow: 3px 3px 0 #0f0f0f;
  transform: translate(-1px, -1px);
}

.docs-content .flex > div,
.docs-content .flex > span {
  background: #fde047;
  border: 2px solid #0f0f0f;
}

.container-demo-960 {
  background: #7dd3fc;
  border: 2px solid #0f0f0f;
}

.container-demo-1100 {
  background: #6ee7b7;
  border: 2px solid #0f0f0f;
}

.container-demo-1200 {
  background: #fde047;
  border: 2px solid #0f0f0f;
}

.container-demo-1440 {
  background: #fdba74;
  border: 2px solid #0f0f0f;
}

.container-demo-1920 {
  background: #c4b5fd;
  border: 2px solid #0f0f0f;
}

.container-demo-800 {
  background: #f9a8d4;
  border: 2px solid #0f0f0f;
}

.docs-cards a {
  color: #0f0f0f;
  border: 2px solid #0f0f0f;
  transition: box-shadow 0.15s, transform 0.15s;
}
.docs-cards a:hover {
  box-shadow: 6px 6px 0 #0f0f0f;
  transform: translate(-3px, -3px);
}
.docs-cards a h3 {
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.docs-cards a p {
  color: #374151;
}

.docs-cards a:nth-child(1) {
  background: #c4b5fd;
}

.docs-cards a:nth-child(2) {
  background: #7dd3fc;
}

.docs-cards a:nth-child(3) {
  background: #fdba74;
}

.docs-cards a:nth-child(4) {
  background: #6ee7b7;
}

.docs-cards a:nth-child(5) {
  background: #fde047;
}

.docs-cards a:nth-child(6) {
  background: #f9a8d4;
}

.docs-cards a:nth-child(7) {
  background: #bef264;
}

.docs-cards a:nth-child(8) {
  background: #c4b5fd;
}

.docs-cards a:nth-child(9) {
  background: #7dd3fc;
}

.github-btn {
  position: fixed;
  bottom: 1.25rem;
  left: 1.25rem;
  z-index: 100;
  background: #fde047;
  border: 2px solid #0f0f0f;
  color: #0f0f0f;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  transition: box-shadow 0.15s, transform 0.15s;
}
.github-btn:hover {
  box-shadow: 4px 4px 0 #0f0f0f;
  transform: translate(-2px, -2px);
}
.github-btn svg {
  width: 20px;
  height: 20px;
  fill: #0f0f0f;
}

.accordion__title--dark {
  background: #0f0f0f;
  color: #fff;
}
.accordion__title--dark::after {
  color: #fff;
}

footer {
  border-top: 3px solid #0f0f0f;
}