@layer properties;
@layer theme, base, components, utilities;
@layer theme {
 :root, :host {
 --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-100: oklch(93.6% 0.032 17.717);
 --color-red-500: oklch(63.7% 0.237 25.331);
 --color-red-800: oklch(44.4% 0.177 26.899);
 --color-green-100: oklch(96.2% 0.044 156.743);
 --color-green-500: oklch(72.3% 0.219 149.579);
 --color-green-800: oklch(44.8% 0.119 151.328);
 --color-blue-50: oklch(97% 0.014 254.604);
 --color-blue-100: oklch(93.2% 0.032 255.585);
 --color-blue-500: oklch(62.3% 0.214 259.815);
 --color-blue-700: oklch(48.8% 0.243 264.376);
 --color-blue-800: oklch(42.4% 0.199 265.638);
 --color-gray-50: oklch(98.5% 0.002 247.839);
 --color-gray-300: oklch(87.2% 0.01 258.338);
 --color-gray-400: oklch(70.7% 0.022 261.325);
 --color-gray-600: oklch(44.6% 0.03 256.802);
 --color-gray-700: oklch(37.3% 0.034 259.733);
 --color-gray-800: oklch(27.8% 0.033 256.848);
 --color-gray-900: oklch(21% 0.034 264.665);
 --color-black: #000;
 --color-white: #fff;
 --spacing: 0.25rem;
 --container-2xl: 42rem;
 --container-3xl: 48rem;
 --container-7xl: 80rem;
 --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-3xl: 1.875rem;
 --text-3xl--line-height: calc(2.25 / 1.875);
 --text-4xl: 2.25rem;
 --text-4xl--line-height: calc(2.5 / 2.25);
 --text-5xl: 3rem;
 --text-5xl--line-height: 1;
 --font-weight-medium: 500;
 --font-weight-bold: 700;
 --radius-sm: 0.25rem;
 --radius-md: 0.375rem;
 --radius-lg: 0.5rem;
 --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;
 }
 :-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 {
 .absolute {
 position: absolute;
 }
 .fixed {
 position: fixed;
 }
 .relative {
 position: relative;
 }
 .inset-0 {
 inset: calc(var(--spacing) * 0);
 }
 .right-0 {
 right: calc(var(--spacing) * 0);
 }
 .bottom-0 {
 bottom: calc(var(--spacing) * 0);
 }
 .left-0 {
 left: calc(var(--spacing) * 0);
 }
 .z-10 {
 z-index: 10;
 }
 .mx-auto {
 margin-inline: auto;
 }
 .mt-0\.5 {
 margin-top: calc(var(--spacing) * 0.5);
 }
 .mt-2 {
 margin-top: calc(var(--spacing) * 2);
 }
 .mt-8 {
 margin-top: calc(var(--spacing) * 8);
 }
 .mt-16 {
 margin-top: calc(var(--spacing) * 16);
 }
 .mt-auto {
 margin-top: auto;
 }
 .mr-2 {
 margin-right: calc(var(--spacing) * 2);
 }
 .mr-3 {
 margin-right: calc(var(--spacing) * 3);
 }
 .mr-4 {
 margin-right: calc(var(--spacing) * 4);
 }
 .mb-2 {
 margin-bottom: calc(var(--spacing) * 2);
 }
 .mb-4 {
 margin-bottom: calc(var(--spacing) * 4);
 }
 .mb-6 {
 margin-bottom: calc(var(--spacing) * 6);
 }
 .mb-8 {
 margin-bottom: calc(var(--spacing) * 8);
 }
 .mb-10 {
 margin-bottom: calc(var(--spacing) * 10);
 }
 .mb-16 {
 margin-bottom: calc(var(--spacing) * 16);
 }
 .flex {
 display: flex;
 }
 .grid {
 display: grid;
 }
 .inline-flex {
 display: inline-flex;
 }
 .h-4 {
 height: calc(var(--spacing) * 4);
 }
 .h-5 {
 height: calc(var(--spacing) * 5);
 }
 .h-6 {
 height: calc(var(--spacing) * 6);
 }
 .h-8 {
 height: calc(var(--spacing) * 8);
 }
 .h-10 {
 height: calc(var(--spacing) * 10);
 }
 .h-11 {
 height: calc(var(--spacing) * 11);
 }
 .h-12 {
 height: calc(var(--spacing) * 12);
 }
 .h-16 {
 height: calc(var(--spacing) * 16);
 }
 .h-64 {
 height: calc(var(--spacing) * 64);
 }
 .h-80 {
 height: calc(var(--spacing) * 80);
 }
 .h-auto {
 height: auto;
 }
 .h-full {
 height: 100%;
 }
 .h-screen {
 height: 100vh;
 }
 .max-h-16 {
 max-height: calc(var(--spacing) * 16);
 }
 .min-h-screen {
 min-height: 100vh;
 }
 .w-4 {
 width: calc(var(--spacing) * 4);
 }
 .w-5 {
 width: calc(var(--spacing) * 5);
 }
 .w-6 {
 width: calc(var(--spacing) * 6);
 }
 .w-8 {
 width: calc(var(--spacing) * 8);
 }
 .w-12 {
 width: calc(var(--spacing) * 12);
 }
 .w-16 {
 width: calc(var(--spacing) * 16);
 }
 .w-full {
 width: 100%;
 }
 .max-w-2xl {
 max-width: var(--container-2xl);
 }
 .max-w-3xl {
 max-width: var(--container-3xl);
 }
 .max-w-7xl {
 max-width: var(--container-7xl);
 }
 .flex-shrink-0 {
 flex-shrink: 0;
 }
 .grid-cols-1 {
 grid-template-columns: repeat(1, minmax(0, 1fr));
 }
 .grid-cols-2 {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }
 .grid-cols-3 {
 grid-template-columns: repeat(3, minmax(0, 1fr));
 }
 .flex-col {
 flex-direction: column;
 }
 .items-center {
 align-items: center;
 }
 .items-start {
 align-items: flex-start;
 }
 .justify-between {
 justify-content: space-between;
 }
 .justify-center {
 justify-content: center;
 }
 .gap-2 {
 gap: calc(var(--spacing) * 2);
 }
 .gap-4 {
 gap: calc(var(--spacing) * 4);
 }
 .gap-6 {
 gap: calc(var(--spacing) * 6);
 }
 .gap-8 {
 gap: calc(var(--spacing) * 8);
 }
 .gap-12 {
 gap: calc(var(--spacing) * 12);
 }
 .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-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-8 {
 :where(& > :not(:last-child)) {
 --tw-space-y-reverse: 0;
 margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));
 margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
 }
 }
 .space-x-4 {
 :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)));
 }
 }
 .overflow-hidden {
 overflow: hidden;
 }
 .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);
 }
 .border {
 border-style: var(--tw-border-style);
 border-width: 1px;
 }
 .border-t {
 border-top-style: var(--tw-border-style);
 border-top-width: 1px;
 }
 .border-none {
 --tw-border-style: none;
 border-style: none;
 }
 .border-gray-800 {
 border-color: var(--color-gray-800);
 }
 .border-white {
 border-color: var(--color-white);
 }
 .bg-black {
 background-color: var(--color-black);
 }
 .bg-blue-50 {
 background-color: var(--color-blue-50);
 }
 .bg-blue-100 {
 background-color: var(--color-blue-100);
 }
 .bg-blue-700 {
 background-color: var(--color-blue-700);
 }
 .bg-gray-50 {
 background-color: var(--color-gray-50);
 }
 .bg-gray-900 {
 background-color: var(--color-gray-900);
 }
 .bg-green-100 {
 background-color: var(--color-green-100);
 }
 .bg-red-100 {
 background-color: var(--color-red-100);
 }
 .bg-white {
 background-color: var(--color-white);
 }
 .bg-gradient-to-t {
 --tw-gradient-position: to top in oklab;
 background-image: linear-gradient(var(--tw-gradient-stops));
 }
 .from-black {
 --tw-gradient-from: var(--color-black);
 --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
 }
 .to-transparent {
 --tw-gradient-to: transparent;
 --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
 }
 .bg-cover {
 background-size: cover;
 }
 .bg-center {
 background-position: center;
 }
 .object-cover {
 object-fit: cover;
 }
 .p-1 {
 padding: calc(var(--spacing) * 1);
 }
 .p-4 {
 padding: calc(var(--spacing) * 4);
 }
 .p-6 {
 padding: calc(var(--spacing) * 6);
 }
 .p-8 {
 padding: calc(var(--spacing) * 8);
 }
 .px-3 {
 padding-inline: calc(var(--spacing) * 3);
 }
 .px-4 {
 padding-inline: calc(var(--spacing) * 4);
 }
 .px-8 {
 padding-inline: calc(var(--spacing) * 8);
 }
 .py-1\.5 {
 padding-block: calc(var(--spacing) * 1.5);
 }
 .py-2 {
 padding-block: calc(var(--spacing) * 2);
 }
 .py-6 {
 padding-block: calc(var(--spacing) * 6);
 }
 .py-12 {
 padding-block: calc(var(--spacing) * 12);
 }
 .py-20 {
 padding-block: calc(var(--spacing) * 20);
 }
 .py-24 {
 padding-block: calc(var(--spacing) * 24);
 }
 .pt-8 {
 padding-top: calc(var(--spacing) * 8);
 }
 .text-center {
 text-align: center;
 }
 .text-2xl {
 font-size: var(--text-2xl);
 line-height: var(--tw-leading, var(--text-2xl--line-height));
 }
 .text-3xl {
 font-size: var(--text-3xl);
 line-height: var(--tw-leading, var(--text-3xl--line-height));
 }
 .text-4xl {
 font-size: var(--text-4xl);
 line-height: var(--tw-leading, var(--text-4xl--line-height));
 }
 .text-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));
 }
 .font-bold {
 --tw-font-weight: var(--font-weight-bold);
 font-weight: var(--font-weight-bold);
 }
 .font-medium {
 --tw-font-weight: var(--font-weight-medium);
 font-weight: var(--font-weight-medium);
 }
 .whitespace-nowrap {
 white-space: nowrap;
 }
 .text-blue-500 {
 color: var(--color-blue-500);
 }
 .text-blue-700 {
 color: var(--color-blue-700);
 }
 .text-blue-800 {
 color: var(--color-blue-800);
 }
 .text-gray-300 {
 color: var(--color-gray-300);
 }
 .text-gray-400 {
 color: var(--color-gray-400);
 }
 .text-gray-600 {
 color: var(--color-gray-600);
 }
 .text-gray-700 {
 color: var(--color-gray-700);
 }
 .text-gray-900 {
 color: var(--color-gray-900);
 }
 .text-green-500 {
 color: var(--color-green-500);
 }
 .text-green-800 {
 color: var(--color-green-800);
 }
 .text-red-500 {
 color: var(--color-red-500);
 }
 .text-red-800 {
 color: var(--color-red-800);
 }
 .text-white {
 color: var(--color-white);
 }
 .italic {
 font-style: italic;
 }
 .not-italic {
 font-style: normal;
 }
 .opacity-50 {
 opacity: 50%;
 }
 .shadow-lg {
 --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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-sm {
 --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);
 }
 .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,);
 }
 .transition-all {
 transition-property: all;
 transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
 transition-duration: var(--tw-duration, var(--default-transition-duration));
 }
 .transition-colors {
 transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
 transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
 transition-duration: var(--tw-duration, var(--default-transition-duration));
 }
 .transition-shadow {
 transition-property: box-shadow;
 transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
 transition-duration: var(--tw-duration, var(--default-transition-duration));
 }
 .transition-transform {
 transition-property: transform, translate, scale, rotate;
 transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
 transition-duration: var(--tw-duration, var(--default-transition-duration));
 }
 .duration-500 {
 --tw-duration: 500ms;
 transition-duration: 500ms;
 }
 .group-hover\:scale-105 {
 &:is(:where(.group):hover *) {
 @media (hover: hover) {
 --tw-scale-x: 105%;
 --tw-scale-y: 105%;
 --tw-scale-z: 105%;
 scale: var(--tw-scale-x) var(--tw-scale-y);
 }
 }
 }
 .hover\:bg-white {
 &:hover {
 @media (hover: hover) {
 background-color: var(--color-white);
 }
 }
 }
 .hover\:text-blue-700 {
 &:hover {
 @media (hover: hover) {
 color: var(--color-blue-700);
 }
 }
 }
 .hover\:text-white {
 &:hover {
 @media (hover: hover) {
 color: var(--color-white);
 }
 }
 }
 .hover\:shadow-md {
 &:hover {
 @media (hover: hover) {
 --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);
 }
 }
 }
 .hover\:grayscale-0 {
 &: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,);
 }
 }
 }
 .focus-visible\:ring-2 {
 &:focus-visible {
 --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
 box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
 }
 .focus-visible\:ring-offset-2 {
 &:focus-visible {
 --tw-ring-offset-width: 2px;
 --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
 }
 }
 .focus-visible\:outline-none {
 &:focus-visible {
 --tw-outline-style: none;
 outline-style: none;
 }
 }
 .disabled\:pointer-events-none {
 &:disabled {
 pointer-events: none;
 }
 }
 .disabled\:opacity-50 {
 &:disabled {
 opacity: 50%;
 }
 }
 .data-\[state\=active\]\:shadow-sm {
 &[data-state="active"] {
 --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);
 }
 }
 .sm\:px-6 {
 @media (width >= 40rem) {
 padding-inline: calc(var(--spacing) * 6);
 }
 }
 .md\:grid-cols-2 {
 @media (width >= 48rem) {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }
 }
 .md\:grid-cols-3 {
 @media (width >= 48rem) {
 grid-template-columns: repeat(3, minmax(0, 1fr));
 }
 }
 .md\:grid-cols-4 {
 @media (width >= 48rem) {
 grid-template-columns: repeat(4, minmax(0, 1fr));
 }
 }
 .md\:grid-cols-5 {
 @media (width >= 48rem) {
 grid-template-columns: repeat(5, minmax(0, 1fr));
 }
 }
 .md\:text-left {
 @media (width >= 48rem) {
 text-align: left;
 }
 }
 .md\:text-2xl {
 @media (width >= 48rem) {
 font-size: var(--text-2xl);
 line-height: var(--tw-leading, var(--text-2xl--line-height));
 }
 }
 .md\:text-4xl {
 @media (width >= 48rem) {
 font-size: var(--text-4xl);
 line-height: var(--tw-leading, var(--text-4xl--line-height));
 }
 }
 .md\:text-5xl {
 @media (width >= 48rem) {
 font-size: var(--text-5xl);
 line-height: var(--tw-leading, var(--text-5xl--line-height));
 }
 }
 .md\:text-base {
 @media (width >= 48rem) {
 font-size: var(--text-base);
 line-height: var(--tw-leading, var(--text-base--line-height));
 }
 }
 .lg\:grid-cols-2 {
 @media (width >= 64rem) {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }
 }
 .lg\:grid-cols-4 {
 @media (width >= 64rem) {
 grid-template-columns: repeat(4, minmax(0, 1fr));
 }
 }
 .lg\:px-8 {
 @media (width >= 64rem) {
 padding-inline: calc(var(--spacing) * 8);
 }
 }
 .\[\&_svg\]\:pointer-events-none {
 & svg {
 pointer-events: none;
 }
 }
 .\[\&_svg\]\:size-4 {
 & svg {
 width: calc(var(--spacing) * 4);
 height: calc(var(--spacing) * 4);
 }
 }
 .\[\&_svg\]\:shrink-0 {
 & svg {
 flex-shrink: 0;
 }
 }
}
@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-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-font-weight {
 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-scale-x {
 syntax: "*";
 inherits: false;
 initial-value: 1;
}
@property --tw-scale-y {
 syntax: "*";
 inherits: false;
 initial-value: 1;
}
@property --tw-scale-z {
 syntax: "*";
 inherits: false;
 initial-value: 1;
}
@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-space-y-reverse: 0;
 --tw-space-x-reverse: 0;
 --tw-border-style: solid;
 --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-font-weight: 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-scale-x: 1;
 --tw-scale-y: 1;
 --tw-scale-z: 1;
 }
 }
}

