@layer properties;
@layer theme, base, components, utilities;
@layer theme {
:root, :host {
--font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
--color-amber-200: oklch(92.4% 0.12 95.746);
--color-stone-100: oklch(97% 0.001 106.424);
--color-stone-200: oklch(92.3% 0.003 48.717);
--color-stone-300: oklch(86.9% 0.005 56.366);
--color-stone-400: oklch(70.9% 0.01 56.259);
--color-stone-500: oklch(55.3% 0.013 58.071);
--color-stone-600: oklch(44.4% 0.011 73.639);
--color-stone-700: oklch(37.4% 0.01 67.558);
--color-stone-800: oklch(26.8% 0.007 34.298);
--color-stone-900: oklch(21.6% 0.006 56.043);
--color-white: #fff;
--spacing: 0.25rem;
--container-md: 28rem;
--container-lg: 32rem;
--container-xl: 36rem;
--container-2xl: 42rem;
--container-6xl: 72rem;
--container-7xl: 80rem;
--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-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);
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--font-weight-extrabold: 800;
--tracking-tight: -0.025em;
--tracking-wide: 0.025em;
--radius-lg: 0.5rem;
--radius-xl: 0.75rem;
--radius-2xl: 1rem;
--radius-3xl: 1.5rem;
--default-transition-duration: 150ms;
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
--font-display: "Inter Display", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
--color-sun: #ffd23f;
--color-ink: #17140f;
--color-cream: #fffbea;
}
}
@layer utilities {
.pointer-events-none {
pointer-events: none;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
border-width: 0;
}
.absolute {
position: absolute;
}
.relative {
position: relative;
}
.sticky {
position: sticky;
}
.inset-x-0 {
inset-inline: 0px;
}
.-top-3 {
top: calc(var(--spacing) * -3);
}
.-top-32 {
top: calc(var(--spacing) * -32);
}
.top-\(--bar-h\) {
top: var(--bar-h);
}
.top-6 {
top: calc(var(--spacing) * 6);
}
.top-full {
top: 100%;
}
.-right-56 {
right: calc(var(--spacing) * -56);
}
.right-\[12\%\] {
right: 12%;
}
.-bottom-2 {
bottom: calc(var(--spacing) * -2);
}
.-left-\[3\%\] {
left: calc(3% * -1);
}
.left-8 {
left: calc(var(--spacing) * 8);
}
.left-\[12\%\] {
left: 12%;
}
.isolate {
isolation: isolate;
}
.z-10 {
z-index: 10;
}
.z-20 {
z-index: 20;
}
.z-40 {
z-index: 40;
}
.z-\[5\] {
z-index: 5;
}
.mx-auto {
margin-inline: auto;
}
.mt-0\.5 {
margin-top: calc(var(--spacing) * 0.5);
}
.mt-1 {
margin-top: var(--spacing);
}
.mt-2 {
margin-top: calc(var(--spacing) * 2);
}
.mt-3 {
margin-top: calc(var(--spacing) * 3);
}
.mt-4 {
margin-top: calc(var(--spacing) * 4);
}
.mt-5 {
margin-top: calc(var(--spacing) * 5);
}
.mt-6 {
margin-top: calc(var(--spacing) * 6);
}
.mt-7 {
margin-top: calc(var(--spacing) * 7);
}
.mt-8 {
margin-top: calc(var(--spacing) * 8);
}
.mt-10 {
margin-top: calc(var(--spacing) * 10);
}
.mt-14 {
margin-top: calc(var(--spacing) * 14);
}
.mb-10 {
margin-bottom: calc(var(--spacing) * 10);
}
.block {
display: block;
}
.flex {
display: flex;
}
.grid {
display: grid;
}
.inline-block {
display: inline-block;
}
.inline-flex {
display: inline-flex;
}
.size-2 {
width: calc(var(--spacing) * 2);
height: calc(var(--spacing) * 2);
}
.size-3\.5 {
width: calc(var(--spacing) * 3.5);
height: calc(var(--spacing) * 3.5);
}
.size-4 {
width: calc(var(--spacing) * 4);
height: calc(var(--spacing) * 4);
}
.size-5 {
width: calc(var(--spacing) * 5);
height: calc(var(--spacing) * 5);
}
.size-6 {
width: calc(var(--spacing) * 6);
height: calc(var(--spacing) * 6);
}
.size-7 {
width: calc(var(--spacing) * 7);
height: calc(var(--spacing) * 7);
}
.size-8 {
width: calc(var(--spacing) * 8);
height: calc(var(--spacing) * 8);
}
.size-9 {
width: calc(var(--spacing) * 9);
height: calc(var(--spacing) * 9);
}
.size-10 {
width: calc(var(--spacing) * 10);
height: calc(var(--spacing) * 10);
}
.size-12 {
width: calc(var(--spacing) * 12);
height: calc(var(--spacing) * 12);
}
.size-72 {
width: calc(var(--spacing) * 72);
height: calc(var(--spacing) * 72);
}
.h-16 {
height: calc(var(--spacing) * 16);
}
.h-full {
height: 100%;
}
.w-\[106\%\] {
width: 106%;
}
.w-\[min\(100\%-2\.5rem\,46rem\)\] {
width: min(100% - 2.5rem, 46rem);
}
.w-full {
width: 100%;
}
.w-max {
width: max-content;
}
.max-w-2xl {
max-width: var(--container-2xl);
}
.max-w-6xl {
max-width: var(--container-6xl);
}
.max-w-7xl {
max-width: var(--container-7xl);
}
.max-w-lg {
max-width: var(--container-lg);
}
.max-w-md {
max-width: var(--container-md);
}
.max-w-prose {
max-width: 65ch;
}
.max-w-xl {
max-width: var(--container-xl);
}
.flex-1 {
flex: 1;
}
.shrink-0 {
flex-shrink: 0;
}
.-rotate-2 {
rotate: calc(2deg * -1);
}
.-rotate-\[1\.4deg\] {
rotate: calc(1.4deg * -1);
}
.cursor-pointer {
cursor: pointer;
}
.list-none {
list-style-type: none;
}
.flex-col {
flex-direction: column;
}
.flex-wrap {
flex-wrap: wrap;
}
.place-items-center {
place-items: center;
}
.items-baseline {
align-items: baseline;
}
.items-center {
align-items: center;
}
.items-start {
align-items: flex-start;
}
.items-stretch {
align-items: stretch;
}
.justify-between {
justify-content: space-between;
}
.justify-center {
justify-content: center;
}
.gap-1 {
gap: var(--spacing);
}
.gap-1\.5 {
gap: calc(var(--spacing) * 1.5);
}
.gap-2 {
gap: calc(var(--spacing) * 2);
}
.gap-2\.5 {
gap: calc(var(--spacing) * 2.5);
}
.gap-3 {
gap: calc(var(--spacing) * 3);
}
.gap-4 {
gap: calc(var(--spacing) * 4);
}
.gap-6 {
gap: calc(var(--spacing) * 6);
}
.gap-7 {
gap: calc(var(--spacing) * 7);
}
.gap-10 {
gap: calc(var(--spacing) * 10);
}
.gap-12 {
gap: calc(var(--spacing) * 12);
}
:where(.space-y-3 > :not(:last-child)) {
--tw-space-y-reverse: 0;
margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
}
.gap-x-6 {
column-gap: calc(var(--spacing) * 6);
}
.gap-x-7 {
column-gap: calc(var(--spacing) * 7);
}
.gap-y-2 {
row-gap: calc(var(--spacing) * 2);
}
.gap-y-4 {
row-gap: calc(var(--spacing) * 4);
}
:where(.divide-y > :not(:last-child)) {
--tw-divide-y-reverse: 0;
border-bottom-style: var(--tw-border-style);
border-top-style: var(--tw-border-style);
border-top-width: calc(1px * var(--tw-divide-y-reverse));
border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
}
:where(.divide-stone-200 > :not(:last-child)) {
border-color: var(--color-stone-200);
}
:where(.divide-white\/10 > :not(:last-child)) {
border-color: color-mix(in srgb, #fff 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
border-color: color-mix(in oklab, var(--color-white) 10%, transparent);
}
}
.overflow-hidden {
overflow: hidden;
}
.rounded-2xl {
border-radius: var(--radius-2xl);
}
.rounded-3xl {
border-radius: var(--radius-3xl);
}
.rounded-\[0\.22em\] {
border-radius: 0.22em;
}
.rounded-\[2rem\] {
border-radius: 2rem;
}
.rounded-full {
border-radius: calc(infinity * 1px);
}
.rounded-lg {
border-radius: var(--radius-lg);
}
.rounded-xl {
border-radius: var(--radius-xl);
}
.border-2 {
border-style: var(--tw-border-style);
border-width: 2px;
}
.border-y {
border-block-style: var(--tw-border-style);
border-block-width: 1px;
}
.border-t {
border-top-style: var(--tw-border-style);
border-top-width: 1px;
}
.border-t-2 {
border-top-style: var(--tw-border-style);
border-top-width: 2px;
}
.border-b {
border-bottom-style: var(--tw-border-style);
border-bottom-width: 1px;
}
.border-dashed {
--tw-border-style: dashed;
border-style: dashed;
}
.border-ink {
border-color: var(--color-ink);
}
.border-ink\/25 {
border-color: color-mix(in srgb, #17140f 25%, transparent);
@supports (color: color-mix(in lab, red, red)) {
border-color: color-mix(in oklab, var(--color-ink) 25%, transparent);
}
}
.border-stone-100 {
border-color: var(--color-stone-100);
}
.border-stone-200 {
border-color: var(--color-stone-200);
}
.border-stone-200\/70 {
border-color: color-mix(in srgb, oklch(92.3% 0.003 48.717) 70%, transparent);
@supports (color: color-mix(in lab, red, red)) {
border-color: color-mix(in oklab, var(--color-stone-200) 70%, transparent);
}
}
.border-stone-200\/80 {
border-color: color-mix(in srgb, oklch(92.3% 0.003 48.717) 80%, transparent);
@supports (color: color-mix(in lab, red, red)) {
border-color: color-mix(in oklab, var(--color-stone-200) 80%, transparent);
}
}
.border-sun\/35 {
border-color: color-mix(in srgb, #ffd23f 35%, transparent);
@supports (color: color-mix(in lab, red, red)) {
border-color: color-mix(in oklab, var(--color-sun) 35%, transparent);
}
}
.bg-cream {
background-color: var(--color-cream);
}
.bg-cream\/90 {
background-color: color-mix(in srgb, #fffbea 90%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-cream) 90%, transparent);
}
}
.bg-ink {
background-color: var(--color-ink);
}
.bg-stone-100 {
background-color: var(--color-stone-100);
}
.bg-stone-100\/60 {
background-color: color-mix(in srgb, oklch(97% 0.001 106.424) 60%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-stone-100) 60%, transparent);
}
}
.bg-sun {
background-color: var(--color-sun);
}
.bg-sun\/10 {
background-color: color-mix(in srgb, #ffd23f 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-sun) 10%, transparent);
}
}
.bg-white {
background-color: var(--color-white);
}
.bg-white\/5 {
background-color: color-mix(in srgb, #fff 5%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
}
}
.p-4 {
padding: calc(var(--spacing) * 4);
}
.p-7 {
padding: calc(var(--spacing) * 7);
}
.p-8 {
padding: calc(var(--spacing) * 8);
}
.px-3 {
padding-inline: calc(var(--spacing) * 3);
}
.px-3\.5 {
padding-inline: calc(var(--spacing) * 3.5);
}
.px-4 {
padding-inline: calc(var(--spacing) * 4);
}
.px-5 {
padding-inline: calc(var(--spacing) * 5);
}
.px-6 {
padding-inline: calc(var(--spacing) * 6);
}
.px-7 {
padding-inline: calc(var(--spacing) * 7);
}
.px-\[0\.16em\] {
padding-inline: 0.16em;
}
.py-1 {
padding-block: var(--spacing);
}
.py-1\.5 {
padding-block: calc(var(--spacing) * 1.5);
}
.py-2\.5 {
padding-block: calc(var(--spacing) * 2.5);
}
.py-3 {
padding-block: calc(var(--spacing) * 3);
}
.py-3\.5 {
padding-block: calc(var(--spacing) * 3.5);
}
.py-5 {
padding-block: calc(var(--spacing) * 5);
}
.py-8 {
padding-block: calc(var(--spacing) * 8);
}
.py-12 {
padding-block: calc(var(--spacing) * 12);
}
.py-14 {
padding-block: calc(var(--spacing) * 14);
}
.py-20 {
padding-block: calc(var(--spacing) * 20);
}
.pt-5 {
padding-top: calc(var(--spacing) * 5);
}
.pt-9 {
padding-top: calc(var(--spacing) * 9);
}
.pt-10 {
padding-top: calc(var(--spacing) * 10);
}
.pr-3 {
padding-right: calc(var(--spacing) * 3);
}
.pr-7 {
padding-right: calc(var(--spacing) * 7);
}
.pb-14 {
padding-bottom: calc(var(--spacing) * 14);
}
.pb-\[0\.06em\] {
padding-bottom: 0.06em;
}
.pl-7 {
padding-left: calc(var(--spacing) * 7);
}
.text-center {
text-align: center;
}
.text-left {
text-align: left;
}
.font-display {
font-family: var(--font-display);
}
.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-base {
font-size: var(--text-base);
line-height: var(--tw-leading, var(--text-base--line-height));
}
.text-lg {
font-size: var(--text-lg);
line-height: var(--tw-leading, var(--text-lg--line-height));
}
.text-sm {
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
}
.text-xl {
font-size: var(--text-xl);
line-height: var(--tw-leading, var(--text-xl--line-height));
}
.text-xs {
font-size: var(--text-xs);
line-height: var(--tw-leading, var(--text-xs--line-height));
}
.text-\[0\.92rem\] {
font-size: 0.92rem;
}
.text-\[clamp\(2\.9rem\,14\.2vw\,4\.6rem\)\] {
font-size: clamp(2.9rem, 14.2vw, 4.6rem);
}
.leading-7 {
--tw-leading: calc(var(--spacing) * 7);
line-height: calc(var(--spacing) * 7);
}
.leading-8 {
--tw-leading: calc(var(--spacing) * 8);
line-height: calc(var(--spacing) * 8);
}
.leading-\[0\.86\] {
--tw-leading: 0.86;
line-height: 0.86;
}
.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-semibold {
--tw-font-weight: var(--font-weight-semibold);
font-weight: var(--font-weight-semibold);
}
.tracking-\[-0\.045em\] {
--tw-tracking: -0.045em;
letter-spacing: -0.045em;
}
.tracking-\[0\.14em\] {
--tw-tracking: 0.14em;
letter-spacing: 0.14em;
}
.tracking-tight {
--tw-tracking: var(--tracking-tight);
letter-spacing: var(--tracking-tight);
}
.tracking-wide {
--tw-tracking: var(--tracking-wide);
letter-spacing: var(--tracking-wide);
}
.text-balance {
text-wrap: balance;
}
.whitespace-nowrap {
white-space: nowrap;
}
.text-ink {
color: var(--color-ink);
}
.text-ink\/85 {
color: color-mix(in srgb, #17140f 85%, transparent);
@supports (color: color-mix(in lab, red, red)) {
color: color-mix(in oklab, var(--color-ink) 85%, transparent);
}
}
.text-stone-100 {
color: var(--color-stone-100);
}
.text-stone-300 {
color: var(--color-stone-300);
}
.text-stone-400 {
color: var(--color-stone-400);
}
.text-stone-500 {
color: var(--color-stone-500);
}
.text-stone-600 {
color: var(--color-stone-600);
}
.text-stone-700 {
color: var(--color-stone-700);
}
.text-stone-900 {
color: var(--color-stone-900);
}
.text-sun {
color: var(--color-sun);
}
.text-sun\/70 {
color: color-mix(in srgb, #ffd23f 70%, transparent);
@supports (color: color-mix(in lab, red, red)) {
color: color-mix(in oklab, var(--color-sun) 70%, transparent);
}
}
.text-white {
color: var(--color-white);
}
.uppercase {
text-transform: uppercase;
}
.tabular-nums {
--tw-numeric-spacing: tabular-nums;
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
}
.underline {
text-decoration-line: underline;
}
.decoration-2 {
text-decoration-thickness: 2px;
}
.underline-offset-\[6px\] {
text-underline-offset: 6px;
}
.antialiased {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.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-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-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);
}
.ring-1 {
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.ring-8 {
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(8px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.ring-cream {
--tw-ring-color: var(--color-cream);
}
.ring-stone-200 {
--tw-ring-color: var(--color-stone-200);
}
.ring-stone-200\/80 {
--tw-ring-color: color-mix(in srgb, oklch(92.3% 0.003 48.717) 80%, transparent);
@supports (color: color-mix(in lab, red, red)) {
--tw-ring-color: color-mix(in oklab, var(--color-stone-200) 80%, transparent);
}
}
.ring-stone-300 {
--tw-ring-color: var(--color-stone-300);
}
.ring-white\/10 {
--tw-ring-color: color-mix(in srgb, #fff 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
--tw-ring-color: color-mix(in oklab, var(--color-white) 10%, transparent);
}
}
.backdrop-blur {
--tw-backdrop-blur: blur(8px);
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
}
.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));
}
.duration-300 {
--tw-duration: 300ms;
transition-duration: 300ms;
}
.group-open\:rotate-45:is(:where(.group):is([open], :popover-open, :open) *) {
rotate: 45deg;
}
.group-open\:bg-sun:is(:where(.group):is([open], :popover-open, :open) *) {
background-color: var(--color-sun);
}
.group-open\:text-ink:is(:where(.group):is([open], :popover-open, :open) *) {
color: var(--color-ink);
}
@media (hover: hover) {
.group-hover\:translate-x-0\.5:is(:where(.group):hover *) {
--tw-translate-x: calc(var(--spacing) * 0.5);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
}
.marker\:hidden ::marker {
display: none;
}
.marker\:hidden::marker {
display: none;
}
.marker\:hidden ::-webkit-details-marker {
display: none;
}
.marker\:hidden::-webkit-details-marker {
display: none;
}
@media (hover: hover) {
.hover\:-translate-y-0\.5:hover {
--tw-translate-y: calc(var(--spacing) * -0.5);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.hover\:-translate-y-1:hover {
--tw-translate-y: calc(var(--spacing) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.hover\:bg-amber-200:hover {
background-color: var(--color-amber-200);
}
.hover\:bg-stone-100:hover {
background-color: var(--color-stone-100);
}
.hover\:bg-stone-800:hover {
background-color: var(--color-stone-800);
}
.hover\:text-ink:hover {
color: var(--color-ink);
}
.hover\:text-stone-700:hover {
color: var(--color-stone-700);
}
.hover\:underline:hover {
text-decoration-line: underline;
}
.hover\:decoration-sun:hover {
text-decoration-color: var(--color-sun);
}
.hover\:decoration-4:hover {
text-decoration-thickness: 4px;
}
.hover\:underline-offset-4:hover {
text-underline-offset: 4px;
}
.hover\:shadow-lg:hover {
--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);
}
.hover\:ring-sun:hover {
--tw-ring-color: var(--color-sun);
}
}
.focus-visible\:outline-2:focus-visible {
outline-style: var(--tw-outline-style);
outline-width: 2px;
}
.focus-visible\:outline-offset-2:focus-visible {
outline-offset: 2px;
}
.focus-visible\:outline-offset-4:focus-visible {
outline-offset: 4px;
}
.focus-visible\:outline-ink:focus-visible {
outline-color: var(--color-ink);
}
.focus-visible\:outline-sun:focus-visible {
outline-color: var(--color-sun);
}
@media (width < 64rem) {
.max-lg\:hidden {
display: none;
}
}
@media (width < 48rem) {
.max-md\:hidden {
display: none;
}
}
@media (width < 40rem) {
.max-sm\:hidden {
display: none;
}
}
@media (width >= 40rem) {
.sm\:inline-flex {
display: inline-flex;
}
.sm\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sm\:flex-row {
flex-direction: row;
}
.sm\:items-center {
align-items: center;
}
.sm\:px-8 {
padding-inline: calc(var(--spacing) * 8);
}
.sm\:px-12 {
padding-inline: calc(var(--spacing) * 12);
}
.sm\:py-4 {
padding-block: calc(var(--spacing) * 4);
}
.sm\:text-2xl {
font-size: var(--text-2xl);
line-height: var(--tw-leading, var(--text-2xl--line-height));
}
.sm\:text-4xl {
font-size: var(--text-4xl);
line-height: var(--tw-leading, var(--text-4xl--line-height));
}
.sm\:text-xl {
font-size: var(--text-xl);
line-height: var(--tw-leading, var(--text-xl--line-height));
}
.sm\:text-\[clamp\(4\.6rem\,10\.4vw\,8\.2rem\)\] {
font-size: clamp(4.6rem, 10.4vw, 8.2rem);
}
.sm\:leading-8 {
--tw-leading: calc(var(--spacing) * 8);
line-height: calc(var(--spacing) * 8);
}
}
@media (width >= 48rem) {
.md\:static {
position: static;
}
.md\:flex {
display: flex;
}
.md\:hidden {
display: none;
}
.md\:flex-row {
flex-direction: row;
}
.md\:items-center {
align-items: center;
}
.md\:gap-8 {
gap: calc(var(--spacing) * 8);
}
.md\:border-0 {
border-style: var(--tw-border-style);
border-width: 0px;
}
.md\:bg-transparent {
background-color: transparent;
}
.md\:p-0 {
padding: 0px;
}
.md\:px-0 {
padding-inline: 0px;
}
.md\:py-0 {
padding-block: 0px;
}
.md\:text-sm {
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
}
.md\:text-stone-600 {
color: var(--color-stone-600);
}
.md\:decoration-sun {
text-decoration-color: var(--color-sun);
}
.md\:decoration-4 {
text-decoration-thickness: 4px;
}
.md\:underline-offset-8 {
text-underline-offset: 8px;
}
.md\:shadow-none {
--tw-shadow: 0 0 #0000;
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
@media (hover: hover) {
.md\:hover\:bg-transparent:hover {
background-color: transparent;
}
.md\:hover\:underline:hover {
text-decoration-line: underline;
}
}
}
@media (width >= 64rem) {
.lg\:mt-0 {
margin-top: 0px;
}
.lg\:mt-2 {
margin-top: calc(var(--spacing) * 2);
}
.lg\:mt-7 {
margin-top: calc(var(--spacing) * 7);
}
.lg\:mt-8 {
margin-top: calc(var(--spacing) * 8);
}
.lg\:block {
display: block;
}
.lg\:grid {
display: grid;
}
.lg\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.lg\:grid-cols-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.lg\:grid-cols-\[\.8fr_1\.2fr\] {
grid-template-columns: .8fr 1.2fr;
}
.lg\:grid-cols-\[1\.1fr_\.9fr\] {
grid-template-columns: 1.1fr .9fr;
}
.lg\:items-center {
align-items: center;
}
.lg\:gap-8 {
gap: calc(var(--spacing) * 8);
}
.lg\:gap-14 {
gap: calc(var(--spacing) * 14);
}
.lg\:gap-16 {
gap: calc(var(--spacing) * 16);
}
.lg\:px-16 {
padding-inline: calc(var(--spacing) * 16);
}
.lg\:py-16 {
padding-block: calc(var(--spacing) * 16);
}
.lg\:py-20 {
padding-block: calc(var(--spacing) * 20);
}
.lg\:pt-12 {
padding-top: calc(var(--spacing) * 12);
}
.lg\:pb-20 {
padding-bottom: calc(var(--spacing) * 20);
}
}
@media (width >= 80rem) {
.xl\:absolute {
position: absolute;
}
.xl\:right-\[max\(1rem\,calc\(50\%-40\.5rem\)\)\] {
right: max(1rem, calc(50% - 40.5rem));
}
.xl\:bottom-12 {
bottom: calc(var(--spacing) * 12);
}
.xl\:mx-0 {
margin-inline: 0px;
}
.xl\:mt-0 {
margin-top: 0px;
}
.xl\:mb-0 {
margin-bottom: 0px;
}
.xl\:w-\[min\(50vw\,46rem\)\] {
width: min(50vw, 46rem);
}
.xl\:pb-40 {
padding-bottom: calc(var(--spacing) * 40);
}
.xl\:text-\[clamp\(5rem\,6\.8vw\,6\.1rem\)\] {
font-size: clamp(5rem, 6.8vw, 6.1rem);
}
}
.\[\&\.is-open\]\:flex.is-open {
display: flex;
}
.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker {
display: none;
}
}
@font-face {
font-family: "Inter";
src: url("../fonts/inter-400.woff") format("woff");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Inter";
src: url("../fonts/inter-500.woff") format("woff");
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Inter";
src: url("../fonts/inter-600.woff") format("woff");
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Inter";
src: url("../fonts/inter-700.woff") format("woff");
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Inter Display";
src: url("../fonts/inter-display-800.woff") format("woff");
font-weight: 800;
font-style: normal;
font-display: swap;
}
@layer base {
.pm, .pm *, .pm ::before, .pm ::after {
box-sizing: border-box;
margin: 0;
padding: 0;
border: 0 solid;
}
.pm {
font-family: var(--font-sans);
line-height: 1.5;
-webkit-text-size-adjust: 100%;
text-rendering: optimizeLegibility;
}
.pm h1, .pm h2, .pm h3, .pm h4 {
font-size: inherit;
font-weight: inherit;
}
.pm a {
color: inherit;
text-decoration: inherit;
}
.pm ul, .pm ol {
list-style: none;
}
.pm button {
font: inherit;
color: inherit;
background: transparent;
cursor: pointer;
text-align: inherit;
}
.pm svg {
display: block;
}
}
@layer components {
.pm .pm-bubbles {
position: absolute;
inset: 0;
z-index: 20;
pointer-events: none;
}
.pm .pm-bubble {
position: absolute;
left: var(--x);
bottom: -14%;
width: var(--s);
aspect-ratio: 1;
border-radius: 50%;
background: radial-gradient(circle at 30% 26%, rgb(255 255 255 / .95) 0 7%, rgb(255 255 255 / .24) 8% 42%, rgb(255 255 255 / .08) 72%);
box-shadow: inset 0 0 0 2px rgb(255 255 255 / .85), inset -6px -8px 14px rgb(23 20 15 / .1);
pointer-events: auto;
cursor: pointer;
animation: pm-rise var(--t) linear var(--w) infinite;
transition: scale .22s ease-out, opacity .22s ease-out;
}
.pm .pm-bubble.is-pop {
scale: 1.7;
opacity: 0;
pointer-events: none;
}
.pm .pm-marquee__track.is-running {
animation: pm-marquee 38s linear infinite;
}
.pm .pm-ribbon:hover .pm-marquee__track.is-running {
animation-play-state: paused;
}
.pm .pd {
animation: pm-peek .9s cubic-bezier(.2, .9, .25, 1) .15s both;
}
.pm .pd::before {
content: "";
position: absolute;
inset: 4% -6% 6%;
z-index: -1;
border-radius: 50%;
background: radial-gradient(closest-side, rgb(255 244 176 / .85), rgb(255 244 176 / 0));
}
.pm .pd-svg {
width: 100%;
height: auto;
overflow: visible;
}
.pm .pdi {
fill: #1a1511;
stroke: #1a1511;
stroke-linejoin: round;
}
.pm .pdi10 {
stroke-width: 10;
}
.pm .pdi12 {
stroke-width: 12;
}
.pm .pdc {
fill: none;
stroke: #ffe0c4;
stroke-linecap: round;
}
.pm .pdb {
fill: none;
stroke: #f6bd92;
}
.pm .pd-bob {
animation: pd-bob 3s ease-in-out infinite;
}
.pm .pd-dog-golden .pd-head {
animation: pd-tilt-a 3s ease-in-out infinite;
}
.pm .pd-dog-frenchie .pd-head {
animation: pd-tilt-b 3s ease-in-out infinite;
}
.pm .pd-dog-dachshund .pd-head {
animation: pd-tilt-c 3s ease-in-out infinite;
}
.pm .pd-eye {
animation: pd-blink 3s infinite;
translate: var(--ex, 0px) var(--ey, 0px);
transition: translate .14s ease-out;
}
.pm .pd-dog-frenchie .pd-eye {
animation-delay: -1.1s;
}
.pm .pd-dog-dachshund .pd-eye {
animation-delay: -2s;
}
.pm .pd-dog-golden .pd-ear {
animation: pd-wig 1.5s ease-in-out infinite;
}
.pm .pd-dog-frenchie .pd-ear {
animation: pd-wig 1.5s ease-in-out -.5s infinite;
}
.pm .pd-dog-dachshund .pd-ear {
animation: pd-flap .5s ease-in-out infinite;
}
.pm .pd-dog-golden .pd-tongue {
animation: pd-pant 1.5s ease-in-out infinite;
}
.pm .pd-dog-frenchie .pd-tongue {
animation: pd-pant 3s ease-in-out infinite;
}
.pm .pd-dog-dachshund .pd-tongue {
animation: pd-pant 1.5s ease-in-out -.7s infinite;
}
.pm .pd-hat {
animation: pd-hat 1.5s ease-in-out infinite;
}
.pm .pd-duck {
animation: pd-duck 1.5s ease-in-out infinite;
transform-origin: 0 30px;
}
.pm .pd-dryer {
animation: pd-shake .25s linear infinite;
}
.pm .pd-wind path {
fill: none;
stroke: #fff;
stroke-width: 9;
stroke-linecap: round;
stroke-dasharray: 60 36 80 40;
animation: pd-wind .75s linear infinite;
}
.pm .pd-wind .pd-w2 {
stroke-dasharray: 90 30 40 46;
}
.pm .pd-wind .pd-w3 {
stroke-dasharray: 46 38 70 62;
}
.pm .pd-sA {
animation: pd-snip 1.5s ease-in-out infinite;
}
.pm .pd-scis {
animation: pd-scisbob 3s ease-in-out infinite;
}
.pm .pd-snip {
animation: pd-snipl 1.5s steps(1, end) infinite;
opacity: 0;
}
.pm .pd-rise {
animation: pd-rise 3s linear infinite;
}
.pm .pd-wob {
animation: pd-wob 1.5s ease-in-out infinite;
}
.pm .pd-tw {
animation: pd-tw 1.5s ease-in-out infinite;
}
.pm .pd-fall {
animation: pd-fall 3s ease-in infinite;
opacity: 0;
}
.pm .pd.is-off .pd-svg * {
animation-play-state: paused;
}
}
@keyframes pm-rise {
from {
transform: translate3d(0, 0, 0);
}
to {
transform: translate3d(0, -118svh, 0);
}
}
@keyframes pm-marquee {
from {
transform: translateX(0);
}
to {
transform: translateX(-50%);
}
}
@keyframes pm-peek {
from {
transform: translateY(14%);
opacity: 0;
}
to {
transform: none;
opacity: 1;
}
}
@keyframes pd-bob {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-6px);
}
}
@keyframes pd-tilt-a {
0%, 100% {
transform: rotate(-2deg);
}
50% {
transform: rotate(2.5deg);
}
}
@keyframes pd-tilt-b {
0%, 100% {
transform: rotate(2.5deg);
}
50% {
transform: rotate(-2.5deg);
}
}
@keyframes pd-tilt-c {
0%, 100% {
transform: rotate(2deg);
}
50% {
transform: rotate(-2.5deg);
}
}
@keyframes pd-blink {
0%, 88%, 100% {
transform: scaleY(1);
}
92% {
transform: scaleY(.08);
}
96% {
transform: scaleY(1);
}
}
@keyframes pd-flap {
0%, 100% {
transform: rotate(0);
}
50% {
transform: rotate(-7deg);
}
}
@keyframes pd-wig {
0%, 100% {
transform: rotate(0);
}
50% {
transform: rotate(-3.5deg);
}
}
@keyframes pd-pant {
0%, 100% {
transform: scaleY(1);
}
50% {
transform: scaleY(1.16);
}
}
@keyframes pd-hat {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-5px);
}
}
@keyframes pd-duck {
0%, 100% {
transform: translateY(0) rotate(-3deg);
}
50% {
transform: translateY(-7px) rotate(3deg);
}
}
@keyframes pd-shake {
0%, 100% {
transform: translate(0, 0);
}
25% {
transform: translate(2px, -1.5px);
}
50% {
transform: translate(-1.5px, 1.5px);
}
75% {
transform: translate(1.5px, 1px);
}
}
@keyframes pd-wind {
to {
stroke-dashoffset: -216;
}
}
@keyframes pd-snip {
0% {
transform: rotate(17deg);
}
14% {
transform: rotate(0);
}
28% {
transform: rotate(17deg);
}
42% {
transform: rotate(0);
}
60%, 100% {
transform: rotate(17deg);
}
}
@keyframes pd-scisbob {
0%, 100% {
transform: translate(0, 0);
}
50% {
transform: translate(-8px, 0);
}
}
@keyframes pd-snipl {
0% {
opacity: 0;
}
14% {
opacity: 1;
}
22% {
opacity: 0;
}
42% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@keyframes pd-rise {
0% {
transform: translateY(0) scale(.5);
opacity: 0;
}
12% {
opacity: 1;
transform: translateY(-24px) scale(.9);
}
86% {
opacity: 1;
}
100% {
transform: translateY(-250px) scale(1.08);
opacity: 0;
}
}
@keyframes pd-wob {
0%, 100% {
transform: translateX(-8px);
}
50% {
transform: translateX(8px);
}
}
@keyframes pd-tw {
0%, 100% {
transform: scale(.15) rotate(0);
opacity: 0;
}
50% {
transform: scale(1) rotate(25deg);
opacity: 1;
}
}
@keyframes pd-fall {
0% {
transform: translate(0, 0) rotate(0);
opacity: 0;
}
8% {
opacity: 1;
}
100% {
transform: translate(var(--dx), 230px) rotate(var(--rot));
opacity: 1;
}
}
@media (prefers-reduced-motion: reduce) {
.pm .pm-bubbles {
display: none;
}
.pm .pd, .pm .pd-svg * {
animation: none;
}
.pm .pd-rise {
opacity: 0;
}
}
.pm .pm-tier {
transition: translate .4s cubic-bezier(.2, .8, .2, 1), background-color .35s ease, color .35s ease, box-shadow .4s ease;
}
.pm .pm-tier :is(.pm-tier__name, .pm-tier__title, .pm-tier__text, .pm-tier__dt, .pm-tier__dd, .pm-tier__unit, .pm-tier__btn) {
transition: color .3s ease, background-color .3s ease;
}
.pm .pm-tier__dl > * {
transition: border-color .3s ease;
}
.pm .pm-tier:focus-within {
translate: 0 -14px;
background-color: var(--color-ink);
color: #f5f5f4;
box-shadow: 0 0 0 1px var(--color-ink), 0 30px 50px -18px rgb(23 20 15 / .45);
}
.pm .pm-tier:focus-within .pm-tier__name {
color: var(--color-sun);
}
.pm .pm-tier:focus-within .pm-tier__title, .pm .pm-tier:focus-within .pm-tier__dd {
color: #fff;
}
.pm .pm-tier:focus-within .pm-tier__text, .pm .pm-tier:focus-within .pm-tier__unit {
color: #d6d3d1;
}
.pm .pm-tier:focus-within .pm-tier__dt {
color: #e7e5e4;
}
.pm .pm-tier:focus-within .pm-tier__dl > * {
border-color: rgb(255 255 255 / .15);
}
.pm .pm-tier:focus-within .pm-tier__btn {
background-color: var(--color-sun);
color: var(--color-ink);
}
.pm .pm-tier:focus-within .pm-tier__btn:hover {
background-color: #fde68a;
}
@media (hover: hover) {
.pm .pm-tier:hover {
translate: 0 -14px;
background-color: var(--color-ink);
color: #f5f5f4;
box-shadow: 0 0 0 1px var(--color-ink), 0 30px 50px -18px rgb(23 20 15 / .45);
}
.pm .pm-tier:hover .pm-tier__name {
color: var(--color-sun);
}
.pm .pm-tier:hover .pm-tier__title, .pm .pm-tier:hover .pm-tier__dd {
color: #fff;
}
.pm .pm-tier:hover .pm-tier__text, .pm .pm-tier:hover .pm-tier__unit {
color: #d6d3d1;
}
.pm .pm-tier:hover .pm-tier__dt {
color: #e7e5e4;
}
.pm .pm-tier:hover .pm-tier__dl > * {
border-color: rgb(255 255 255 / .15);
}
.pm .pm-tier:hover .pm-tier__btn {
background-color: var(--color-sun);
color: var(--color-ink);
}
.pm .pm-tier:hover .pm-tier__btn:hover {
background-color: #fde68a;
}
}
@media (prefers-reduced-motion: reduce) {
.pm .pm-tier, .pm .pm-tier :is(.pm-tier__name, .pm-tier__title, .pm-tier__text, .pm-tier__dt, .pm-tier__dd, .pm-tier__unit, .pm-tier__btn), .pm .pm-tier__dl > * {
transition: none;
}
.pm .pm-tier:hover, .pm .pm-tier:focus-within {
translate: 0 0;
}
}
@property --tw-space-y-reverse {
syntax: "*";
inherits: false;
initial-value: 0;
}
@property --tw-divide-y-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-ordinal {
syntax: "*";
inherits: false;
}
@property --tw-slashed-zero {
syntax: "*";
inherits: false;
}
@property --tw-numeric-figure {
syntax: "*";
inherits: false;
}
@property --tw-numeric-spacing {
syntax: "*";
inherits: false;
}
@property --tw-numeric-fraction {
syntax: "*";
inherits: false;
}
@property --tw-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
syntax: "*";
inherits: false;
}
@property --tw-shadow-alpha {
syntax: "<percentage>";
inherits: false;
initial-value: 100%;
}
@property --tw-inset-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
syntax: "*";
inherits: false;
}
@property --tw-inset-shadow-alpha {
syntax: "<percentage>";
inherits: false;
initial-value: 100%;
}
@property --tw-ring-color {
syntax: "*";
inherits: false;
}
@property --tw-ring-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
syntax: "*";
inherits: false;
}
@property --tw-inset-ring-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
syntax: "*";
inherits: false;
}
@property --tw-ring-offset-width {
syntax: "<length>";
inherits: false;
initial-value: 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-backdrop-blur {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-brightness {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-contrast {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-grayscale {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-hue-rotate {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-invert {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-opacity {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-saturate {
syntax: "*";
inherits: false;
}
@property --tw-backdrop-sepia {
syntax: "*";
inherits: false;
}
@property --tw-duration {
syntax: "*";
inherits: false;
}
@property --tw-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-outline-style {
syntax: "*";
inherits: false;
initial-value: solid;
}
@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-divide-y-reverse: 0;
--tw-border-style: solid;
--tw-leading: initial;
--tw-font-weight: initial;
--tw-tracking: initial;
--tw-ordinal: initial;
--tw-slashed-zero: initial;
--tw-numeric-figure: initial;
--tw-numeric-spacing: initial;
--tw-numeric-fraction: initial;
--tw-shadow: 0 0 #0000;
--tw-shadow-color: initial;
--tw-shadow-alpha: 100%;
--tw-inset-shadow: 0 0 #0000;
--tw-inset-shadow-color: initial;
--tw-inset-shadow-alpha: 100%;
--tw-ring-color: initial;
--tw-ring-shadow: 0 0 #0000;
--tw-inset-ring-color: initial;
--tw-inset-ring-shadow: 0 0 #0000;
--tw-ring-inset: initial;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-offset-shadow: 0 0 #0000;
--tw-backdrop-blur: initial;
--tw-backdrop-brightness: initial;
--tw-backdrop-contrast: initial;
--tw-backdrop-grayscale: initial;
--tw-backdrop-hue-rotate: initial;
--tw-backdrop-invert: initial;
--tw-backdrop-opacity: initial;
--tw-backdrop-saturate: initial;
--tw-backdrop-sepia: initial;
--tw-duration: initial;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-translate-z: 0;
--tw-outline-style: solid;
}
}
}