@layer properties; @layer theme, base, components, utilities; @layer theme { :root, :host { scroll-behavior: smooth; --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-red-200: oklch(88.5% 0.062 18.334); --color-yellow-200: oklch(94.5% 0.129 101.54); --color-pink-200: oklch(89.9% 0.061 343.231); --color-gray-200: oklch(92.8% 0.006 264.531); --color-black: #000; --color-white: #fff; --spacing: 0.25rem; --container-lg: 32rem; --text-xs: 0.75rem; --text-xs--line-height: calc(1 / 0.75); --text-sm: 0.875rem; --text-sm--line-height: calc(1.25 / 0.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-5xl: 3rem; --text-5xl--line-height: 1; --text-6xl: 3.75rem; --text-6xl--line-height: 1; --font-weight-thin: 100; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --font-weight-extrabold: 800; --tracking-normal: 0em; --leading-tight: 1.25; --leading-relaxed: 1.625; --radius-sm: 0.25rem; --radius-md: 0.375rem; --radius-lg: 0.5rem; --radius-xl: 0.75rem; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --radius-4xl: 2rem; --ease-out: cubic-bezier(0, 0, 0.2, 1); --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); --blur-xl: 24px; --blur-3xl: 64px; --aspect-video: 16 / 9; --default-transition-duration: 150ms; --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); } } @layer base { *, ::after, ::before, ::backdrop, ::file-selector-button { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; } html, :host { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; 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; 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 { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.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 { display: block; vertical-align: middle; } img, video { max-width: 100%; height: auto; } button, input, select, optgroup, textarea, ::file-selector-button { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; border-radius: 0; background-color: transparent; opacity: 1; } :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; } ::placeholder { opacity: 1; } @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) { ::placeholder { color: currentcolor; @supports (color: color-mix(in lab, red, red)) { 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, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-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"]), ::file-selector-button { appearance: button; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } [hidden]:where(:not([hidden="until-found"])) { display: none !important; } } @layer utilities { .pointer-events-auto { pointer-events: auto; } .pointer-events-none { pointer-events: none; } .invisible { visibility: hidden; } .visible { visibility: visible; } .absolute { position: absolute; } .fixed { position: fixed; } .relative { position: relative; } .static { position: static; } .sticky { position: sticky; } .inset-0 { inset: calc(var(--spacing) * 0); } .inset-x-0 { inset-inline: calc(var(--spacing) * 0); } .-top-3 { top: calc(var(--spacing) * -3); } .top-0 { top: calc(var(--spacing) * 0); } .top-1\/2 { top: calc(1/2 * 100%); } .top-2 { top: calc(var(--spacing) * 2); } .top-3 { top: calc(var(--spacing) * 3); } .top-4 { top: calc(var(--spacing) * 4); } .top-5 { top: calc(var(--spacing) * 5); } .top-6 { top: calc(var(--spacing) * 6); } .top-10 { top: calc(var(--spacing) * 10); } .top-14 { top: calc(var(--spacing) * 14); } .top-40 { top: calc(var(--spacing) * 40); } .top-\[30\%\] { top: 30%; } .top-\[70px\] { top: 70px; } .top-full { top: 100%; } .-right-\[30\%\] { right: calc(30% * -1); } .right-0 { right: calc(var(--spacing) * 0); } .right-2 { right: calc(var(--spacing) * 2); } .right-6 { right: calc(var(--spacing) * 6); } .right-10 { right: calc(var(--spacing) * 10); } .right-\[-5px\] { right: -5px; } .right-\[-10px\] { right: -10px; } .-bottom-5 { bottom: calc(var(--spacing) * -5); } .bottom-0 { bottom: calc(var(--spacing) * 0); } .bottom-6 { bottom: calc(var(--spacing) * 6); } .bottom-10 { bottom: calc(var(--spacing) * 10); } .bottom-28 { bottom: calc(var(--spacing) * 28); } .bottom-\[8px\] { bottom: 8px; } .-left-3 { left: calc(var(--spacing) * -3); } .left-0 { left: calc(var(--spacing) * 0); } .left-1\/2 { left: calc(1/2 * 100%); } .left-6 { left: calc(var(--spacing) * 6); } .left-10 { left: calc(var(--spacing) * 10); } .left-\[10\%\] { left: 10%; } .left-\[50\%\] { left: 50%; } .bg-gradient { z-index: 10; --tw-gradient-position: to top in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); --tw-gradient-from: var(--color-white); --tw-gradient-via: color-mix(in oklab, var(--color-white) 70%, transparent); --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); --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)); } .-z-10 { z-index: calc(10 * -1); } .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-\[9999\] { z-index: 9999; } .z-\[99999\] { z-index: 99999; } .z-\[99999999\] { z-index: 99999999; } .order-first { order: -1; } .order-first { order: -9999; } .order-last { order: 13; } .order-last { order: 9999; } .col-10 { grid-column: 10; } .col-auto { grid-column: auto; } .container { width: 100%; @media (width >=40rem) { max-width: 40rem; } @media (width >=48rem) { max-width: 48rem; } @media (width >=64rem) { max-width: 64rem; } @media (width >=80rem) { max-width: 80rem; } @media (width >=96rem) { max-width: 96rem; } } .mx-0 { margin-inline: calc(var(--spacing) * 0); } .mx-20 { margin-inline: calc(var(--spacing) * 20); } .mx-auto { margin-inline: auto; } .my-2 { margin-block: calc(var(--spacing) * 2); } .my-4 { margin-block: calc(var(--spacing) * 4); } .my-5 { margin-block: calc(var(--spacing) * 5); } .row { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(var(--bs-gutter-y) * -1); margin-right: calc(var(--bs-gutter-x) / -2); margin-left: calc(var(--bs-gutter-x) / -2); &>* { box-sizing: border-box; flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--bs-gutter-x) / 2); padding-left: calc(var(--bs-gutter-x) / 2); margin-top: var(--bs-gutter-y); } } .mt-1 { margin-top: calc(var(--spacing) * 1); } .mt-2 { margin-top: calc(var(--spacing) * 2); } .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-8 { margin-top: calc(var(--spacing) * 8); } .mt-9 { margin-top: calc(var(--spacing) * 9); } .mt-10 { margin-top: calc(var(--spacing) * 10); } .mt-14 { margin-top: calc(var(--spacing) * 14); } .mt-20 { margin-top: calc(var(--spacing) * 20); } .mt-auto { margin-top: auto; } .mb-1 { margin-bottom: calc(var(--spacing) * 1); } .mb-2 { margin-bottom: calc(var(--spacing) * 2); } .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-10 { margin-bottom: calc(var(--spacing) * 10); } .mb-15 { margin-bottom: calc(var(--spacing) * 15); } .ml-2 { margin-left: calc(var(--spacing) * 2); } .ml-auto { margin-left: auto; } .block { display: block; } .contents { display: contents; } .flex { display: flex; } .grid { display: grid; } .hidden { display: none; } .inline { display: inline; } .inline-block { display: inline-block; } .table { display: table; } .aspect-\[16\/9\] { aspect-ratio: 16/9; } .aspect-auto { aspect-ratio: auto; } .aspect-video { aspect-ratio: var(--aspect-video); } .h-2 { height: calc(var(--spacing) * 2); } .h-3 { height: calc(var(--spacing) * 3); } .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-10 { height: calc(var(--spacing) * 10); } .h-14 { height: calc(var(--spacing) * 14); } .h-24 { height: calc(var(--spacing) * 24); } .h-38 { height: calc(var(--spacing) * 38); } .h-\[20\%\] { height: 20%; } .h-\[22px\] { height: 22px; } .h-\[40\%\] { height: 40%; } .h-\[45\%\] { height: 45%; } .h-\[54px\] { height: 54px; } .h-\[70\%\] { height: 70%; } .h-\[140px\] { height: 140px; } .h-\[154px\] { height: 154px; } .h-\[158px\] { height: 158px; } .h-\[200px\] { height: 200px; } .h-\[220px\] { height: 220px; } .h-\[227px\] { height: 227px; } .h-\[280px\] { height: 280px; } .h-\[285px\] { height: 285px; } .h-\[322px\] { height: 322px; } .h-\[350px\] { height: 350px; } .h-\[353px\] { height: 353px; } .h-\[380px\] { height: 380px; } .h-\[395px\] { height: 395px; } .h-\[478px\] { height: 478px; } .h-\[532px\] { height: 532px; } .h-\[533px\] { height: 533px; } .h-\[550px\] { height: 550px; } .h-\[558px\] { height: 558px; } .h-\[618px\] { height: 618px; } .h-full { height: 100%; } .max-h-0 { max-height: calc(var(--spacing) * 0); } .min-h-16 { min-height: calc(var(--spacing) * 16); } .col-10 { flex: 0 0 auto; width: 83.33333333333334%; } .col-auto { flex: 0 0 auto; width: auto; } .row-cols-auto { &>* { flex: 0 0 auto; width: auto; } } .w-1\/2 { width: calc(1/2 * 100%); } .w-1\/3 { width: calc(1/3 * 100%); } .w-1\/5 { width: calc(1/5 * 100%); } .w-3 { width: calc(var(--spacing) * 3); } .w-4 { width: calc(var(--spacing) * 4); } .w-5 { width: calc(var(--spacing) * 5); } .w-6 { width: calc(var(--spacing) * 6); } .w-14 { width: calc(var(--spacing) * 14); } .w-64 { width: calc(var(--spacing) * 64); } .w-\[1px\] { width: 1px; } .w-\[10px\] { width: 10px; } .w-\[20\%\] { width: 20%; } .w-\[30px\] { width: 30px; } .w-\[40\%\] { width: 40%; } .w-\[44rem\] { width: 44rem; } .w-\[54px\] { width: 54px; } .w-\[75\%\] { width: 75%; } .w-\[80\%\] { width: 80%; } .w-\[90px\] { width: 90px; } .w-\[290px\] { width: 290px; } .w-\[600px\] { width: 600px; } .w-fit { width: fit-content; } .w-full { width: 100%; } .w-px { width: 1px; } .max-w-64 { max-width: calc(var(--spacing) * 64); } .max-w-\[10\%\] { max-width: 10%; } .max-w-\[96px\] { max-width: 96px; } .max-w-\[180px\] { max-width: 180px; } .max-w-\[190px\] { max-width: 190px; } .max-w-\[230px\] { max-width: 230px; } .max-w-\[250px\] { max-width: 250px; } .max-w-\[310px\] { max-width: 310px; } .max-w-\[380px\] { max-width: 380px; } .max-w-\[420px\] { max-width: 420px; } .max-w-\[445px\] { max-width: 445px; } .max-w-\[468px\] { max-width: 468px; } .max-w-\[482px\] { max-width: 482px; } .max-w-\[534px\] { max-width: 534px; } .max-w-\[560px\] { max-width: 560px; } .max-w-\[628px\] { max-width: 628px; } .max-w-\[722px\] { max-width: 722px; } .max-w-\[800px\] { max-width: 800px; } .max-w-\[893px\] { max-width: 893px; } .max-w-\[900px\] { max-width: 900px; } .max-w-\[1200px\] { max-width: 1200px; } .max-w-fit { max-width: fit-content; } .max-w-full { max-width: 100%; } .max-w-lg { max-width: var(--container-lg); } .min-w-16 { min-width: calc(var(--spacing) * 16); } .min-w-\[308px\] { min-width: 308px; } .min-w-\[355px\] { min-width: 355px; } .min-w-full { min-width: 100%; } .col { flex: 1 0 0%; } .flex-1 { flex: 1; } .flex-shrink { flex-shrink: 1; } .flex-grow { flex-grow: 1; } .grow { flex-grow: 1; } .border-separate { border-collapse: separate; } .border-spacing-0 { --tw-border-spacing-x: calc(var(--spacing) * 0); --tw-border-spacing-y: calc(var(--spacing) * 0); border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y); } .origin-center { transform-origin: center; } .-translate-x-1\/2 { --tw-translate-x: calc(calc(1/2 * 100%) * -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-0 { --tw-translate-y: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-4 { --tw-translate-y: calc(var(--spacing) * 4); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-16 { --tw-translate-y: calc(var(--spacing) * 16); translate: var(--tw-translate-x) var(--tw-translate-y); } .-rotate-4 { rotate: calc(4deg * -1); } .-rotate-6 { rotate: calc(6deg * -1); } .-rotate-90 { rotate: calc(90deg * -1); } .-rotate-180 { rotate: calc(180deg * -1); } .-rotate-\[6deg\] { rotate: calc(6deg * -1); } .rotate-0 { rotate: 0deg; } .rotate-4 { rotate: 4deg; } .rotate-6 { rotate: 6deg; } .rotate-45 { rotate: 45deg; } .rotate-180 { rotate: 180deg; } .rotate-\[6deg\] { rotate: 6deg; } .rotate-\[140deg\] { rotate: 140deg; } .-skew-x-12 { --tw-skew-x: skewX(calc(12deg * -1)); transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, ); } .skew-x-12 { --tw-skew-x: skewX(12deg); transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, ); } .transform { transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, ); } .cursor-pointer { cursor: pointer; } .resize { resize: both; } .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .flex-col { flex-direction: column; } .flex-col-reverse { flex-direction: column-reverse; } .flex-wrap { flex-wrap: wrap; } .items-center { align-items: center; } .items-end { align-items: flex-end; } .items-start { align-items: flex-start; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .justify-end { justify-content: flex-end; } .gap-0 { gap: calc(var(--spacing) * 0); } .gap-1 { gap: calc(var(--spacing) * 1); } .gap-2 { gap: calc(var(--spacing) * 2); } .gap-3 { gap: calc(var(--spacing) * 3); } .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-9 { gap: calc(var(--spacing) * 9); } .gap-10 { gap: calc(var(--spacing) * 10); } .gap-11 { gap: calc(var(--spacing) * 11); } .gap-12 { gap: calc(var(--spacing) * 12); } .gap-15 { gap: calc(var(--spacing) * 15); } .gap-16 { gap: calc(var(--spacing) * 16); } .gap-17 { gap: calc(var(--spacing) * 17); } .gap-20 { gap: calc(var(--spacing) * 20); } .gap-\[5px\] { gap: 5px; } .gap-\[10px\] { gap: 10px; } .gap-\[30px\] { gap: 30px; } .space-y-2 { :where(& > :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))); } } .space-y-3 { :where(& > :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))); } } .space-y-4 { :where(& > :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))); } } .space-y-12 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 12) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 12) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-15 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 15) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 15) * calc(1 - var(--tw-space-y-reverse))); } } .gap-x-7 { column-gap: calc(var(--spacing) * 7); } .space-x-1 { :where(& > :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))); } } .gap-y-8 { row-gap: calc(var(--spacing) * 8); } .overflow-hidden { overflow: hidden; } .overflow-x-auto { overflow-x: auto; } .rounded-2xl { border-radius: var(--radius-2xl); } .rounded-3xl { border-radius: var(--radius-3xl); } .rounded-4xl { border-radius: var(--radius-4xl); } .rounded-\[40px\] { border-radius: 40px; } .rounded-full { border-radius: calc(infinity * 1px); } .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-3xl { border-top-left-radius: var(--radius-3xl); border-top-right-radius: var(--radius-3xl); } .rounded-b-3xl { border-bottom-right-radius: var(--radius-3xl); border-bottom-left-radius: var(--radius-3xl); } .border { border-style: var(--tw-border-style); border-width: 1px; } .border-0 { border-style: var(--tw-border-style); border-width: 0px; } .border-4 { border-style: var(--tw-border-style); border-width: 4px; } .border-\[3px\] { border-style: var(--tw-border-style); border-width: 3px; } .border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; } .border-b { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } .border-b-1 { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } .border-l { border-left-style: var(--tw-border-style); border-left-width: 1px; } .border-dashed { --tw-border-style: dashed; border-style: dashed; } .border-none { --tw-border-style: none; border-style: none; } .border-border { border-color: var(--color-border); } .border-white\/5 { border-color: color-mix(in srgb, #fff 5%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-white) 5%, transparent); } } .bg-body { background-color: var(--color-body); } .bg-dark { background-color: var(--color-dark); } .bg-default { background-color: var(--color-default); } .bg-gray-200 { background-color: var(--color-gray-200); } .bg-primary { background-color: var(--color-primary); } .bg-quinary { background-color: var(--color-quinary); } .bg-secondary { background-color: var(--color-secondary); } .bg-tertiary { background-color: var(--color-tertiary); } .bg-text-light { background-color: var(--color-text-light); } .bg-transparent { background-color: transparent; } .bg-white { background-color: var(--color-white); } .bg-white\/40 { background-color: color-mix(in srgb, #fff 40%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 40%, transparent); } } .bg-gradient-to-t { --tw-gradient-position: to top in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); } .from-\[rgb\(41\,48\,57\)\]\/90 { --tw-gradient-from: color-mix(in oklab, rgb(41, 48, 57) 90%, 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-black\/70 { --tw-gradient-from: color-mix(in srgb, #000 70%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-from: color-mix(in oklab, var(--color-black) 70%, 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-black\/90 { --tw-gradient-from: color-mix(in srgb, #000 90%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-from: color-mix(in oklab, var(--color-black) 90%, 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 { --tw-gradient-from: var(--color-white); --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-black\/60 { --tw-gradient-via: color-mix(in srgb, #000 60%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-via: color-mix(in oklab, var(--color-black) 60%, transparent); } --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\/70 { --tw-gradient-via: color-mix(in srgb, #fff 70%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-via: color-mix(in oklab, var(--color-white) 70%, transparent); } --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-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)); } .bg-cover { background-size: cover; } .bg-center { background-position: center; } .object-contain { object-fit: contain; } .object-cover { object-fit: cover; } .object-center { object-position: center; } .p-0 { padding: calc(var(--spacing) * 0); } .p-2 { padding: calc(var(--spacing) * 2); } .p-3 { padding: calc(var(--spacing) * 3); } .p-4 { padding: calc(var(--spacing) * 4); } .p-5 { padding: calc(var(--spacing) * 5); } .p-6 { padding: calc(var(--spacing) * 6); } .p-8 { padding: calc(var(--spacing) * 8); } .p-10 { padding: calc(var(--spacing) * 10); } .px-1 { padding-inline: calc(var(--spacing) * 1); } .px-3 { padding-inline: calc(var(--spacing) * 3); } .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-\[5px\] { padding-inline: 5px; } .py-1 { padding-block: calc(var(--spacing) * 1); } .py-2 { padding-block: calc(var(--spacing) * 2); } .py-3 { padding-block: calc(var(--spacing) * 3); } .py-5 { padding-block: calc(var(--spacing) * 5); } .py-8 { padding-block: calc(var(--spacing) * 8); } .py-10 { padding-block: calc(var(--spacing) * 10); } .py-14 { padding-block: calc(var(--spacing) * 14); } .py-\[2\.5px\] { padding-block: 2.5px; } .py-\[2px\] { padding-block: 2px; } .pt-6 { padding-top: calc(var(--spacing) * 6); } .pt-10 { padding-top: calc(var(--spacing) * 10); } .pt-14 { padding-top: calc(var(--spacing) * 14); } .pt-25 { padding-top: calc(var(--spacing) * 25); } .pt-\[0px\] { padding-top: 0px; } .pt-\[7px\] { padding-top: 7px; } .pt-\[50px\] { padding-top: 50px; } .pr-\[21px\] { padding-right: 21px; } .pb-0 { padding-bottom: calc(var(--spacing) * 0); } .pb-4 { padding-bottom: calc(var(--spacing) * 4); } .pb-14 { padding-bottom: calc(var(--spacing) * 14); } .pb-15 { padding-bottom: calc(var(--spacing) * 15); } .pb-\[7px\] { padding-bottom: 7px; } .pb-\[16px\] { padding-bottom: 16px; } .pb-\[100px\] { padding-bottom: 100px; } .pl-\[19px\] { padding-left: 19px; } .text-center { text-align: center; } .text-left { text-align: left; } .text-2xl { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--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-\[10px\] { font-size: 10px; } .text-\[12px\] { font-size: 12px; } .text-\[18px\] { font-size: 18px; } .text-\[28px\] { font-size: 28px; } .text-\[32px\] { font-size: 32px; } .text-base { font-size: var(--text-base); } .text-h3 { font-size: var(--text-h3); } .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-9 { --tw-leading: calc(var(--spacing) * 9); line-height: calc(var(--spacing) * 9); } .leading-14 { --tw-leading: calc(var(--spacing) * 14); line-height: calc(var(--spacing) * 14); } .leading-\[14px\] { --tw-leading: 14px; line-height: 14px; } .leading-\[34px\] { --tw-leading: 34px; line-height: 34px; } .font-bold { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } .font-extrabold { --tw-font-weight: var(--font-weight-extrabold); font-weight: var(--font-weight-extrabold); } .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-\[-1px\] { --tw-tracking: -1px; letter-spacing: -1px; } .tracking-\[-2px\] { --tw-tracking: -2px; letter-spacing: -2px; } .tracking-normal { --tw-tracking: var(--tracking-normal); letter-spacing: var(--tracking-normal); } .text-balance { text-wrap: balance; } .text-black { color: var(--color-black); } .text-dark { color: var(--color-dark); } .text-default { color: var(--color-default); } .text-primary { color: var(--color-primary); } .text-quinary { color: var(--color-quinary); } .text-text-dark { color: var(--color-text-dark); } .text-text-light { color: var(--color-text-light); } .uppercase { text-transform: uppercase; } .italic { font-style: italic; } .opacity-0 { opacity: 0%; } .opacity-5 { opacity: 5%; } .opacity-20 { opacity: 20%; } .opacity-40 { opacity: 40%; } .opacity-50 { opacity: 50%; } .opacity-60 { opacity: 60%; } .opacity-70 { opacity: 70%; } .opacity-80 { opacity: 80%; } .opacity-90 { opacity: 90%; } .opacity-100 { opacity: 100%; } .opacity-\[0\.6\] { opacity: 0.6; } .shadow { --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); 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, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); 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, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .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-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, ); } .grayscale { --tw-grayscale: grayscale(100%); 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, ); } .invert { --tw-invert: invert(100%); 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, ); } .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-\[max-height\,opacity\] { transition-property: max-height, opacity; 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-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-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-300 { --tw-duration: 300ms; transition-duration: 300ms; } .duration-500 { --tw-duration: 500ms; transition-duration: 500ms; } .duration-700 { --tw-duration: 700ms; transition-duration: 700ms; } .duration-900 { --tw-duration: 900ms; transition-duration: 900ms; } .duration-\[600ms\,400ms\] { --tw-duration: 600ms, 400ms; transition-duration: 600ms, 400ms; } .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); } .outline-none { --tw-outline-style: none; outline-style: none; } .select-none { -webkit-user-select: none; user-select: none; } .\[clip-path\:polygon\(100\%_0\,_0_100\%\,_100\%_100\%\)\] { clip-path: polygon(100% 0, 0 100%, 100% 100%); } .backface-hidden { backface-visibility: hidden; } .group-hover\:visible { &:is(:where(.group):hover *) { @media (hover: hover) { visibility: visible; } } } .group-hover\:block { &:is(:where(.group):hover *) { @media (hover: hover) { display: block; } } } .group-hover\:translate-x-0 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-translate-x: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } } } .group-hover\:-translate-y-16 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-translate-y: calc(var(--spacing) * -16); translate: var(--tw-translate-x) var(--tw-translate-y); } } } .group-hover\:translate-y-0 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-translate-y: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } } } .group-hover\:rotate-180 { &:is(:where(.group):hover *) { @media (hover: hover) { rotate: 180deg; } } } .group-hover\:opacity-0 { &:is(:where(.group):hover *) { @media (hover: hover) { opacity: 0%; } } } .group-hover\:opacity-100 { &:is(:where(.group):hover *) { @media (hover: hover) { opacity: 100%; } } } .group-\[\.active\]\:translate-x-0 { &:is(:where(.group):is(.active) *) { --tw-translate-x: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } } .group-\[\.active\]\:opacity-100 { &:is(:where(.group):is(.active) *) { opacity: 100%; } } .group-\[\.open\]\:max-h-\[500px\] { &:is(:where(.group):is(.open) *) { max-height: 500px; } } .group-\[\.open\]\:rotate-0 { &:is(:where(.group):is(.open) *) { rotate: 0deg; } } .group-\[\.open\]\:rounded-3xl { &:is(:where(.group):is(.open) *) { border-radius: var(--radius-3xl); } } .group-\[\.open\]\:bg-text-light { &:is(:where(.group):is(.open) *) { background-color: var(--color-text-light); } } .group-\[\.open\]\:text-text-dark { &:is(:where(.group):is(.open) *) { color: var(--color-text-dark); } } .after\:absolute { &::after { content: var(--tw-content); position: absolute; } } .after\:inset-0 { &::after { content: var(--tw-content); inset: calc(var(--spacing) * 0); } } .hover\:h-\[400px\] { &:hover { @media (hover: hover) { height: 400px; } } } .hover\:text-primary { &:hover { @media (hover: hover) { color: var(--color-primary); } } } .hover\:underline { &:hover { @media (hover: hover) { text-decoration-line: underline; } } } .hover\:opacity-80 { &:hover { @media (hover: hover) { opacity: 80%; } } } .focus\:border-b-1 { &:focus { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } } .focus\:border-tertiary { &:focus { border-color: var(--color-tertiary); } } .focus\:ring-0 { &:focus { --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + 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\:outline-none { &:focus { --tw-outline-style: none; outline-style: none; } } .max-xl\:flex-col { @media (width < 80rem) { flex-direction: column; } } .max-xl\:justify-center { @media (width < 80rem) { justify-content: center; } } .max-lg\:mx-auto { @media (width < 64rem) { margin-inline: auto; } } .max-md\:mx-auto { @media (width < 48rem) { margin-inline: auto; } } .max-md\:flex-wrap { @media (width < 48rem) { flex-wrap: wrap; } } .sm\:block { @media (width >=40rem) { display: block; } } .sm\:hidden { @media (width >=40rem) { display: none; } } .sm\:grid-cols-2 { @media (width >=40rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .sm\:bg-red-200 { @media (width >=40rem) { background-color: var(--color-red-200); } } .sm\:px-5 { @media (width >=40rem) { padding-inline: calc(var(--spacing) * 5); } } .sm\:py-8 { @media (width >=40rem) { padding-block: calc(var(--spacing) * 8); } } .md\:top-auto { @media (width >=48rem) { top: auto; } } .md\:right-8 { @media (width >=48rem) { right: calc(var(--spacing) * 8); } } .md\:bottom-0 { @media (width >=48rem) { bottom: calc(var(--spacing) * 0); } } .md\:bottom-8 { @media (width >=48rem) { bottom: calc(var(--spacing) * 8); } } .md\:left-20 { @media (width >=48rem) { left: calc(var(--spacing) * 20); } } .md\:left-auto { @media (width >=48rem) { left: auto; } } .md\:mx-0 { @media (width >=48rem) { margin-inline: calc(var(--spacing) * 0); } } .md\:my-10 { @media (width >=48rem) { margin-block: calc(var(--spacing) * 10); } } .md\:mt-10 { @media (width >=48rem) { margin-top: calc(var(--spacing) * 10); } } .md\:mt-12 { @media (width >=48rem) { margin-top: calc(var(--spacing) * 12); } } .md\:mt-20 { @media (width >=48rem) { margin-top: calc(var(--spacing) * 20); } } .md\:mb-6 { @media (width >=48rem) { margin-bottom: calc(var(--spacing) * 6); } } .md\:mb-10 { @media (width >=48rem) { margin-bottom: calc(var(--spacing) * 10); } } .md\:mb-15 { @media (width >=48rem) { margin-bottom: calc(var(--spacing) * 15); } } .md\:block { @media (width >=48rem) { display: block; } } .md\:flex { @media (width >=48rem) { display: flex; } } .md\:hidden { @media (width >=48rem) { display: none; } } .md\:h-32 { @media (width >=48rem) { height: calc(var(--spacing) * 32); } } .md\:h-\[82px\] { @media (width >=48rem) { height: 82px; } } .md\:h-\[178px\] { @media (width >=48rem) { height: 178px; } } .md\:h-\[323px\] { @media (width >=48rem) { height: 323px; } } .md\:h-\[350px\] { @media (width >=48rem) { height: 350px; } } .md\:h-\[500px\] { @media (width >=48rem) { height: 500px; } } .md\:h-\[550px\] { @media (width >=48rem) { height: 550px; } } .md\:h-\[620px\] { @media (width >=48rem) { height: 620px; } } .md\:h-auto { @media (width >=48rem) { height: auto; } } .md\:w-\[110px\] { @media (width >=48rem) { width: 110px; } } .md\:w-\[328px\] { @media (width >=48rem) { width: 328px; } } .md\:w-\[468px\] { @media (width >=48rem) { width: 468px; } } .md\:max-w-\[520px\] { @media (width >=48rem) { max-width: 520px; } } .md\:max-w-full { @media (width >=48rem) { max-width: 100%; } } .md\:flex-\[0_0_353\.4px\] { @media (width >=48rem) { flex: 0 0 353.4px; } } .md\:flex-\[0_0_353\.58px\] { @media (width >=48rem) { flex: 0 0 353.58px; } } .md\:flex-\[0_0_359\.4px\] { @media (width >=48rem) { flex: 0 0 359.4px; } } .md\:flex-\[0_0_400px\] { @media (width >=48rem) { flex: 0 0 400px; } } .md\:flex-\[1_1_285px\] { @media (width >=48rem) { flex: 1 1 285px; } } .md\:translate-x-0 { @media (width >=48rem) { --tw-translate-x: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } } .md\:translate-x-36 { @media (width >=48rem) { --tw-translate-x: calc(var(--spacing) * 36); translate: var(--tw-translate-x) var(--tw-translate-y); } } .md\:grid-cols-2 { @media (width >=48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .md\:flex-row { @media (width >=48rem) { flex-direction: row; } } .md\:flex-wrap { @media (width >=48rem) { flex-wrap: wrap; } } .md\:items-start { @media (width >=48rem) { align-items: flex-start; } } .md\:justify-start { @media (width >=48rem) { justify-content: flex-start; } } .md\:gap-0 { @media (width >=48rem) { gap: calc(var(--spacing) * 0); } } .md\:gap-6 { @media (width >=48rem) { gap: calc(var(--spacing) * 6); } } .md\:gap-10 { @media (width >=48rem) { gap: calc(var(--spacing) * 10); } } .md\:gap-20 { @media (width >=48rem) { gap: calc(var(--spacing) * 20); } } .md\:gap-34 { @media (width >=48rem) { gap: calc(var(--spacing) * 34); } } .md\:gap-x-4 { @media (width >=48rem) { column-gap: calc(var(--spacing) * 4); } } .md\:rounded-\[40px\] { @media (width >=48rem) { border-radius: 40px; } } .md\:bg-yellow-200 { @media (width >=48rem) { background-color: var(--color-yellow-200); } } .md\:p-6 { @media (width >=48rem) { padding: calc(var(--spacing) * 6); } } .md\:p-12 { @media (width >=48rem) { padding: calc(var(--spacing) * 12); } } .md\:p-20 { @media (width >=48rem) { padding: calc(var(--spacing) * 20); } } .md\:px-6 { @media (width >=48rem) { padding-inline: calc(var(--spacing) * 6); } } .md\:px-10 { @media (width >=48rem) { padding-inline: calc(var(--spacing) * 10); } } .md\:py-5 { @media (width >=48rem) { padding-block: calc(var(--spacing) * 5); } } .md\:py-15 { @media (width >=48rem) { padding-block: calc(var(--spacing) * 15); } } .md\:pt-35 { @media (width >=48rem) { padding-top: calc(var(--spacing) * 35); } } .md\:text-left { @media (width >=48rem) { text-align: left; } } .md\:text-6xl { @media (width >=48rem) { font-size: var(--text-6xl); line-height: var(--tw-leading, var(--text-6xl--line-height)); } } .md\:opacity-0 { @media (width >=48rem) { opacity: 0%; } } .md\:hover\:h-\[400px\] { @media (width >=48rem) { &:hover { @media (hover: hover) { height: 400px; } } } } .lg\:col-7 { @media (width >=64rem) { grid-column: 7; } } .lg\:col-8 { @media (width >=64rem) { grid-column: 8; } } .lg\:mx-0 { @media (width >=64rem) { margin-inline: calc(var(--spacing) * 0); } } .lg\:mr-auto { @media (width >=64rem) { margin-right: auto; } } .lg\:mb-10 { @media (width >=64rem) { margin-bottom: calc(var(--spacing) * 10); } } .lg\:mb-12 { @media (width >=64rem) { margin-bottom: calc(var(--spacing) * 12); } } .lg\:mb-20 { @media (width >=64rem) { margin-bottom: calc(var(--spacing) * 20); } } .lg\:mb-25 { @media (width >=64rem) { margin-bottom: calc(var(--spacing) * 25); } } .lg\:mb-28 { @media (width >=64rem) { margin-bottom: calc(var(--spacing) * 28); } } .lg\:block { @media (width >=64rem) { display: block; } } .lg\:flex { @media (width >=64rem) { display: flex; } } .lg\:hidden { @media (width >=64rem) { display: none; } } .lg\:h-\[250px\] { @media (width >=64rem) { height: 250px; } } .lg\:h-\[467px\] { @media (width >=64rem) { height: 467px; } } .lg\:h-\[650px\] { @media (width >=64rem) { height: 650px; } } .lg\:col-7 { @media (width >=64rem) { flex: 0 0 auto; width: 58.333333333333336%; } } .lg\:col-8 { @media (width >=64rem) { flex: 0 0 auto; width: 66.66666666666667%; } } .lg\:w-\[25\%\] { @media (width >=64rem) { width: 25%; } } .lg\:w-\[142px\] { @media (width >=64rem) { width: 142px; } } .lg\:max-w-\[45\%\] { @media (width >=64rem) { max-width: 45%; } } .lg\:max-w-\[55\%\] { @media (width >=64rem) { max-width: 55%; } } .lg\:max-w-\[150px\] { @media (width >=64rem) { max-width: 150px; } } .lg\:max-w-\[180px\] { @media (width >=64rem) { max-width: 180px; } } .lg\:max-w-\[218px\] { @media (width >=64rem) { max-width: 218px; } } .lg\:max-w-\[320px\] { @media (width >=64rem) { max-width: 320px; } } .lg\:max-w-\[541px\] { @media (width >=64rem) { max-width: 541px; } } .lg\:max-w-\[1050px\] { @media (width >=64rem) { max-width: 1050px; } } .lg\:max-w-\[1140px\] { @media (width >=64rem) { max-width: 1140px; } } .lg\:min-w-\[150px\] { @media (width >=64rem) { min-width: 150px; } } .lg\:min-w-\[320px\] { @media (width >=64rem) { min-width: 320px; } } .lg\:grid-cols-3 { @media (width >=64rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } .lg\:grid-cols-4 { @media (width >=64rem) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .lg\:flex-col { @media (width >=64rem) { flex-direction: column; } } .lg\:flex-row { @media (width >=64rem) { flex-direction: row; } } .lg\:flex-nowrap { @media (width >=64rem) { flex-wrap: nowrap; } } .lg\:gap-0 { @media (width >=64rem) { gap: calc(var(--spacing) * 0); } } .lg\:gap-1 { @media (width >=64rem) { gap: calc(var(--spacing) * 1); } } .lg\:gap-8 { @media (width >=64rem) { gap: calc(var(--spacing) * 8); } } .lg\:gap-16 { @media (width >=64rem) { gap: calc(var(--spacing) * 16); } } .lg\:rounded-4xl { @media (width >=64rem) { border-radius: var(--radius-4xl); } } .lg\:text-end { @media (width >=64rem) { text-align: end; } } .lg\:text-left { @media (width >=64rem) { text-align: left; } } .lg\:text-\[7\.25rem\] { @media (width >=64rem) { font-size: 7.25rem; } } .lg\:text-h1 { @media (width >=64rem) { font-size: var(--text-h1); } } .lg\:leading-\[7\.25rem\] { @media (width >=64rem) { --tw-leading: 7.25rem; line-height: 7.25rem; } } .lg\:hover\:h-\[650px\] { @media (width >=64rem) { &:hover { @media (hover: hover) { height: 650px; } } } } .xl\:mx-0 { @media (width >=80rem) { margin-inline: calc(var(--spacing) * 0); } } .xl\:mt-20 { @media (width >=80rem) { margin-top: calc(var(--spacing) * 20); } } .xl\:mb-10 { @media (width >=80rem) { margin-bottom: calc(var(--spacing) * 10); } } .xl\:block { @media (width >=80rem) { display: block; } } .xl\:hidden { @media (width >=80rem) { display: none; } } .xl\:w-\[600px\] { @media (width >=80rem) { width: 600px; } } .xl\:max-w-\[302px\] { @media (width >=80rem) { max-width: 302px; } } .xl\:max-w-\[495px\] { @media (width >=80rem) { max-width: 495px; } } .xl\:max-w-\[560px\] { @media (width >=80rem) { max-width: 560px; } } .xl\:max-w-\[594px\] { @media (width >=80rem) { max-width: 594px; } } .xl\:max-w-\[612px\] { @media (width >=80rem) { max-width: 612px; } } .xl\:grid-cols-4 { @media (width >=80rem) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .xl\:flex-col { @media (width >=80rem) { flex-direction: column; } } .xl\:flex-row { @media (width >=80rem) { flex-direction: row; } } .xl\:gap-0 { @media (width >=80rem) { gap: calc(var(--spacing) * 0); } } .xl\:gap-15 { @media (width >=80rem) { gap: calc(var(--spacing) * 15); } } .xl\:gap-20 { @media (width >=80rem) { gap: calc(var(--spacing) * 20); } } .xl\:border-transparent { @media (width >=80rem) { border-color: transparent; } } .xl\:text-left { @media (width >=80rem) { text-align: left; } } .xl\:grayscale { @media (width >=80rem) { --tw-grayscale: grayscale(100%); 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, ); } } .xl\:group-hover\:border-white { @media (width >=80rem) { &:is(:where(.group):hover *) { @media (hover: hover) { border-color: var(--color-white); } } } } .xl\:group-hover\:grayscale-0 { @media (width >=80rem) { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-grayscale: grayscale(0%); 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, ); } } } } .\32 xl\:block { @media (width >=96rem) { display: block; } } .\32 xl\:hidden { @media (width >=96rem) { display: none; } } .\32 xl\:bg-pink-200 { @media (width >=96rem) { background-color: var(--color-pink-200); } } .\[\&\>a\]\:underline { &>a { text-decoration-line: underline; } } } .blog-carousel-pagination .swiper-pagination-bullet { margin-inline: calc(var(--spacing) * 1); height: calc(var(--spacing) * 2); width: calc(var(--spacing) * 2); border-radius: calc(infinity * 1px); background-color: var(--color-default); } .blog-carousel-pagination .swiper-pagination-bullet-active { background-color: var(--color-text-light); } .swiper-pagination-bullet { margin-inline: calc(var(--spacing) * 1); height: calc(var(--spacing) * 2); width: calc(var(--spacing) * 2); border-radius: calc(infinity * 1px); background-color: var(--color-default); } .swiper-pagination-bullet-active { background-color: var(--color-text-light); } @layer base { html { font-size: var(--text-base-sm); @media (width >=48rem) { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); } @media (width >=48rem) { font-size: var(--text-base); } } body { overflow-x: hidden; background-color: var(--color-body); font-family: var(--font-primary); line-height: var(--tw-leading, var(--text-base--line-height)); font-size: var(--text-base); --tw-leading: var(--leading-relaxed); line-height: var(--leading-relaxed); --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); color: var(--color-default); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-primary); --tw-leading: var(--leading-tight); line-height: var(--leading-tight); --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); color: var(--color-text-light); } h1, .h1 { font-size: var(--text-h1-sm); @media (width >=48rem) { font-size: var(--text-h1); } } h2, .h2 { font-size: var(--text-h2-sm); @media (width >=48rem) { font-size: var(--text-h2); } } h3, .h3 { font-size: var(--text-h3-sm); @media (width >=48rem) { font-size: var(--text-h3); } } h4, .h4 { font-size: var(--text-h4); } h5, .h5 { font-size: var(--text-h5); } h6, .h6 { font-size: var(--text-h6); } b, strong { --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } code { &::after { content: var(--tw-content); --tw-border-style: none; border-style: none; } } blockquote>p { margin-block: calc(var(--spacing) * 0) !important; } button { cursor: pointer; } p { text-wrap: balance; } } @layer components { .section { padding-top: calc(var(--spacing) * 15); padding-bottom: calc(var(--spacing) * 10); @media (width >=64rem) { padding-top: calc(var(--spacing) * 25); } @media (width >=64rem) { padding-bottom: calc(var(--spacing) * 15); } } .container { margin-inline: auto; padding-inline: calc(var(--spacing) * 4); @media (width >=80rem) { max-width: 1320px !important; } } .glow-layer { pointer-events: none; position: absolute; z-index: calc(10 * -1); height: 12.5rem; width: 37.5rem; --tw-translate-x: calc(calc(1/2 * 100%) * -1); --tw-translate-y: calc(calc(1/2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); rotate: 20deg; border-radius: calc(infinity * 1px); background-color: color-mix(in oklab, var(--color-white) 8%, transparent); --tw-blur: blur(var(--blur-3xl)); 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, ); } .social-icons { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } .social-icons li { display: inline-block; } .social-icons li a { display: flex; height: calc(var(--spacing) * 8); width: calc(var(--spacing) * 8); align-items: center; justify-content: center; text-align: center; font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); --tw-leading: calc(var(--spacing) * 9); line-height: calc(var(--spacing) * 9); color: var(--color-white); } .social-icons li a svg { height: calc(var(--spacing) * 8); width: calc(var(--spacing) * 8); } .content { color: var(--tw-prose-body); max-width: 65ch; :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 1.25em; margin-bottom: 1.25em; } :where([class~="lead"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-lead); font-size: 1.25em; line-height: 1.6; margin-top: 1.2em; margin-bottom: 1.2em; } :where(a):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-links); text-decoration: underline; font-weight: 500; } :where(strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-bold); font-weight: 600; } :where(a strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(blockquote strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(thead th strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: decimal; margin-top: 1.25em; margin-bottom: 1.25em; padding-inline-start: 1.625em; } :where(ol[type="A"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: upper-alpha; } :where(ol[type="a"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: lower-alpha; } :where(ol[type="A" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: upper-alpha; } :where(ol[type="a" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: lower-alpha; } :where(ol[type="I"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: upper-roman; } :where(ol[type="i"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: lower-roman; } :where(ol[type="I" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: upper-roman; } :where(ol[type="i" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: lower-roman; } :where(ol[type="1"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: decimal; } :where(ul):not(:where([class~="not-prose"], [class~="not-prose"] *)) { list-style-type: disc; margin-top: 1.25em; margin-bottom: 1.25em; padding-inline-start: 1.625em; } :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *))::marker { font-weight: 400; color: var(--tw-prose-counters); } :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *))::marker { color: var(--tw-prose-bullets); } :where(dt):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; margin-top: 1.25em; } :where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { border-color: var(--tw-prose-hr); border-top-width: 1px; margin-top: 3em; margin-bottom: 3em; } :where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *)) { font-weight: 500; font-style: italic; color: var(--tw-prose-quotes); border-inline-start-width: 0.25rem; border-inline-start-color: var(--tw-prose-quote-borders); quotes: "\201C" "\201D" "\2018" "\2019"; margin-top: 1.6em; margin-bottom: 1.6em; padding-inline-start: 1em; } :where(blockquote p:first-of-type):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { content: open-quote; } :where(blockquote p:last-of-type):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { content: close-quote; } :where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 800; font-size: 2.25em; margin-top: 0; margin-bottom: 0.8888889em; line-height: 1.1111111; } :where(h1 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { font-weight: 900; color: inherit; } :where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 700; font-size: 1.5em; margin-top: 2em; margin-bottom: 1em; line-height: 1.3333333; } :where(h2 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { font-weight: 800; color: inherit; } :where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; font-size: 1.25em; margin-top: 1.6em; margin-bottom: 0.6em; line-height: 1.6; } :where(h3 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { font-weight: 700; color: inherit; } :where(h4):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; margin-top: 1.5em; margin-bottom: 0.5em; line-height: 1.5; } :where(h4 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { font-weight: 700; color: inherit; } :where(img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(picture):not(:where([class~="not-prose"], [class~="not-prose"] *)) { display: block; margin-top: 2em; margin-bottom: 2em; } :where(video):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(kbd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { font-weight: 500; font-family: inherit; color: var(--tw-prose-kbd); box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows); font-size: 0.875em; border-radius: 0.3125rem; padding-top: 0.1875em; padding-inline-end: 0.375em; padding-bottom: 0.1875em; padding-inline-start: 0.375em; } :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-code); font-weight: 600; font-size: 0.875em; } :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { content: "`"; } :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { content: "`"; } :where(a code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(h1 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(h2 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; font-size: 0.875em; } :where(h3 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; font-size: 0.9em; } :where(h4 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(blockquote code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(thead th code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: inherit; } :where(pre):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-pre-code); background-color: var(--tw-prose-pre-bg); overflow-x: auto; font-weight: 400; font-size: 0.875em; line-height: 1.7142857; margin-top: 1.7142857em; margin-bottom: 1.7142857em; border-radius: 0.375rem; padding-top: 0.8571429em; padding-inline-end: 1.1428571em; padding-bottom: 0.8571429em; padding-inline-start: 1.1428571em; } :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { background-color: transparent; border-width: 0; border-radius: 0; padding: 0; font-weight: inherit; color: inherit; font-size: inherit; font-family: inherit; line-height: inherit; } :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { content: none; } :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { content: none; } :where(table):not(:where([class~="not-prose"], [class~="not-prose"] *)) { width: 100%; table-layout: auto; margin-top: 2em; margin-bottom: 2em; font-size: 0.875em; line-height: 1.7142857; } :where(thead):not(:where([class~="not-prose"], [class~="not-prose"] *)) { border-bottom-width: 1px; border-bottom-color: var(--tw-prose-th-borders); } :where(thead th):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; vertical-align: bottom; padding-inline-end: 0.5714286em; padding-bottom: 0.5714286em; padding-inline-start: 0.5714286em; } :where(tbody tr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { border-bottom-width: 1px; border-bottom-color: var(--tw-prose-td-borders); } :where(tbody tr:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { border-bottom-width: 0; } :where(tbody td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { vertical-align: baseline; } :where(tfoot):not(:where([class~="not-prose"], [class~="not-prose"] *)) { border-top-width: 1px; border-top-color: var(--tw-prose-th-borders); } :where(tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { vertical-align: top; } :where(th, td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { text-align: start; } :where(figure > *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(figcaption):not(:where([class~="not-prose"], [class~="not-prose"] *)) { color: var(--tw-prose-captions); font-size: 0.875em; line-height: 1.4285714; margin-top: 0.8571429em; } --tw-prose-body: oklch(37.3% 0.034 259.733); --tw-prose-headings: oklch(21% 0.034 264.665); --tw-prose-lead: oklch(44.6% 0.03 256.802); --tw-prose-links: oklch(21% 0.034 264.665); --tw-prose-bold: oklch(21% 0.034 264.665); --tw-prose-counters: oklch(55.1% 0.027 264.364); --tw-prose-bullets: oklch(87.2% 0.01 258.338); --tw-prose-hr: oklch(92.8% 0.006 264.531); --tw-prose-quotes: oklch(21% 0.034 264.665); --tw-prose-quote-borders: oklch(92.8% 0.006 264.531); --tw-prose-captions: oklch(55.1% 0.027 264.364); --tw-prose-kbd: oklch(21% 0.034 264.665); --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent); --tw-prose-code: oklch(21% 0.034 264.665); --tw-prose-pre-code: oklch(92.8% 0.006 264.531); --tw-prose-pre-bg: oklch(27.8% 0.033 256.848); --tw-prose-th-borders: oklch(87.2% 0.01 258.338); --tw-prose-td-borders: oklch(92.8% 0.006 264.531); --tw-prose-invert-body: oklch(87.2% 0.01 258.338); --tw-prose-invert-headings: #fff; --tw-prose-invert-lead: oklch(70.7% 0.022 261.325); --tw-prose-invert-links: #fff; --tw-prose-invert-bold: #fff; --tw-prose-invert-counters: oklch(70.7% 0.022 261.325); --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802); --tw-prose-invert-hr: oklch(37.3% 0.034 259.733); --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542); --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733); --tw-prose-invert-captions: oklch(70.7% 0.022 261.325); --tw-prose-invert-kbd: #fff; --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%); --tw-prose-invert-code: #fff; --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338); --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%); --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802); --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733); font-size: 1rem; line-height: 1.75; :where(picture > img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0.5em; margin-bottom: 0.5em; } :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { padding-inline-start: 0.375em; } :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { padding-inline-start: 0.375em; } :where(.prose > ul > li p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0.75em; margin-bottom: 0.75em; } :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 1.25em; } :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-bottom: 1.25em; } :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 1.25em; } :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-bottom: 1.25em; } :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0.75em; margin-bottom: 0.75em; } :where(dl):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 1.25em; margin-bottom: 1.25em; } :where(dd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0.5em; padding-inline-start: 1.625em; } :where(hr + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0; } :where(h2 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0; } :where(h3 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0; } :where(h4 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0; } :where(thead th:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { padding-inline-start: 0; } :where(thead th:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { padding-inline-end: 0; } :where(tbody td, tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { padding-top: 0.5714286em; padding-inline-end: 0.5714286em; padding-bottom: 0.5714286em; padding-inline-start: 0.5714286em; } :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { padding-inline-start: 0; } :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { padding-inline-end: 0; } :where(figure):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(.prose > :first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-top: 0; } :where(.prose > :last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { margin-bottom: 0; } max-width: none; & :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { margin-top: .6em; } & :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { margin-bottom: .3em; } & :is(:where(h1, h2, h3, h4, h5, h6, th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { color: var(--color-text-light); } & :is(:where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-h1-sm); } @media (width >=48rem) { & :is(:where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-h1); } } & :is(:where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-h2-sm); } @media (width >=48rem) { & :is(:where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-h2); } } & :is(:where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-h3-sm); } @media (width >=48rem) { & :is(:where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-h3); } } & :is(:where(p):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); } & :is(:where(p):not(:where([class~="not-prose"], [class~="not-prose"] *))) { color: var(--color-default); } & :is(:where(a):not(:where([class~="not-prose"], [class~="not-prose"] *))) { color: var(--color-default); } & :is(:where(a):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &.btn { text-decoration-line: none; } } & :is(:where(img):not(:where([class~="not-prose"], [class~="not-prose"] *))) { max-width: 100%; } & :is(:where(img):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-radius: var(--radius-xl); } & :is(:where(strong):not(:where([class~="not-prose"], [class~="not-prose"] *))) { color: var(--color-text-dark); } & :is(:where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-color: var(--color-border); } & :is(:where(pre):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-radius: var(--radius-lg); } & :is(:where(pre):not(:where([class~="not-prose"], [class~="not-prose"] *))) { background-color: var(--color-dark); } & :is(:where(li):not(:where([class~="not-prose"], [class~="not-prose"] *))) { color: var(--color-default); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-radius: var(--radius-lg); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-style: var(--tw-border-style); border-width: 1px; } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-left-style: var(--tw-border-style); border-left-width: 10px; } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-color: var(--color-primary); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { background-color: var(--color-body); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { padding-inline: calc(var(--spacing) * 8); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { padding-block: calc(var(--spacing) * 10); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-family: var(--font-primary); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { color: var(--color-text-dark); } & :is(:where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *))) { font-style: normal; } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { position: relative; } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { overflow: hidden; } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-radius: var(--radius-lg); } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); position: absolute; } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); top: calc(var(--spacing) * 0); } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); left: calc(var(--spacing) * 0); } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); height: 100%; } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); width: 100%; } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); border-radius: inherit; } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); border-style: var(--tw-border-style); border-width: 1px; } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { content: var(--tw-content); border-color: var(--color-border); } } & :is(:where(table):not(:where([class~="not-prose"], [class~="not-prose"] *))) { &::before { --tw-content: ""; content: var(--tw-content); } } & :is(:where(thead):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-color: var(--color-border); } & :is(:where(thead):not(:where([class~="not-prose"], [class~="not-prose"] *))) { background-color: var(--color-body); } & :is(:where(th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { position: relative; } & :is(:where(th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { z-index: 10; } & :is(:where(th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { padding-inline: calc(var(--spacing) * 4); } & :is(:where(th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { padding-block: 18px; } & :is(:where(th):not(:where([class~="not-prose"], [class~="not-prose"] *))) { color: var(--color-text-dark); } & :is(:where(tr):not(:where([class~="not-prose"], [class~="not-prose"] *))) { border-color: var(--color-border); } & :is(:where(td):not(:where([class~="not-prose"], [class~="not-prose"] *))) { position: relative; } & :is(:where(td):not(:where([class~="not-prose"], [class~="not-prose"] *))) { z-index: 10; } & :is(:where(td):not(:where([class~="not-prose"], [class~="not-prose"] *))) { padding-inline: calc(var(--spacing) * 3); } & :is(:where(td):not(:where([class~="not-prose"], [class~="not-prose"] *))) { padding-block: 18px; } } .header { position: fixed; top: calc(var(--spacing) * 0); z-index: 1000; width: 100%; padding-block: calc(var(--spacing) * 6); --tw-duration: 300ms; transition-duration: 300ms; } .navbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } .navbar-brand { font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); color: var(--color-text-light); image { max-height: 100%; max-width: 100%; } } .navbar-nav { cursor: pointer; border-radius: var(--radius-lg); background-color: var(--color-dark); } .nav-link { display: block; padding-inline: calc(var(--spacing) * 3); padding-block: calc(var(--spacing) * 1); text-align: center; white-space: nowrap; color: var(--color-text-light); text-decoration-line: none; opacity: 1; &:hover { @media (hover: hover) { color: var(--color-primary); } } } .nav-sub-link { --tw-leading: calc(var(--spacing) * 7); line-height: calc(var(--spacing) * 7); 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)); &:hover { @media (hover: hover) { color: var(--color-primary); } } } .hamburger-line { position: absolute; left: calc(var(--spacing) * 0); height: 2px; width: 100%; background-color: currentcolor; transition-property: all; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); --tw-duration: 300ms; transition-duration: 300ms; --tw-ease: var(--ease-in-out); transition-timing-function: var(--ease-in-out); } .top-line { transform: translateY(-8px); } .middle-line { transform-origin: center; } .bottom-line { transform: translateY(8px); } [aria-expanded="true"] .top-line { transform: rotate(45deg); } [aria-expanded="true"] .middle-line { transform: translateX(5px); opacity: 0; } [aria-expanded="true"] .bottom-line { transform: rotate(-45deg); } .btn { display: inline-block; border-radius: 14px; border-style: var(--tw-border-style); border-width: 1px; border-color: transparent; padding-inline: calc(var(--spacing) * 6); padding-block: calc(var(--spacing) * 3); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); text-transform: capitalize; 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)); } .btn-sm { border-radius: var(--radius-lg); padding-inline: calc(var(--spacing) * 4); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); } .btn-primary { background-color: var(--color-primary); color: var(--color-text-dark); opacity: 95%; &:hover { @media (hover: hover) { background-color: var(--color-primary); } } } .btn-secondary { background-color: var(--color-white); color: var(--color-text-dark); &:hover { @media (hover: hover) { background-color: color-mix(in srgb, #fff 95%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 95%, transparent); } } } } [data-aos="fade-up-sm"] { transform: translateY(30px); opacity: 0; transition-property: transform, opacity; &.aos-animate { transform: translateY(0); opacity: 1; } } [data-aos="fade-down-sm"] { transform: translateY(-15px); opacity: 0; transition-property: transform, opacity; &.aos-animate { transform: translateY(0); opacity: 1; } } [data-aos="fade-left-sm"] { transform: translateX(30px); opacity: 0; transition-property: transform, opacity; &.aos-animate { transform: translateX(0); opacity: 1; } } [data-aos="fade-right-sm"] { transform: translateX(-30px); opacity: 0; transition-property: transform, opacity; &.aos-animate { transform: translateX(0); opacity: 1; } } [data-aos="zoom-out-sm"] { transform: scale(1.05); opacity: 0.5; transition-property: transform, opacity; &.aos-animate { transform: scale(1); opacity: 1; } } [data-aos="zoom-in-sm"] { transform: scale(0.9); opacity: 0.5; transition-property: transform, opacity; &.aos-animate { transform: scale(1); opacity: 1; } } @keyframes horizontalExpand { 0%, 100% { transform: scaleX(0.9); } 50% { transform: scaleX(1.04); } } .animate-horizontal-expand { animation: horizontalExpand 15s ease-in-out infinite; transform-origin: center; } @keyframes pulse-shadow { 0%, 100% { filter: drop-shadow(0 0 5px var(--color-quinary)); } 50% { filter: drop-shadow(0 0 10px var(--color-quinary)); } } @keyframes bgzoom { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } } @keyframes float-diagonal { 0%, 100% { transform: translate(-5px, -5px); } 50% { transform: translate(5px, 5px); } } } @layer base { :root { --text-h6: 1.2rem; --text-h6-sm: 1.08rem; --text-h5: 1.44rem; --text-h5-sm: 1.296rem; --text-h4: 1.728rem; --text-h4-sm: 1.5552rem; --text-h3: 2.0736rem; --text-h3-sm: 1.86624rem; --text-h2: 2.48832rem; --text-h2-sm: 2.239488rem; --text-h1: 2.9859839999999997rem; --text-h1-sm: 2.6873856rem; --text-base: NaNpx; --text-base-sm: NaNpx; --font-primary: Rethink Sans, sans-serif; --color-body: #111721; --color-primary: #BBF10A; --color-secondary: #2E85FA; --color-tertiary: #70DB80; --color-quinary: #FDE44B; --color-border: #3E3E3E; --color-dark: #1B212A; --color-default: #AAAAAA; --color-text-dark: #121821; --color-text-light: #FFFFFF; } } @layer base { [type='text'], input:where(:not([type])), [type='email'], [type='url'], [type='password'], [type='number'], [type='date'], [type='datetime-local'], [type='month'], [type='search'], [type='tel'], [type='time'], [type='week'], [multiple], textarea, select { appearance: none; background-color: #fff; border-color: oklch(55.1% 0.027 264.364); border-width: 1px; border-radius: 0px; padding-top: 0.5rem; padding-right: 0.75rem; padding-bottom: 0.5rem; padding-left: 0.75rem; font-size: 1rem; line-height: 1.5rem; --tw-shadow: 0 0 #0000; &:focus { outline: 2px solid transparent; outline-offset: 2px; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: oklch(54.6% 0.245 262.881); --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); border-color: oklch(54.6% 0.245 262.881); } } input::placeholder, textarea::placeholder { color: oklch(55.1% 0.027 264.364); opacity: 1; } ::-webkit-datetime-edit-fields-wrapper { padding: 0; } ::-webkit-date-and-time-value { min-height: 1.5em; } ::-webkit-date-and-time-value { text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { padding-top: 0; padding-bottom: 0; } select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='oklch(55.1%25 0.027 264.364)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e"); background-position: right 0.5rem center; background-repeat: no-repeat; background-size: 1.5em 1.5em; padding-right: 2.5rem; print-color-adjust: exact; } [multiple], [size]:where(select:not([size="1"])) { background-image: initial; background-position: initial; background-repeat: unset; background-size: initial; padding-right: 0.75rem; print-color-adjust: unset; } [type='checkbox'], [type='radio'] { appearance: none; padding: 0; print-color-adjust: exact; display: inline-block; vertical-align: middle; background-origin: border-box; user-select: none; flex-shrink: 0; height: 1rem; width: 1rem; color: oklch(54.6% 0.245 262.881); background-color: #fff; border-color: oklch(55.1% 0.027 264.364); border-width: 1px; --tw-shadow: 0 0 #0000; } [type='checkbox'] { border-radius: 0px; } [type='radio'] { border-radius: 100%; } [type='checkbox']:focus, [type='radio']:focus { outline: 2px solid transparent; outline-offset: 2px; --tw-ring-inset: var(--tw-empty, ); --tw-ring-offset-width: 2px; --tw-ring-offset-color: #fff; --tw-ring-color: oklch(54.6% 0.245 262.881); --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } [type='checkbox']:checked, [type='radio']:checked { border-color: transparent; background-color: currentColor; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; } [type='checkbox']:checked { background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e"); @media (forced-colors: active) { appearance: auto; } } [type='radio']:checked { background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e"); @media (forced-colors: active) { appearance: auto; } } [type='checkbox']:checked:hover, [type='checkbox']:checked:focus, [type='radio']:checked:hover, [type='radio']:checked:focus { border-color: transparent; background-color: currentColor; } [type='checkbox']:indeterminate { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e"); border-color: transparent; background-color: currentColor; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; @media (forced-colors: active) { appearance: auto; } } [type='checkbox']:indeterminate:hover, [type='checkbox']:indeterminate:focus { border-color: transparent; background-color: currentColor; } [type='file'] { background: unset; border-color: inherit; border-width: 0; border-radius: 0; padding: 0; font-size: unset; line-height: inherit; } [type='file']:focus { outline: 1px solid ButtonText; outline: 1px auto -webkit-focus-ring-color; } } @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-border-spacing-x { syntax: "<length>"; inherits: false; initial-value: 0; } @property --tw-border-spacing-y { syntax: "<length>"; inherits: false; initial-value: 0; } @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-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-border-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-leading { syntax: "*"; inherits: false; } @property --tw-font-weight { syntax: "*"; inherits: false; } @property --tw-tracking { 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: 0px; } @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-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-duration { syntax: "*"; inherits: false; } @property --tw-ease { syntax: "*"; inherits: false; } @property --tw-content { syntax: "*"; initial-value: ""; inherits: false; } @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-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-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --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-border-style: solid; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: 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-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-duration: initial; --tw-ease: initial; --tw-content: ""; } } } #whyUsModal { backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); } #whyUsModalContent { max-width: 48rem; border-radius: 2.5rem; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); } @media (min-width: 768px) { #whyUsModalContent { padding: 3rem; } }