.tab-d-none {display:none;}

/*плавный скролл страницы*/
html {
scroll-behavior: smooth;
}




.theme-btn {
 display: inline-block;
 vertical-align: middle;
 border: none;
 outline: none !important;
 background-color: #FF7A2F;
 color: #fff;
 font-size: 16px;
 font-weight: 500;
 padding: 10px;
 transition: all 0.4s ease-in-out;
 letter-spacing: 0;
 border-radius: 10px;
 position: relative;
 overflow: hidden;
 text-align: center;
 line-height: 1;
 z-index: 10;
 box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Добавляем базовую тень */
}

.theme-btn:hover {
 background: #ff3333;
 color: #fff;
 box-shadow: 0 8px 16px rgba(0, 0, 0, 0.7); /* Увеличиваем интенсивность тени при наведении */
}



/* Стили для кружочка с вопросительным знаком */
.hint-trigger1, .hint-trigger2, .hint-trigger3, .hint-trigger4 {
 display: inline-flex; /* Используем flex для выравнивания знака вопроса */
 align-items: center; /* Вертикальное выравнивание по центру */
 justify-content: center;/* Горизонтальное выравнивание по центру */
 width: 20px; /* Ширина кружочка */
 height: 20px; /* Высота кружочка */
 background-color: #4285f4; /* Синий цвет фона */
 color: white; /* Белый цвет текста (знака вопроса) */
 border-radius: 50%; /* Делаем круглую форму */
 font-size: 14px; /* Размер знака вопроса */
 font-weight: bold; /* Жирный знак вопроса */
 cursor: pointer; /* Курсор-указатель при наведении */
 margin-left: 5px; /* Отступ слева от основного текста */
 vertical-align: super; /* Выравниваем немного выше базовой линии */
 line-height: 1; /* Межстрочный интервал */
 transition: all 0.2s ease; /* Плавные анимации при изменениях */
}

/* Стили при наведении на кружочек */
.hint-trigger1:hover, .hint-trigger2:hover, .hint-trigger3:hover, .hint-trigger4:hover {
 background-color: #3367d6; /* Тёмно-синий цвет при наведении */
 transform: scale(1.1); /* Увеличиваем немного размер */
}


/* Стили для содержимого подсказки */
.hint-content1, .hint-content2, .hint-content3, .hint-content4 {
 position: absolute; /* Абсолютное позиционирование относительно родителя */
 bottom: 90%; /* Располагаем над родительским элементом */
 left: 50%; /* Центрируем по горизонтали */
 transform: translateX(-50%); /* Точное центрирование с учётом ширины */
 background-color: white; /* Белый фон подсказки */
 color: #333; /* Тёмно-серый цвет текста */
 padding: 15px; /* Внутренние отступы */
 border-radius: 8px; /* Закруглённые углы */
 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); /* Тень для эффекта «всплывающего окна» */
 width: 350px; /* Фиксированная ширина подсказки */
 z-index: 100; /* Поднимаем над другими элементами */
 display: none; /* По умолчанию скрыта */
 font-size: 14px; /* Размер шрифта в подсказке */
 line-height: 1.5; /* Межстрочный интервал */
 margin-bottom: 5px; /* Отступ снизу */
}

/* Треугольный указатель подсказки (стрелочка вниз) */
.hint-content1:after, .hint-content2:after, .hint-content3:after, .hint-content4:after {
 content: ''; /* Псевдоэлемент для создания стрелочки */
 position: absolute; /* Абсолютное позиционирование */
 top: 100%; /* Располагаем внизу подсказки */
 left: 50%; /* Центрируем по горизонтали */
 transform: translateX(-50%); /* Точное центрирование */
 border-width: 8px; /* Размер стрелочки */
 border-style: solid; /* Сплошная граница */
 border-color: white transparent transparent transparent; /* Белый треугольник, остальные стороны прозрачные */
}

/* Класс для отображения подсказки */
.show-hint1, .show-hint2, .show-hint3, .show-hint4 {
 display: block; /* Делаем подсказку видимой */
 animation: fadeIn 0.2s ease; /* Анимация появления */
}

/* Анимация плавного появления подсказки */
@keyframes fadeIn {
 from { 
 opacity: 0; /* Начальная прозрачность */
 transform: translateX(-50%) translateY(10px); /* Начальное смещение вниз */
 }
 to { 
 opacity: 1; /* Конечная прозрачность */
 transform: translateX(-50%) translateY(0); /* Конечное положение */
 }
}


 nav ul {
 list-style-type: none;
 padding-left: 0;
 }

 /* Мобильная версия сайта (меньше 768px) */
 @media only screen and (max-width: 767px) {
 nav div > a,
 nav div > button {
 display: block;
 text-align: center;
 margin-bottom: 1rem;
 }

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

 nav div.flex.items-center.space-x-4 {
 display: block;
 position: absolute;
 background-color: white;
 left: 0;
 right: 0;
 bottom: 0;
 overflow: hidden;
 visibility: hidden;
 opacity: 0;
 transition: all 0.3s ease;
 }

 nav input[type='checkbox']:checked ~ div.flex.items-center.space-x-4 {
 visibility: visible;
 opacity: 1;
 }
 }

 /* Десктоп версия (больше 768px) */
 @media only screen and (min-width: 768px) {
 nav div > a,
 nav div > button {
 display: inline-block;
 }

 nav div.flex.items-center.space-x-4 {
 position: relative;
 }
 }