/*
  1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
  2. Remove default margins and padding
  3. Reset all borders.
*/

*,
::after,
::before,
::backdrop,
::file-selector-button {
  box-sizing: border-box; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 2 */
  border: 0 solid; /* 3 */
}

/*
  1. Use a consistent sensible line-height in all browsers.
  2. Prevent adjustments of font size after orientation changes in iOS.
  3. Use a more readable tab size.
  4. Use the user's configured `sans` font-family by default.
  5. Use the user's configured `sans` font-feature-settings by default.
  6. Use the user's configured `sans` font-variation-settings by default.
  7. Disable tap highlights on iOS.
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  tab-size: 4; /* 3 */
  font-family: --theme(
    --default-font-family,
    ui-sans-serif,
    system-ui,
    sans-serif,
    'Apple Color Emoji',
    'Segoe UI Emoji',
    'Segoe UI Symbol',
    'Noto Color Emoji'
  ); /* 4 */
  font-feature-settings: --theme(--default-font-feature-settings, normal); /* 5 */
  font-variation-settings: --theme(--default-font-variation-settings, normal); /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
  1. Add the correct height in Firefox.
  2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
  3. Reset the default border style to a 1px solid border.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
  Add the correct text decoration in Chrome, Edge, and Safari.
*/

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

/*
  Remove the default font size and weight for headings.
*/

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

/*
  Reset links to optimize for opt-in styling instead of opt-out.
*/

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

/*
  Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
  1. Use the user's configured `mono` font-family by default.
  2. Use the user's configured `mono` font-feature-settings by default.
  3. Use the user's configured `mono` font-variation-settings by default.
  4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: --theme(
    --default-mono-font-family,
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    'Liberation Mono',
    'Courier New',
    monospace
  ); /* 1 */
  font-feature-settings: --theme(--default-mono-font-feature-settings, normal); /* 2 */
  font-variation-settings: --theme(--default-mono-font-variation-settings, normal); /* 3 */
  font-size: 1em; /* 4 */
}

/*
  Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
  Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

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

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
  1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
  2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
  3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
  Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
  Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
  Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
  Make lists unstyled by default.
*/

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

/*
  1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
  2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
      This can trigger a poorly considered lint error in some tools but is included by design.
*/

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

/*
  Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

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

/*
  1. Inherit font styles in all browsers.
  2. Remove border radius in all browsers.
  3. Remove background color in all browsers.
  4. Ensure consistent opacity for disabled states in all browsers.
*/

button,
input,
select,
optgroup,
textarea,
::file-selector-button {
  font: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  border-radius: 0; /* 2 */
  background-color: transparent; /* 3 */
  opacity: 1; /* 4 */
}

/*
  Restore default font weight.
*/

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

/*
  Restore indentation.
*/

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

/*
  Restore space after button.
*/

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

/*
  Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
*/

::placeholder {
  opacity: 1;
}

/*
  Set the default placeholder color to a semi-transparent version of the current text color in browsers that do not
  crash when using `color-mix(…)` with `currentcolor`. (https://github.com/tailwindlabs/tailwindcss/issues/17194)
*/

@supports (not (-webkit-appearance: -apple-pay-button)) /* Not Safari */ or
  (contain-intrinsic-size: 1px) /* Safari 17+ */ {
  ::placeholder {
    color: color-mix(in oklab, currentcolor 50%, transparent);
  }
}

/*
  Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
  Remove the inner padding in Chrome and Safari on macOS.
*/

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

/*
  1. Ensure date/time inputs have the same height when empty in iOS Safari.
  2. Ensure text alignment can be changed on date/time inputs in iOS Safari.
*/

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

/*
  Prevent height from changing on date/time inputs in macOS Safari when the input is set to `display: block`.
*/

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

/*
  Remove excess padding from pseudo-elements in date/time inputs to ensure consistent height across browsers.
*/

::-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;
}

/*
  Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

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

/*
  Correct the inability to style the border radius in iOS Safari.
*/

button,
input:where([type='button'], [type='reset'], [type='submit']),
::file-selector-button {
  appearance: button;
}

/*
  Correct the cursor style of increment and decrement buttons in Safari.
*/

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

/*
  Make elements with the HTML hidden attribute stay hidden by default.
*/

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

/*! tailwindcss v4.1.10 | MIT License | https://tailwindcss.com */
@layer properties;
:root, :host {
  --color-black: #000;
  --spacing: 0.25rem;
  --container-xs: 20rem;
  --container-sm: 24rem;
  --container-md: 28rem;
  --container-xl: 36rem;
  --container-2xl: 42rem;
  --container-3xl: 48rem;
  --container-4xl: 56rem;
  --container-5xl: 64rem;
  --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);
  --text-5xl: 3rem;
  --text-5xl--line-height: 1;
  --text-6xl: 3.75rem;
  --text-6xl--line-height: 1;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --tracking-tight: -0.025em;
  --tracking-normal: 0em;
  --tracking-wide: 0.025em;
  --leading-tight: 1.25;
  --leading-snug: 1.375;
  --leading-relaxed: 1.625;
  --radius-sm: 0.25rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --radius-2xl: 1rem;
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --blur-md: 12px;
  --blur-2xl: 40px;
  --blur-3xl: 64px;
  --default-transition-duration: 150ms;
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  --color-background: hsl(var(--background));
  --color-foreground: hsl(var(--foreground));
  --color-card: hsl(var(--card));
  --color-secondary: hsl(var(--secondary));
  --color-muted-foreground: hsl(var(--muted-foreground));
  --color-destructive: hsl(var(--destructive));
  --color-input: hsl(var(--input));
  --color-ring: hsl(var(--ring));
  --color-sage: hsl(var(--sage));
  --color-sage-foreground: hsl(var(--sage-foreground));
  --color-aqua: hsl(var(--aqua));
  --color-aqua-foreground: hsl(var(--aqua-foreground));
  --color-peach: hsl(var(--peach));
  --color-peach-foreground: hsl(var(--peach-foreground));
  --color-charcoal: hsl(var(--charcoal));
  --color-charcoal-foreground: hsl(var(--charcoal-foreground));
  --font-display: "Instrument Serif",Georgia,serif;
  --font-body: "PT Sans",sans-serif;
  --font-script: "Caveat",cursive;
}
.pointer-events-none {
  pointer-events: none;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.absolute {
  position: absolute;
}
.fixed {
  position: fixed;
}
.relative {
  position: relative;
}
.sticky {
  position: sticky;
}
.inset-0 {
  inset: calc(var(--spacing) * 0);
}
.inset-x-0 {
  inset-inline: calc(var(--spacing) * 0);
}
.inset-x-4 {
  inset-inline: calc(var(--spacing) * 4);
}
.inset-x-6 {
  inset-inline: calc(var(--spacing) * 6);
}
.inset-y-0 {
  inset-block: calc(var(--spacing) * 0);
}
.-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-7 {
  top: calc(var(--spacing) * -7);
}
.-top-8 {
  top: calc(var(--spacing) * -8);
}
.-top-10 {
  top: calc(var(--spacing) * -10);
}
.-top-12 {
  top: calc(var(--spacing) * -12);
}
.-top-20 {
  top: calc(var(--spacing) * -20);
}
.top-0 {
  top: calc(var(--spacing) * 0);
}
.top-1\/2 {
  top: calc(1/2 * 100%);
}
.top-1\/4 {
  top: calc(1/4 * 100%);
}
.top-2 {
  top: calc(var(--spacing) * 2);
}
.top-4 {
  top: calc(var(--spacing) * 4);
}
.top-6 {
  top: calc(var(--spacing) * 6);
}
.top-7 {
  top: calc(var(--spacing) * 7);
}
.top-8 {
  top: calc(var(--spacing) * 8);
}
.top-10 {
  top: calc(var(--spacing) * 10);
}
.top-24 {
  top: calc(var(--spacing) * 24);
}
.-right-3 {
  right: calc(var(--spacing) * -3);
}
.-right-5 {
  right: calc(var(--spacing) * -5);
}
.-right-10 {
  right: calc(var(--spacing) * -10);
}
.-right-16 {
  right: calc(var(--spacing) * -16);
}
.-right-20 {
  right: calc(var(--spacing) * -20);
}
.-right-24 {
  right: calc(var(--spacing) * -24);
}
.right-0 {
  right: calc(var(--spacing) * 0);
}
.right-2 {
  right: calc(var(--spacing) * 2);
}
.right-4 {
  right: calc(var(--spacing) * 4);
}
.right-6 {
  right: calc(var(--spacing) * 6);
}
.right-8 {
  right: calc(var(--spacing) * 8);
}
.right-10 {
  right: calc(var(--spacing) * 10);
}
.-bottom-1\.5 {
  bottom: calc(var(--spacing) * -1.5);
}
.-bottom-6 {
  bottom: calc(var(--spacing) * -6);
}
.-bottom-7 {
  bottom: calc(var(--spacing) * -7);
}
.-bottom-10 {
  bottom: calc(var(--spacing) * -10);
}
.bottom-0 {
  bottom: calc(var(--spacing) * 0);
}
.bottom-1 {
  bottom: calc(var(--spacing) * 1);
}
.bottom-2 {
  bottom: calc(var(--spacing) * 2);
}
.bottom-6 {
  bottom: calc(var(--spacing) * 6);
}
.bottom-8 {
  bottom: calc(var(--spacing) * 8);
}
.bottom-10 {
  bottom: calc(var(--spacing) * 10);
}
.bottom-24 {
  bottom: calc(var(--spacing) * 24);
}
.-left-1 {
  left: calc(var(--spacing) * -1);
}
.-left-5 {
  left: calc(var(--spacing) * -5);
}
.-left-6 {
  left: calc(var(--spacing) * -6);
}
.-left-12 {
  left: calc(var(--spacing) * -12);
}
.-left-16 {
  left: calc(var(--spacing) * -16);
}
.-left-20 {
  left: calc(var(--spacing) * -20);
}
.-left-24 {
  left: calc(var(--spacing) * -24);
}
.left-0 {
  left: calc(var(--spacing) * 0);
}
.left-1 {
  left: calc(var(--spacing) * 1);
}
.left-1\/2 {
  left: calc(1/2 * 100%);
}
.left-1\/3 {
  left: calc(1/3 * 100%);
}
.left-3 {
  left: calc(var(--spacing) * 3);
}
.left-5 {
  left: calc(var(--spacing) * 5);
}
.left-6 {
  left: calc(var(--spacing) * 6);
}
.left-8 {
  left: calc(var(--spacing) * 8);
}
.left-10 {
  left: calc(var(--spacing) * 10);
}
.left-\[0\.45rem\] {
  left: 0.45rem;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-50 {
  z-index: 50;
}
.order-1 {
  order: 1;
}
.order-2 {
  order: 2;
}
.mx-auto {
  margin-inline: auto;
}
.\!my-8 {
  margin-block: calc(var(--spacing) * 8) !important;
}
.-mt-10 {
  margin-top: calc(var(--spacing) * -10);
}
.-mt-16 {
  margin-top: calc(var(--spacing) * -16);
}
.mt-0\.5 {
  margin-top: calc(var(--spacing) * 0.5);
}
.mt-1 {
  margin-top: calc(var(--spacing) * 1);
}
.mt-1\.5 {
  margin-top: calc(var(--spacing) * 1.5);
}
.mt-2 {
  margin-top: calc(var(--spacing) * 2);
}
.mt-2\.5 {
  margin-top: calc(var(--spacing) * 2.5);
}
.mt-3 {
  margin-top: calc(var(--spacing) * 3);
}
.mt-4 {
  margin-top: calc(var(--spacing) * 4);
}
.mt-5 {
  margin-top: calc(var(--spacing) * 5);
}
.mt-6 {
  margin-top: calc(var(--spacing) * 6);
}
.mt-7 {
  margin-top: calc(var(--spacing) * 7);
}
.mt-8 {
  margin-top: calc(var(--spacing) * 8);
}
.mt-9 {
  margin-top: calc(var(--spacing) * 9);
}
.mt-10 {
  margin-top: calc(var(--spacing) * 10);
}
.mt-12 {
  margin-top: calc(var(--spacing) * 12);
}
.mt-auto {
  margin-top: auto;
}
.mb-3 {
  margin-bottom: calc(var(--spacing) * 3);
}
.mb-4 {
  margin-bottom: calc(var(--spacing) * 4);
}
.ml-6 {
  margin-left: calc(var(--spacing) * 6);
}
.ml-auto {
  margin-left: auto;
}
.block {
  display: block;
}
.flex {
  display: flex;
}
.grid {
  display: grid;
}
.hidden {
  display: none;
}
.inline-block {
  display: inline-block;
}
.inline-flex {
  display: inline-flex;
}
.aspect-\[4\/3\] {
  aspect-ratio: 4/3;
}
.aspect-\[4\/5\] {
  aspect-ratio: 4/5;
}
.aspect-\[5\/4\] {
  aspect-ratio: 5/4;
}
.aspect-\[1536\/722\] {
  aspect-ratio: 1536/722;
}
.aspect-square {
  aspect-ratio: 1 / 1;
}
.h-1\.5 {
  height: calc(var(--spacing) * 1.5);
}
.h-2 {
  height: calc(var(--spacing) * 2);
}
.h-2\.5 {
  height: calc(var(--spacing) * 2.5);
}
.h-3 {
  height: calc(var(--spacing) * 3);
}
.h-3\.5 {
  height: calc(var(--spacing) * 3.5);
}
.h-4 {
  height: calc(var(--spacing) * 4);
}
.h-5 {
  height: calc(var(--spacing) * 5);
}
.h-6 {
  height: calc(var(--spacing) * 6);
}
.h-7 {
  height: calc(var(--spacing) * 7);
}
.h-8 {
  height: calc(var(--spacing) * 8);
}
.h-10 {
  height: calc(var(--spacing) * 10);
}
.h-11 {
  height: calc(var(--spacing) * 11);
}
.h-12 {
  height: calc(var(--spacing) * 12);
}
.h-14 {
  height: calc(var(--spacing) * 14);
}
.h-16 {
  height: calc(var(--spacing) * 16);
}
.h-20 {
  height: calc(var(--spacing) * 20);
}
.h-28 {
  height: calc(var(--spacing) * 28);
}
.h-32 {
  height: calc(var(--spacing) * 32);
}
.h-40 {
  height: calc(var(--spacing) * 40);
}
.h-44 {
  height: calc(var(--spacing) * 44);
}
.h-52 {
  height: calc(var(--spacing) * 52);
}
.h-56 {
  height: calc(var(--spacing) * 56);
}
.h-64 {
  height: calc(var(--spacing) * 64);
}
.h-72 {
  height: calc(var(--spacing) * 72);
}
.h-80 {
  height: calc(var(--spacing) * 80);
}
.h-\[3px\] {
  height: 3px;
}
.h-\[4\.75rem\] {
  height: 4.75rem;
}
.h-\[14\.5rem\] {
  height: 14.5rem;
}
.h-\[212\.75\%\] {
  height: 212.75%;
}
.h-auto {
  height: auto;
}
.h-full {
  height: 100%;
}
.h-px {
  height: 1px;
}
.min-h-0 {
  min-height: calc(var(--spacing) * 0);
}
.min-h-11 {
  min-height: calc(var(--spacing) * 11);
}
.min-h-\[2\.2rem\] {
  min-height: 2.2rem;
}
.min-h-\[3rem\] {
  min-height: 3rem;
}
.w-1\.5 {
  width: calc(var(--spacing) * 1.5);
}
.w-2 {
  width: calc(var(--spacing) * 2);
}
.w-2\.5 {
  width: calc(var(--spacing) * 2.5);
}
.w-3 {
  width: calc(var(--spacing) * 3);
}
.w-3\.5 {
  width: calc(var(--spacing) * 3.5);
}
.w-3\/4 {
  width: calc(3/4 * 100%);
}
.w-4 {
  width: calc(var(--spacing) * 4);
}
.w-5 {
  width: calc(var(--spacing) * 5);
}
.w-6 {
  width: calc(var(--spacing) * 6);
}
.w-7 {
  width: calc(var(--spacing) * 7);
}
.w-8 {
  width: calc(var(--spacing) * 8);
}
.w-9 {
  width: calc(var(--spacing) * 9);
}
.w-10 {
  width: calc(var(--spacing) * 10);
}
.w-11 {
  width: calc(var(--spacing) * 11);
}
.w-12 {
  width: calc(var(--spacing) * 12);
}
.w-14 {
  width: calc(var(--spacing) * 14);
}
.w-16 {
  width: calc(var(--spacing) * 16);
}
.w-20 {
  width: calc(var(--spacing) * 20);
}
.w-24 {
  width: calc(var(--spacing) * 24);
}
.w-28 {
  width: calc(var(--spacing) * 28);
}
.w-32 {
  width: calc(var(--spacing) * 32);
}
.w-40 {
  width: calc(var(--spacing) * 40);
}
.w-44 {
  width: calc(var(--spacing) * 44);
}
.w-48 {
  width: calc(var(--spacing) * 48);
}
.w-52 {
  width: calc(var(--spacing) * 52);
}
.w-56 {
  width: calc(var(--spacing) * 56);
}
.w-64 {
  width: calc(var(--spacing) * 64);
}
.w-72 {
  width: calc(var(--spacing) * 72);
}
.w-80 {
  width: calc(var(--spacing) * 80);
}
.w-\[14rem\] {
  width: 14rem;
}
.w-auto {
  width: auto;
}
.w-fit {
  width: fit-content;
}
.w-full {
  width: 100%;
}
.w-px {
  width: 1px;
}
.max-w-2xl {
  max-width: var(--container-2xl);
}
.max-w-3xl {
  max-width: var(--container-3xl);
}
.max-w-4xl {
  max-width: var(--container-4xl);
}
.max-w-5xl {
  max-width: var(--container-5xl);
}
.max-w-6xl {
  max-width: var(--container-6xl);
}
.max-w-7xl {
  max-width: var(--container-7xl);
}
.max-w-\[12rem\] {
  max-width: 12rem;
}
.max-w-\[13rem\] {
  max-width: 13rem;
}
.max-w-\[14rem\] {
  max-width: 14rem;
}
.max-w-\[16rem\] {
  max-width: 16rem;
}
.max-w-\[20rem\] {
  max-width: 20rem;
}
.max-w-\[22rem\] {
  max-width: 22rem;
}
.max-w-\[23rem\] {
  max-width: 23rem;
}
.max-w-\[24rem\] {
  max-width: 24rem;
}
.max-w-\[150px\] {
  max-width: 150px;
}
.max-w-\[170px\] {
  max-width: 170px;
}
.max-w-\[220px\] {
  max-width: 220px;
}
.max-w-\[340px\] {
  max-width: 340px;
}
.max-w-full {
  max-width: 100%;
}
.max-w-md {
  max-width: var(--container-md);
}
.max-w-none {
  max-width: none;
}
.max-w-sm {
  max-width: var(--container-sm);
}
.max-w-xl {
  max-width: var(--container-xl);
}
.max-w-xs {
  max-width: var(--container-xs);
}
.min-w-0 {
  min-width: calc(var(--spacing) * 0);
}
.min-w-max {
  min-width: max-content;
}
.flex-1 {
  flex: 1;
}
.shrink-0 {
  flex-shrink: 0;
}
.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-2 {
  --tw-translate-y: calc(var(--spacing) * -2);
  translate: var(--tw-translate-x) var(--tw-translate-y);
}
.scale-\[1\.72\] {
  scale: 1.72;
}
.-rotate-2 {
  rotate: calc(2deg * -1);
}
.-rotate-6 {
  rotate: calc(6deg * -1);
}
.-rotate-90 {
  rotate: calc(90deg * -1);
}
.-rotate-\[0\.4deg\] {
  rotate: calc(0.4deg * -1);
}
.-rotate-\[0\.6deg\] {
  rotate: calc(0.6deg * -1);
}
.rotate-1 {
  rotate: 1deg;
}
.rotate-2 {
  rotate: 2deg;
}
.rotate-180 {
  rotate: 180deg;
}
.rotate-\[-6deg\] {
  rotate: -6deg;
}
.rotate-\[0\.5deg\] {
  rotate: 0.5deg;
}
.rotate-\[18deg\] {
  rotate: 18deg;
}
.cursor-pointer {
  cursor: pointer;
}
.resize-y {
  resize: vertical;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.flex-col {
  flex-direction: column;
}
.flex-col-reverse {
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.items-baseline {
  align-items: baseline;
}
.items-center {
  align-items: center;
}
.items-start {
  align-items: flex-start;
}
.justify-between {
  justify-content: space-between;
}
.justify-center {
  justify-content: center;
}
.gap-1 {
  gap: calc(var(--spacing) * 1);
}
.gap-1\.5 {
  gap: calc(var(--spacing) * 1.5);
}
.gap-2 {
  gap: calc(var(--spacing) * 2);
}
.gap-2\.5 {
  gap: calc(var(--spacing) * 2.5);
}
.gap-3 {
  gap: calc(var(--spacing) * 3);
}
.gap-4 {
  gap: calc(var(--spacing) * 4);
}
.gap-5 {
  gap: calc(var(--spacing) * 5);
}
.gap-6 {
  gap: calc(var(--spacing) * 6);
}
.gap-7 {
  gap: calc(var(--spacing) * 7);
}
.gap-8 {
  gap: calc(var(--spacing) * 8);
}
.gap-10 {
  gap: calc(var(--spacing) * 10);
}
.space-y-1 {
  :where(& > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
  }
}
.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-2\.5 {
  :where(& > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)));
  }
}
.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-5 {
  :where(& > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
  }
}
.gap-x-4 {
  column-gap: calc(var(--spacing) * 4);
}
.gap-x-6 {
  column-gap: calc(var(--spacing) * 6);
}
.gap-x-7 {
  column-gap: calc(var(--spacing) * 7);
}
.gap-x-8 {
  column-gap: calc(var(--spacing) * 8);
}
.gap-x-10 {
  column-gap: calc(var(--spacing) * 10);
}
.gap-x-12 {
  column-gap: calc(var(--spacing) * 12);
}
.gap-y-0 {
  row-gap: calc(var(--spacing) * 0);
}
.gap-y-1 {
  row-gap: calc(var(--spacing) * 1);
}
.gap-y-2 {
  row-gap: calc(var(--spacing) * 2);
}
.gap-y-3 {
  row-gap: calc(var(--spacing) * 3);
}
.gap-y-4 {
  row-gap: calc(var(--spacing) * 4);
}
.gap-y-6 {
  row-gap: calc(var(--spacing) * 6);
}
.gap-y-7 {
  row-gap: calc(var(--spacing) * 7);
}
.divide-y {
  :where(& > :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)));
  }
}
.divide-foreground\/12 {
  :where(& > :not(:last-child)) {
    border-color: color-mix(in srgb, hsl(var(--foreground)) 12%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-foreground) 12%, transparent);
    }
  }
}
.divide-foreground\/15 {
  :where(& > :not(:last-child)) {
    border-color: color-mix(in srgb, hsl(var(--foreground)) 15%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-foreground) 15%, transparent);
    }
  }
}
.self-start {
  align-self: flex-start;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-x-auto {
  overflow-x: auto;
}
.rounded-2xl {
  border-radius: var(--radius-2xl);
}
.rounded-\[1\.75rem\] {
  border-radius: 1.75rem;
}
.rounded-\[1\.75rem_2\.25rem_1\.5rem_2rem\] {
  border-radius: 1.75rem 2.25rem 1.5rem 2rem;
}
.rounded-\[2\.5rem_3\.5rem_2\.75rem_3\.25rem\] {
  border-radius: 2.5rem 3.5rem 2.75rem 3.25rem;
}
.rounded-\[2rem\] {
  border-radius: 2rem;
}
.rounded-\[42\%_58\%_44\%_56\%\/56\%_44\%_56\%_44\%\] {
  border-radius: 42% 58% 44% 56%/56% 44% 56% 44%;
}
.rounded-\[58\%_42\%_56\%_44\%\/45\%_56\%_44\%_55\%\] {
  border-radius: 58% 42% 56% 44%/45% 56% 44% 55%;
}
.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);
}
.border-\[5px\] {
  border-style: var(--tw-border-style);
  border-width: 5px;
}
.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-t-4 {
  border-top-style: var(--tw-border-style);
  border-top-width: 4px;
}
.border-r {
  border-right-style: var(--tw-border-style);
  border-right-width: 1px;
}
.border-b {
  border-bottom-style: var(--tw-border-style);
  border-bottom-width: 1px;
}
.border-l {
  border-left-style: var(--tw-border-style);
  border-left-width: 1px;
}
.border-l-2 {
  border-left-style: var(--tw-border-style);
  border-left-width: 2px;
}
.border-l-4 {
  border-left-style: var(--tw-border-style);
  border-left-width: 4px;
}
.border-dashed {
  --tw-border-style: dashed;
  border-style: dashed;
}
.border-aqua {
  border-color: var(--color-aqua);
}
.border-aqua\/60 {
  border-color: color-mix(in srgb, hsl(var(--aqua)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-aqua) 60%, transparent);
  }
}
.border-card {
  border-color: var(--color-card);
}
.border-charcoal-foreground\/20 {
  border-color: color-mix(in srgb, hsl(var(--charcoal-foreground)) 20%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-charcoal-foreground) 20%, transparent);
  }
}
.border-foreground\/10 {
  border-color: color-mix(in srgb, hsl(var(--foreground)) 10%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-foreground) 10%, transparent);
  }
}
.border-foreground\/12 {
  border-color: color-mix(in srgb, hsl(var(--foreground)) 12%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-foreground) 12%, transparent);
  }
}
.border-foreground\/15 {
  border-color: color-mix(in srgb, hsl(var(--foreground)) 15%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-foreground) 15%, transparent);
  }
}
.border-foreground\/20 {
  border-color: color-mix(in srgb, hsl(var(--foreground)) 20%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-foreground) 20%, transparent);
  }
}
.border-foreground\/25 {
  border-color: color-mix(in srgb, hsl(var(--foreground)) 25%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-foreground) 25%, transparent);
  }
}
.border-input {
  border-color: var(--color-input);
}
.border-peach {
  border-color: var(--color-peach);
}
.border-peach\/60 {
  border-color: color-mix(in srgb, hsl(var(--peach)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-peach) 60%, transparent);
  }
}
.border-sage {
  border-color: var(--color-sage);
}
.border-sage\/60 {
  border-color: color-mix(in srgb, hsl(var(--sage)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in oklab, var(--color-sage) 60%, transparent);
  }
}
.border-l-aqua {
  border-left-color: var(--color-aqua);
}
.border-l-peach {
  border-left-color: var(--color-peach);
}
.border-l-sage {
  border-left-color: var(--color-sage);
}
.bg-\[\#F1F1EF\] {
  background-color: #F1F1EF;
}
.bg-\[\#f4dec7\] {
  background-color: #f4dec7;
}
.bg-aqua {
  background-color: var(--color-aqua);
}
.bg-aqua-foreground {
  background-color: var(--color-aqua-foreground);
}
.bg-aqua\/20 {
  background-color: color-mix(in srgb, hsl(var(--aqua)) 20%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-aqua) 20%, transparent);
  }
}
.bg-aqua\/25 {
  background-color: color-mix(in srgb, hsl(var(--aqua)) 25%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-aqua) 25%, transparent);
  }
}
.bg-aqua\/30 {
  background-color: color-mix(in srgb, hsl(var(--aqua)) 30%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-aqua) 30%, transparent);
  }
}
.bg-aqua\/35 {
  background-color: color-mix(in srgb, hsl(var(--aqua)) 35%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-aqua) 35%, transparent);
  }
}
.bg-aqua\/40 {
  background-color: color-mix(in srgb, hsl(var(--aqua)) 40%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-aqua) 40%, transparent);
  }
}
.bg-aqua\/45 {
  background-color: color-mix(in srgb, hsl(var(--aqua)) 45%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-aqua) 45%, transparent);
  }
}
.bg-aqua\/50 {
  background-color: color-mix(in srgb, hsl(var(--aqua)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-aqua) 50%, transparent);
  }
}
.bg-background {
  background-color: var(--color-background);
}
.bg-background\/50 {
  background-color: color-mix(in srgb, hsl(var(--background)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-background) 50%, transparent);
  }
}
.bg-background\/90 {
  background-color: color-mix(in srgb, hsl(var(--background)) 90%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-background) 90%, transparent);
  }
}
.bg-black\/80 {
  background-color: color-mix(in srgb, #000 80%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-black) 80%, transparent);
  }
}
.bg-card {
  background-color: var(--color-card);
}
.bg-charcoal {
  background-color: var(--color-charcoal);
}
.bg-charcoal\/20 {
  background-color: color-mix(in srgb, hsl(var(--charcoal)) 20%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-charcoal) 20%, transparent);
  }
}
.bg-foreground\/15 {
  background-color: color-mix(in srgb, hsl(var(--foreground)) 15%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-foreground) 15%, transparent);
  }
}
.bg-foreground\/25 {
  background-color: color-mix(in srgb, hsl(var(--foreground)) 25%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-foreground) 25%, transparent);
  }
}
.bg-peach {
  background-color: var(--color-peach);
}
.bg-peach-foreground {
  background-color: var(--color-peach-foreground);
}
.bg-peach\/30 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 30%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 30%, transparent);
  }
}
.bg-peach\/35 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 35%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 35%, transparent);
  }
}
.bg-peach\/40 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 40%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 40%, transparent);
  }
}
.bg-peach\/45 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 45%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 45%, transparent);
  }
}
.bg-peach\/50 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 50%, transparent);
  }
}
.bg-peach\/55 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 55%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 55%, transparent);
  }
}
.bg-peach\/60 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 60%, transparent);
  }
}
.bg-peach\/70 {
  background-color: color-mix(in srgb, hsl(var(--peach)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-peach) 70%, transparent);
  }
}
.bg-sage {
  background-color: var(--color-sage);
}
.bg-sage-foreground {
  background-color: var(--color-sage-foreground);
}
.bg-sage\/20 {
  background-color: color-mix(in srgb, hsl(var(--sage)) 20%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-sage) 20%, transparent);
  }
}
.bg-sage\/25 {
  background-color: color-mix(in srgb, hsl(var(--sage)) 25%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-sage) 25%, transparent);
  }
}
.bg-sage\/30 {
  background-color: color-mix(in srgb, hsl(var(--sage)) 30%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-sage) 30%, transparent);
  }
}
.bg-sage\/35 {
  background-color: color-mix(in srgb, hsl(var(--sage)) 35%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-sage) 35%, transparent);
  }
}
.bg-sage\/40 {
  background-color: color-mix(in srgb, hsl(var(--sage)) 40%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-sage) 40%, transparent);
  }
}
.bg-sage\/45 {
  background-color: color-mix(in srgb, hsl(var(--sage)) 45%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-sage) 45%, transparent);
  }
}
.bg-sage\/50 {
  background-color: color-mix(in srgb, hsl(var(--sage)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-sage) 50%, transparent);
  }
}
.bg-secondary\/40 {
  background-color: color-mix(in srgb, hsl(var(--secondary)) 40%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-secondary) 40%, transparent);
  }
}
.bg-secondary\/50 {
  background-color: color-mix(in srgb, hsl(var(--secondary)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-secondary) 50%, transparent);
  }
}
.bg-secondary\/60 {
  background-color: color-mix(in srgb, hsl(var(--secondary)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    background-color: color-mix(in oklab, var(--color-secondary) 60%, transparent);
  }
}
.bg-transparent {
  background-color: transparent;
}
.object-contain {
  object-fit: contain;
}
.object-cover {
  object-fit: cover;
}
.object-top {
  object-position: top;
}
.p-1\.5 {
  padding: calc(var(--spacing) * 1.5);
}
.p-2 {
  padding: calc(var(--spacing) * 2);
}
.p-3 {
  padding: calc(var(--spacing) * 3);
}
.p-3\.5 {
  padding: calc(var(--spacing) * 3.5);
}
.p-4 {
  padding: calc(var(--spacing) * 4);
}
.p-5 {
  padding: calc(var(--spacing) * 5);
}
.p-6 {
  padding: calc(var(--spacing) * 6);
}
.p-8 {
  padding: calc(var(--spacing) * 8);
}
.px-1 {
  padding-inline: calc(var(--spacing) * 1);
}
.px-2\.5 {
  padding-inline: calc(var(--spacing) * 2.5);
}
.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-11 {
  padding-inline: calc(var(--spacing) * 11);
}
.py-0\.5 {
  padding-block: calc(var(--spacing) * 0.5);
}
.py-1 {
  padding-block: calc(var(--spacing) * 1);
}
.py-2 {
  padding-block: calc(var(--spacing) * 2);
}
.py-2\.5 {
  padding-block: calc(var(--spacing) * 2.5);
}
.py-3 {
  padding-block: calc(var(--spacing) * 3);
}
.py-4 {
  padding-block: calc(var(--spacing) * 4);
}
.py-5 {
  padding-block: calc(var(--spacing) * 5);
}
.py-6 {
  padding-block: calc(var(--spacing) * 6);
}
.py-7 {
  padding-block: calc(var(--spacing) * 7);
}
.py-8 {
  padding-block: calc(var(--spacing) * 8);
}
.py-9 {
  padding-block: calc(var(--spacing) * 9);
}
.py-10 {
  padding-block: calc(var(--spacing) * 10);
}
.py-11 {
  padding-block: calc(var(--spacing) * 11);
}
.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-0 {
  padding-top: calc(var(--spacing) * 0);
}
.pt-1 {
  padding-top: calc(var(--spacing) * 1);
}
.pt-1\.5 {
  padding-top: calc(var(--spacing) * 1.5);
}
.pt-2 {
  padding-top: calc(var(--spacing) * 2);
}
.pt-4 {
  padding-top: calc(var(--spacing) * 4);
}
.pt-5 {
  padding-top: calc(var(--spacing) * 5);
}
.pt-6 {
  padding-top: calc(var(--spacing) * 6);
}
.pt-7 {
  padding-top: calc(var(--spacing) * 7);
}
.pt-8 {
  padding-top: calc(var(--spacing) * 8);
}
.pt-10 {
  padding-top: calc(var(--spacing) * 10);
}
.pt-\[76px\] {
  padding-top: 76px;
}
.pr-2 {
  padding-right: calc(var(--spacing) * 2);
}
.pr-5 {
  padding-right: calc(var(--spacing) * 5);
}
.pr-10 {
  padding-right: calc(var(--spacing) * 10);
}
.pb-2 {
  padding-bottom: calc(var(--spacing) * 2);
}
.pb-3 {
  padding-bottom: calc(var(--spacing) * 3);
}
.pb-4 {
  padding-bottom: calc(var(--spacing) * 4);
}
.pb-6 {
  padding-bottom: calc(var(--spacing) * 6);
}
.pb-7 {
  padding-bottom: calc(var(--spacing) * 7);
}
.pb-8 {
  padding-bottom: calc(var(--spacing) * 8);
}
.pb-10 {
  padding-bottom: calc(var(--spacing) * 10);
}
.pb-14 {
  padding-bottom: calc(var(--spacing) * 14);
}
.pb-16 {
  padding-bottom: calc(var(--spacing) * 16);
}
.pl-4 {
  padding-left: calc(var(--spacing) * 4);
}
.pl-5 {
  padding-left: calc(var(--spacing) * 5);
}
.pl-6 {
  padding-left: calc(var(--spacing) * 6);
}
.text-center {
  text-align: center;
}
.font-body {
  font-family: var(--font-body);
}
.font-display {
  font-family: var(--font-display);
}
.font-script {
  font-family: var(--font-script);
}
.text-2xl {
  font-size: var(--text-2xl);
  line-height: var(--tw-leading, var(--text-2xl--line-height));
}
.text-3xl {
  font-size: var(--text-3xl);
  line-height: var(--tw-leading, var(--text-3xl--line-height));
}
.text-4xl {
  font-size: var(--text-4xl);
  line-height: var(--tw-leading, var(--text-4xl--line-height));
}
.text-5xl {
  font-size: var(--text-5xl);
  line-height: var(--tw-leading, var(--text-5xl--line-height));
}
.text-base {
  font-size: var(--text-base);
  line-height: var(--tw-leading, var(--text-base--line-height));
}
.text-lg {
  font-size: var(--text-lg);
  line-height: var(--tw-leading, var(--text-lg--line-height));
}
.text-sm {
  font-size: var(--text-sm);
  line-height: var(--tw-leading, var(--text-sm--line-height));
}
.text-xl {
  font-size: var(--text-xl);
  line-height: var(--tw-leading, var(--text-xl--line-height));
}
.text-xs {
  font-size: var(--text-xs);
  line-height: var(--tw-leading, var(--text-xs--line-height));
}
.text-\[0\.7rem\] {
  font-size: 0.7rem;
}
.text-\[0\.8rem\] {
  font-size: 0.8rem;
}
.text-\[0\.9rem\] {
  font-size: 0.9rem;
}
.text-\[0\.65rem\] {
  font-size: 0.65rem;
}
.text-\[0\.85rem\] {
  font-size: 0.85rem;
}
.text-\[0\.95rem\] {
  font-size: 0.95rem;
}
.text-\[1\.9rem\] {
  font-size: 1.9rem;
}
.text-\[1\.59rem\] {
  font-size: 1.59rem;
}
.text-\[1\.125rem\] {
  font-size: 1.125rem;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-\[22px\] {
  font-size: 22px;
}
.text-\[clamp\(1\.7rem\,3\.4vw\,2\.6rem\)\] {
  font-size: clamp(1.7rem, 3.4vw, 2.6rem);
}
.text-\[clamp\(1\.55rem\,3\.1vw\,2\.3rem\)\] {
  font-size: clamp(1.55rem, 3.1vw, 2.3rem);
}
.text-\[clamp\(2\.5rem\,7vw\,6rem\)\] {
  font-size: clamp(2.5rem, 7vw, 6rem);
}
.text-\[clamp\(2rem\,6vw\,5rem\)\] {
  font-size: clamp(2rem, 6vw, 5rem);
}
.leading-\[0\] {
  --tw-leading: 0;
  line-height: 0;
}
.leading-\[1\.0\] {
  --tw-leading: 1.0;
  line-height: 1.0;
}
.leading-\[1\.1\] {
  --tw-leading: 1.1;
  line-height: 1.1;
}
.leading-\[1\.02\] {
  --tw-leading: 1.02;
  line-height: 1.02;
}
.leading-\[1\.3\] {
  --tw-leading: 1.3;
  line-height: 1.3;
}
.leading-\[1\.05\] {
  --tw-leading: 1.05;
  line-height: 1.05;
}
.leading-\[1\.08\] {
  --tw-leading: 1.08;
  line-height: 1.08;
}
.leading-\[1\.15\] {
  --tw-leading: 1.15;
  line-height: 1.15;
}
.leading-none {
  --tw-leading: 1;
  line-height: 1;
}
.leading-relaxed {
  --tw-leading: var(--leading-relaxed);
  line-height: var(--leading-relaxed);
}
.leading-snug {
  --tw-leading: var(--leading-snug);
  line-height: var(--leading-snug);
}
.leading-tight {
  --tw-leading: var(--leading-tight);
  line-height: var(--leading-tight);
}
.font-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);
}
.font-semibold {
  --tw-font-weight: var(--font-weight-semibold);
  font-weight: var(--font-weight-semibold);
}
.tracking-\[0\.1em\] {
  --tw-tracking: 0.1em;
  letter-spacing: 0.1em;
}
.tracking-\[0\.08em\] {
  --tw-tracking: 0.08em;
  letter-spacing: 0.08em;
}
.tracking-\[0\.12em\] {
  --tw-tracking: 0.12em;
  letter-spacing: 0.12em;
}
.tracking-\[0\.14em\] {
  --tw-tracking: 0.14em;
  letter-spacing: 0.14em;
}
.tracking-\[0\.16em\] {
  --tw-tracking: 0.16em;
  letter-spacing: 0.16em;
}
.tracking-\[0\.18em\] {
  --tw-tracking: 0.18em;
  letter-spacing: 0.18em;
}
.tracking-normal {
  --tw-tracking: var(--tracking-normal);
  letter-spacing: var(--tracking-normal);
}
.tracking-tight {
  --tw-tracking: var(--tracking-tight);
  letter-spacing: var(--tracking-tight);
}
.tracking-wide {
  --tw-tracking: var(--tracking-wide);
  letter-spacing: var(--tracking-wide);
}
.text-\[\#7dc7b7\] {
  color: #7dc7b7;
}
.text-\[\#87a496\] {
  color: #87a496;
}
.text-\[\#293335\] {
  color: #293335;
}
.text-\[\#f4dec7\] {
  color: #f4dec7;
}
.text-aqua {
  color: var(--color-aqua);
}
.text-aqua-foreground {
  color: var(--color-aqua-foreground);
}
.text-aqua-foreground\/70 {
  color: color-mix(in srgb, hsl(var(--aqua-foreground)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-aqua-foreground) 70%, transparent);
  }
}
.text-aqua\/70 {
  color: color-mix(in srgb, hsl(var(--aqua)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-aqua) 70%, transparent);
  }
}
.text-aqua\/80 {
  color: color-mix(in srgb, hsl(var(--aqua)) 80%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-aqua) 80%, transparent);
  }
}
.text-card {
  color: var(--color-card);
}
.text-charcoal {
  color: var(--color-charcoal);
}
.text-charcoal-foreground {
  color: var(--color-charcoal-foreground);
}
.text-charcoal-foreground\/60 {
  color: color-mix(in srgb, hsl(var(--charcoal-foreground)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal-foreground) 60%, transparent);
  }
}
.text-charcoal-foreground\/70 {
  color: color-mix(in srgb, hsl(var(--charcoal-foreground)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal-foreground) 70%, transparent);
  }
}
.text-charcoal-foreground\/75 {
  color: color-mix(in srgb, hsl(var(--charcoal-foreground)) 75%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal-foreground) 75%, transparent);
  }
}
.text-charcoal-foreground\/85 {
  color: color-mix(in srgb, hsl(var(--charcoal-foreground)) 85%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal-foreground) 85%, transparent);
  }
}
.text-charcoal-foreground\/95 {
  color: color-mix(in srgb, hsl(var(--charcoal-foreground)) 95%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal-foreground) 95%, transparent);
  }
}
.text-charcoal\/30 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 30%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 30%, transparent);
  }
}
.text-charcoal\/40 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 40%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 40%, transparent);
  }
}
.text-charcoal\/55 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 55%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 55%, transparent);
  }
}
.text-charcoal\/60 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 60%, transparent);
  }
}
.text-charcoal\/65 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 65%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 65%, transparent);
  }
}
.text-charcoal\/70 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 70%, transparent);
  }
}
.text-charcoal\/80 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 80%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 80%, transparent);
  }
}
.text-charcoal\/90 {
  color: color-mix(in srgb, hsl(var(--charcoal)) 90%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-charcoal) 90%, transparent);
  }
}
.text-destructive {
  color: var(--color-destructive);
}
.text-foreground {
  color: var(--color-foreground);
}
.text-foreground\/40 {
  color: color-mix(in srgb, hsl(var(--foreground)) 40%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 40%, transparent);
  }
}
.text-foreground\/45 {
  color: color-mix(in srgb, hsl(var(--foreground)) 45%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 45%, transparent);
  }
}
.text-foreground\/50 {
  color: color-mix(in srgb, hsl(var(--foreground)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 50%, transparent);
  }
}
.text-foreground\/55 {
  color: color-mix(in srgb, hsl(var(--foreground)) 55%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 55%, transparent);
  }
}
.text-foreground\/60 {
  color: color-mix(in srgb, hsl(var(--foreground)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 60%, transparent);
  }
}
.text-foreground\/65 {
  color: color-mix(in srgb, hsl(var(--foreground)) 65%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 65%, transparent);
  }
}
.text-foreground\/70 {
  color: color-mix(in srgb, hsl(var(--foreground)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 70%, transparent);
  }
}
.text-foreground\/75 {
  color: color-mix(in srgb, hsl(var(--foreground)) 75%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 75%, transparent);
  }
}
.text-foreground\/80 {
  color: color-mix(in srgb, hsl(var(--foreground)) 80%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 80%, transparent);
  }
}
.text-foreground\/85 {
  color: color-mix(in srgb, hsl(var(--foreground)) 85%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-foreground) 85%, transparent);
  }
}
.text-muted-foreground {
  color: var(--color-muted-foreground);
}
.text-peach {
  color: var(--color-peach);
}
.text-peach-foreground {
  color: var(--color-peach-foreground);
}
.text-peach-foreground\/70 {
  color: color-mix(in srgb, hsl(var(--peach-foreground)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-peach-foreground) 70%, transparent);
  }
}
.text-peach-foreground\/75 {
  color: color-mix(in srgb, hsl(var(--peach-foreground)) 75%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-peach-foreground) 75%, transparent);
  }
}
.text-peach\/70 {
  color: color-mix(in srgb, hsl(var(--peach)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-peach) 70%, transparent);
  }
}
.text-sage {
  color: var(--color-sage);
}
.text-sage-foreground {
  color: var(--color-sage-foreground);
}
.text-sage-foreground\/60 {
  color: color-mix(in srgb, hsl(var(--sage-foreground)) 60%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-sage-foreground) 60%, transparent);
  }
}
.text-sage-foreground\/70 {
  color: color-mix(in srgb, hsl(var(--sage-foreground)) 70%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-sage-foreground) 70%, transparent);
  }
}
.text-sage-foreground\/75 {
  color: color-mix(in srgb, hsl(var(--sage-foreground)) 75%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-sage-foreground) 75%, transparent);
  }
}
.text-sage-foreground\/85 {
  color: color-mix(in srgb, hsl(var(--sage-foreground)) 85%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-sage-foreground) 85%, transparent);
  }
}
.text-sage\/80 {
  color: color-mix(in srgb, hsl(var(--sage)) 80%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in oklab, var(--color-sage) 80%, transparent);
  }
}
.normal-case {
  text-transform: none;
}
.italic {
  font-style: italic;
}
.not-italic {
  font-style: normal;
}
.decoration-aqua {
  text-decoration-color: var(--color-aqua);
}
.decoration-foreground\/25 {
  text-decoration-color: color-mix(in srgb, hsl(var(--foreground)) 25%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    text-decoration-color: color-mix(in oklab, var(--color-foreground) 25%, transparent);
  }
}
.decoration-foreground\/30 {
  text-decoration-color: color-mix(in srgb, hsl(var(--foreground)) 30%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    text-decoration-color: color-mix(in oklab, var(--color-foreground) 30%, transparent);
  }
}
.decoration-2 {
  text-decoration-thickness: 2px;
}
.decoration-\[3px\] {
  text-decoration-thickness: 3px;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.underline-offset-\[6px\] {
  text-underline-offset: 6px;
}
.accent-\[hsl\(var\(--ring\)\)\] {
  accent-color: hsl(var(--ring));
}
.opacity-0 {
  opacity: 0%;
}
.opacity-70 {
  opacity: 70%;
}
.opacity-80 {
  opacity: 80%;
}
.opacity-90 {
  opacity: 90%;
}
.opacity-100 {
  opacity: 100%;
}
.mix-blend-multiply {
  mix-blend-mode: multiply;
}
.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);
}
.ring-1 {
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.ring-2 {
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.ring-aqua {
  --tw-ring-color: var(--color-aqua);
}
.ring-aqua\/50 {
  --tw-ring-color: color-mix(in srgb, hsl(var(--aqua)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    --tw-ring-color: color-mix(in oklab, var(--color-aqua) 50%, transparent);
  }
}
.ring-card {
  --tw-ring-color: var(--color-card);
}
.ring-peach {
  --tw-ring-color: var(--color-peach);
}
.ring-peach\/50 {
  --tw-ring-color: color-mix(in srgb, hsl(var(--peach)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    --tw-ring-color: color-mix(in oklab, var(--color-peach) 50%, transparent);
  }
}
.ring-sage {
  --tw-ring-color: var(--color-sage);
}
.ring-sage\/50 {
  --tw-ring-color: color-mix(in srgb, hsl(var(--sage)) 50%, transparent);
  @supports (color: color-mix(in lab, red, red)) {
    --tw-ring-color: color-mix(in oklab, var(--color-sage) 50%, transparent);
  }
}
.ring-offset-background {
  --tw-ring-offset-color: var(--color-background);
}
.blur-2xl {
  --tw-blur: blur(var(--blur-2xl));
  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
}
.blur-3xl {
  --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,);
}
.backdrop-blur-md {
  --tw-backdrop-blur: blur(var(--blur-md));
  -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
}
.transition-all {
  transition-property: all;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
  transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-colors {
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
  transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
  transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-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;
}
.ease-in-out {
  --tw-ease: var(--ease-in-out);
  transition-timing-function: var(--ease-in-out);
}
.\[scrollbar-width\:none\] {
  scrollbar-width: none;
}
.group-hover\:translate-x-0\.5 {
  &:is(:where(.group):hover *) {
    @media (hover: hover) {
      --tw-translate-x: calc(var(--spacing) * 0.5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
}
.group-hover\:translate-x-1 {
  &:is(:where(.group):hover *) {
    @media (hover: hover) {
      --tw-translate-x: calc(var(--spacing) * 1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
}
.group-hover\:-translate-y-0\.5 {
  &:is(:where(.group):hover *) {
    @media (hover: hover) {
      --tw-translate-y: calc(var(--spacing) * -0.5);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
}
.group-hover\:-translate-y-1 {
  &:is(:where(.group):hover *) {
    @media (hover: hover) {
      --tw-translate-y: calc(var(--spacing) * -1);
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
  }
}
.group-hover\:decoration-foreground\/60 {
  &:is(:where(.group):hover *) {
    @media (hover: hover) {
      text-decoration-color: color-mix(in srgb, hsl(var(--foreground)) 60%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        text-decoration-color: color-mix(in oklab, var(--color-foreground) 60%, transparent);
      }
    }
  }
}
.placeholder\:text-foreground\/40 {
  &::placeholder {
    color: color-mix(in srgb, hsl(var(--foreground)) 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--color-foreground) 40%, transparent);
    }
  }
}
.last\:pb-0 {
  &:last-child {
    padding-bottom: calc(var(--spacing) * 0);
  }
}
.hover\:scale-\[1\.04\] {
  &:hover {
    @media (hover: hover) {
      scale: 1.04;
    }
  }
}
.hover\:border-ring {
  &:hover {
    @media (hover: hover) {
      border-color: var(--color-ring);
    }
  }
}
.hover\:bg-charcoal\/90 {
  &:hover {
    @media (hover: hover) {
      background-color: color-mix(in srgb, hsl(var(--charcoal)) 90%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-charcoal) 90%, transparent);
      }
    }
  }
}
.hover\:bg-foreground\/5 {
  &:hover {
    @media (hover: hover) {
      background-color: color-mix(in srgb, hsl(var(--foreground)) 5%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-foreground) 5%, transparent);
      }
    }
  }
}
.hover\:bg-peach\/70 {
  &:hover {
    @media (hover: hover) {
      background-color: color-mix(in srgb, hsl(var(--peach)) 70%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-peach) 70%, transparent);
      }
    }
  }
}
.hover\:bg-peach\/90 {
  &:hover {
    @media (hover: hover) {
      background-color: color-mix(in srgb, hsl(var(--peach)) 90%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-peach) 90%, transparent);
      }
    }
  }
}
.hover\:bg-sage\/40 {
  &:hover {
    @media (hover: hover) {
      background-color: color-mix(in srgb, hsl(var(--sage)) 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-sage) 40%, transparent);
      }
    }
  }
}
.hover\:text-aqua {
  &:hover {
    @media (hover: hover) {
      color: var(--color-aqua);
    }
  }
}
.hover\:text-charcoal-foreground {
  &:hover {
    @media (hover: hover) {
      color: var(--color-charcoal-foreground);
    }
  }
}
.hover\:text-foreground {
  &:hover {
    @media (hover: hover) {
      color: var(--color-foreground);
    }
  }
}
.hover\:text-foreground\/70 {
  &:hover {
    @media (hover: hover) {
      color: color-mix(in srgb, hsl(var(--foreground)) 70%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, var(--color-foreground) 70%, transparent);
      }
    }
  }
}
.hover\:text-foreground\/80 {
  &:hover {
    @media (hover: hover) {
      color: color-mix(in srgb, hsl(var(--foreground)) 80%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, var(--color-foreground) 80%, transparent);
      }
    }
  }
}
.hover\:text-sage-foreground\/70 {
  &:hover {
    @media (hover: hover) {
      color: color-mix(in srgb, hsl(var(--sage-foreground)) 70%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, var(--color-sage-foreground) 70%, transparent);
      }
    }
  }
}
.hover\:decoration-foreground\/60 {
  &:hover {
    @media (hover: hover) {
      text-decoration-color: color-mix(in srgb, hsl(var(--foreground)) 60%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        text-decoration-color: color-mix(in oklab, var(--color-foreground) 60%, transparent);
      }
    }
  }
}
.hover\:opacity-100 {
  &:hover {
    @media (hover: hover) {
      opacity: 100%;
    }
  }
}
.focus\:ring-2 {
  &:focus {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
}
.focus\:ring-ring {
  &:focus {
    --tw-ring-color: var(--color-ring);
  }
}
.focus\:ring-offset-2 {
  &:focus {
    --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\:outline-none {
  &:focus {
    --tw-outline-style: none;
    outline-style: none;
  }
}
.focus-visible\:border-foreground\/40 {
  &:focus-visible {
    border-color: color-mix(in srgb, hsl(var(--foreground)) 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      border-color: color-mix(in oklab, var(--color-foreground) 40%, transparent);
    }
  }
}
.focus-visible\:ring-0 {
  &:focus-visible {
    --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-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-ring {
  &:focus-visible {
    --tw-ring-color: var(--color-ring);
  }
}
.focus-visible\:outline-none {
  &:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }
}
.active\:scale-\[0\.98\] {
  &:active {
    scale: 0.98;
  }
}
.active\:scale-\[0\.99\] {
  &:active {
    scale: 0.99;
  }
}
.disabled\:pointer-events-none {
  &:disabled {
    pointer-events: none;
  }
}
.disabled\:cursor-not-allowed {
  &:disabled {
    cursor: not-allowed;
  }
}
.disabled\:opacity-60 {
  &:disabled {
    opacity: 60%;
  }
}
.data-\[state\=closed\]\:duration-300 {
  &[data-state="closed"] {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
}
.data-\[state\=open\]\:bg-secondary {
  &[data-state="open"] {
    background-color: var(--color-secondary);
  }
}
.data-\[state\=open\]\:duration-500 {
  &[data-state="open"] {
    --tw-duration: 500ms;
    transition-duration: 500ms;
  }
}
.max-md\:mb-6 {
  @media (width < 48rem) {
    margin-bottom: calc(var(--spacing) * 6);
  }
}
.sm\:block {
  @media (width >= 40rem) {
    display: block;
  }
}
.sm\:w-auto {
  @media (width >= 40rem) {
    width: auto;
  }
}
.sm\:max-w-sm {
  @media (width >= 40rem) {
    max-width: var(--container-sm);
  }
}
.sm\:flex-none {
  @media (width >= 40rem) {
    flex: none;
  }
}
.sm\:grid-cols-2 {
  @media (width >= 40rem) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.sm\:grid-cols-3 {
  @media (width >= 40rem) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.sm\:grid-cols-\[220px_1fr\] {
  @media (width >= 40rem) {
    grid-template-columns: 220px 1fr;
  }
}
.sm\:flex-row {
  @media (width >= 40rem) {
    flex-direction: row;
  }
}
.sm\:flex-wrap {
  @media (width >= 40rem) {
    flex-wrap: wrap;
  }
}
.sm\:items-center {
  @media (width >= 40rem) {
    align-items: center;
  }
}
.sm\:justify-between {
  @media (width >= 40rem) {
    justify-content: space-between;
  }
}
.sm\:justify-end {
  @media (width >= 40rem) {
    justify-content: flex-end;
  }
}
.sm\:gap-6 {
  @media (width >= 40rem) {
    gap: calc(var(--spacing) * 6);
  }
}
.sm\:gap-8 {
  @media (width >= 40rem) {
    gap: calc(var(--spacing) * 8);
  }
}
.sm\:gap-10 {
  @media (width >= 40rem) {
    gap: calc(var(--spacing) * 10);
  }
}
.sm\:gap-x-8 {
  @media (width >= 40rem) {
    column-gap: calc(var(--spacing) * 8);
  }
}
.sm\:gap-x-10 {
  @media (width >= 40rem) {
    column-gap: calc(var(--spacing) * 10);
  }
}
.sm\:space-x-2 {
  @media (width >= 40rem) {
    :where(& > :not(:last-child)) {
      --tw-space-x-reverse: 0;
      margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
      margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
    }
  }
}
.sm\:gap-y-2\.5 {
  @media (width >= 40rem) {
    row-gap: calc(var(--spacing) * 2.5);
  }
}
.sm\:gap-y-8 {
  @media (width >= 40rem) {
    row-gap: calc(var(--spacing) * 8);
  }
}
.sm\:px-6 {
  @media (width >= 40rem) {
    padding-inline: calc(var(--spacing) * 6);
  }
}
.sm\:pt-1 {
  @media (width >= 40rem) {
    padding-top: calc(var(--spacing) * 1);
  }
}
.sm\:text-left {
  @media (width >= 40rem) {
    text-align: left;
  }
}
.sm\:first\:pl-6 {
  @media (width >= 40rem) {
    &:first-child {
      padding-left: calc(var(--spacing) * 6);
    }
  }
}
.sm\:last\:pr-0 {
  @media (width >= 40rem) {
    &:last-child {
      padding-right: calc(var(--spacing) * 0);
    }
  }
}
.md\:-right-8 {
  @media (width >= 48rem) {
    right: calc(var(--spacing) * -8);
  }
}
.md\:-left-8 {
  @media (width >= 48rem) {
    left: calc(var(--spacing) * -8);
  }
}
.md\:order-1 {
  @media (width >= 48rem) {
    order: 1;
  }
}
.md\:order-2 {
  @media (width >= 48rem) {
    order: 2;
  }
}
.md\:float-left {
  @media (width >= 48rem) {
    float: left;
  }
}
.md\:float-right {
  @media (width >= 48rem) {
    float: right;
  }
}
.md\:mx-0 {
  @media (width >= 48rem) {
    margin-inline: calc(var(--spacing) * 0);
  }
}
.md\:mt-0 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 0);
  }
}
.md\:mt-3 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 3);
  }
}
.md\:mt-4 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 4);
  }
}
.md\:mt-5 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 5);
  }
}
.md\:mt-6 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 6);
  }
}
.md\:mt-8 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 8);
  }
}
.md\:mt-9 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 9);
  }
}
.md\:mt-10 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 10);
  }
}
.md\:mt-14 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 14);
  }
}
.md\:mt-20 {
  @media (width >= 48rem) {
    margin-top: calc(var(--spacing) * 20);
  }
}
.md\:mr-10 {
  @media (width >= 48rem) {
    margin-right: calc(var(--spacing) * 10);
  }
}
.md\:mb-0 {
  @media (width >= 48rem) {
    margin-bottom: calc(var(--spacing) * 0);
  }
}
.md\:mb-5 {
  @media (width >= 48rem) {
    margin-bottom: calc(var(--spacing) * 5);
  }
}
.md\:ml-10 {
  @media (width >= 48rem) {
    margin-left: calc(var(--spacing) * 10);
  }
}
.md\:ml-auto {
  @media (width >= 48rem) {
    margin-left: auto;
  }
}
.md\:block {
  @media (width >= 48rem) {
    display: block;
  }
}
.md\:flex {
  @media (width >= 48rem) {
    display: flex;
  }
}
.md\:flow-root {
  @media (width >= 48rem) {
    display: flow-root;
  }
}
.md\:grid {
  @media (width >= 48rem) {
    display: grid;
  }
}
.md\:hidden {
  @media (width >= 48rem) {
    display: none;
  }
}
.md\:h-10 {
  @media (width >= 48rem) {
    height: calc(var(--spacing) * 10);
  }
}
.md\:h-12 {
  @media (width >= 48rem) {
    height: calc(var(--spacing) * 12);
  }
}
.md\:h-14 {
  @media (width >= 48rem) {
    height: calc(var(--spacing) * 14);
  }
}
.md\:h-16 {
  @media (width >= 48rem) {
    height: calc(var(--spacing) * 16);
  }
}
.md\:h-20 {
  @media (width >= 48rem) {
    height: calc(var(--spacing) * 20);
  }
}
.md\:h-36 {
  @media (width >= 48rem) {
    height: calc(var(--spacing) * 36);
  }
}
.md\:h-44 {
  @media (width >= 48rem) {
    height: calc(var(--spacing) * 44);
  }
}
.md\:h-\[16rem\] {
  @media (width >= 48rem) {
    height: 16rem;
  }
}
.md\:h-\[18\.25rem\] {
  @media (width >= 48rem) {
    height: 18.25rem;
  }
}
.md\:h-\[74px\] {
  @media (width >= 48rem) {
    height: 74px;
  }
}
.md\:w-16 {
  @media (width >= 48rem) {
    width: calc(var(--spacing) * 16);
  }
}
.md\:w-20 {
  @media (width >= 48rem) {
    width: calc(var(--spacing) * 20);
  }
}
.md\:w-36 {
  @media (width >= 48rem) {
    width: calc(var(--spacing) * 36);
  }
}
.md\:w-40 {
  @media (width >= 48rem) {
    width: calc(var(--spacing) * 40);
  }
}
.md\:w-44 {
  @media (width >= 48rem) {
    width: calc(var(--spacing) * 44);
  }
}
.md\:w-52 {
  @media (width >= 48rem) {
    width: calc(var(--spacing) * 52);
  }
}
.md\:w-60 {
  @media (width >= 48rem) {
    width: calc(var(--spacing) * 60);
  }
}
.md\:w-\[34\%\] {
  @media (width >= 48rem) {
    width: 34%;
  }
}
.md\:w-\[38\%\] {
  @media (width >= 48rem) {
    width: 38%;
  }
}
.md\:w-\[80\%\] {
  @media (width >= 48rem) {
    width: 80%;
  }
}
.md\:w-full {
  @media (width >= 48rem) {
    width: 100%;
  }
}
.md\:max-w-\[10rem\] {
  @media (width >= 48rem) {
    max-width: 10rem;
  }
}
.md\:max-w-\[15\.5rem\] {
  @media (width >= 48rem) {
    max-width: 15.5rem;
  }
}
.md\:max-w-\[17rem\] {
  @media (width >= 48rem) {
    max-width: 17rem;
  }
}
.md\:max-w-\[19rem\] {
  @media (width >= 48rem) {
    max-width: 19rem;
  }
}
.md\:max-w-\[62rem\] {
  @media (width >= 48rem) {
    max-width: 62rem;
  }
}
.md\:max-w-\[72rem\] {
  @media (width >= 48rem) {
    max-width: 72rem;
  }
}
.md\:max-w-\[170px\] {
  @media (width >= 48rem) {
    max-width: 170px;
  }
}
.md\:max-w-\[190px\] {
  @media (width >= 48rem) {
    max-width: 190px;
  }
}
.md\:max-w-\[240px\] {
  @media (width >= 48rem) {
    max-width: 240px;
  }
}
.md\:max-w-\[260px\] {
  @media (width >= 48rem) {
    max-width: 260px;
  }
}
.md\:max-w-\[400px\] {
  @media (width >= 48rem) {
    max-width: 400px;
  }
}
.md\:max-w-md {
  @media (width >= 48rem) {
    max-width: var(--container-md);
  }
}
.md\:max-w-none {
  @media (width >= 48rem) {
    max-width: none;
  }
}
.md\:flex-1 {
  @media (width >= 48rem) {
    flex: 1;
  }
}
.md\:translate-y-0 {
  @media (width >= 48rem) {
    --tw-translate-y: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
}
.md\:-rotate-\[0\.5deg\] {
  @media (width >= 48rem) {
    rotate: calc(0.5deg * -1);
  }
}
.md\:-rotate-\[0\.7deg\] {
  @media (width >= 48rem) {
    rotate: calc(0.7deg * -1);
  }
}
.md\:-rotate-\[1\.4deg\] {
  @media (width >= 48rem) {
    rotate: calc(1.4deg * -1);
  }
}
.md\:-rotate-\[1deg\] {
  @media (width >= 48rem) {
    rotate: calc(1deg * -1);
  }
}
.md\:rotate-\[0\.6deg\] {
  @media (width >= 48rem) {
    rotate: 0.6deg;
  }
}
.md\:rotate-\[0\.7deg\] {
  @media (width >= 48rem) {
    rotate: 0.7deg;
  }
}
.md\:rotate-\[1\.5deg\] {
  @media (width >= 48rem) {
    rotate: 1.5deg;
  }
}
.md\:rotate-\[1deg\] {
  @media (width >= 48rem) {
    rotate: 1deg;
  }
}
.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-\[0\.7fr_1\.3fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 0.7fr 1.3fr;
  }
}
.md\:grid-cols-\[0\.9fr_1\.1fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 0.9fr 1.1fr;
  }
}
.md\:grid-cols-\[0\.95fr_1\.05fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 0.95fr 1.05fr;
  }
}
.md\:grid-cols-\[1\.1fr_0\.9fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.1fr 0.9fr;
  }
}
.md\:grid-cols-\[1\.2fr_0\.8fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.2fr 0.8fr;
  }
}
.md\:grid-cols-\[1\.3fr_1fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.3fr 1fr;
  }
}
.md\:grid-cols-\[1\.4fr_1fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.4fr 1fr;
  }
}
.md\:grid-cols-\[1\.05fr_0\.95fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.05fr 0.95fr;
  }
}
.md\:grid-cols-\[1\.5fr_1fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.5fr 1fr;
  }
}
.md\:grid-cols-\[1\.6fr_1fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.6fr 1fr;
  }
}
.md\:grid-cols-\[1\.55fr_1fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1.55fr 1fr;
  }
}
.md\:grid-cols-\[1fr_1\.3fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1fr 1.3fr;
  }
}
.md\:grid-cols-\[1fr_1\.25fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1fr 1.25fr;
  }
}
.md\:grid-cols-\[1fr_2\.4fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 1fr 2.4fr;
  }
}
.md\:grid-cols-\[1fr_auto\] {
  @media (width >= 48rem) {
    grid-template-columns: 1fr auto;
  }
}
.md\:grid-cols-\[65fr_30fr\] {
  @media (width >= 48rem) {
    grid-template-columns: 65fr 30fr;
  }
}
.md\:grid-cols-\[minmax\(0\,38fr\)_minmax\(0\,62fr\)\] {
  @media (width >= 48rem) {
    grid-template-columns: minmax(0,38fr) minmax(0,62fr);
  }
}
.md\:flex-row {
  @media (width >= 48rem) {
    flex-direction: row;
  }
}
.md\:flex-wrap {
  @media (width >= 48rem) {
    flex-wrap: wrap;
  }
}
.md\:items-center {
  @media (width >= 48rem) {
    align-items: center;
  }
}
.md\:items-end {
  @media (width >= 48rem) {
    align-items: flex-end;
  }
}
.md\:items-start {
  @media (width >= 48rem) {
    align-items: flex-start;
  }
}
.md\:justify-between {
  @media (width >= 48rem) {
    justify-content: space-between;
  }
}
.md\:justify-center {
  @media (width >= 48rem) {
    justify-content: center;
  }
}
.md\:justify-end {
  @media (width >= 48rem) {
    justify-content: flex-end;
  }
}
.md\:gap-4 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 4);
  }
}
.md\:gap-5 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 5);
  }
}
.md\:gap-6 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 6);
  }
}
.md\:gap-7 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 7);
  }
}
.md\:gap-8 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 8);
  }
}
.md\:gap-10 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 10);
  }
}
.md\:gap-12 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 12);
  }
}
.md\:gap-14 {
  @media (width >= 48rem) {
    gap: calc(var(--spacing) * 14);
  }
}
.md\:space-y-6 {
  @media (width >= 48rem) {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
}
.md\:gap-x-5 {
  @media (width >= 48rem) {
    column-gap: calc(var(--spacing) * 5);
  }
}
.md\:gap-x-10 {
  @media (width >= 48rem) {
    column-gap: calc(var(--spacing) * 10);
  }
}
.md\:gap-y-1 {
  @media (width >= 48rem) {
    row-gap: calc(var(--spacing) * 1);
  }
}
.md\:gap-y-6 {
  @media (width >= 48rem) {
    row-gap: calc(var(--spacing) * 6);
  }
}
.md\:self-auto {
  @media (width >= 48rem) {
    align-self: auto;
  }
}
.md\:self-start {
  @media (width >= 48rem) {
    align-self: flex-start;
  }
}
.md\:p-4 {
  @media (width >= 48rem) {
    padding: calc(var(--spacing) * 4);
  }
}
.md\:p-5 {
  @media (width >= 48rem) {
    padding: calc(var(--spacing) * 5);
  }
}
.md\:p-6 {
  @media (width >= 48rem) {
    padding: calc(var(--spacing) * 6);
  }
}
.md\:p-7 {
  @media (width >= 48rem) {
    padding: calc(var(--spacing) * 7);
  }
}
.md\:p-8 {
  @media (width >= 48rem) {
    padding: calc(var(--spacing) * 8);
  }
}
.md\:p-12 {
  @media (width >= 48rem) {
    padding: calc(var(--spacing) * 12);
  }
}
.md\:px-8 {
  @media (width >= 48rem) {
    padding-inline: calc(var(--spacing) * 8);
  }
}
.md\:py-3 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 3);
  }
}
.md\:py-5 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 5);
  }
}
.md\:py-6 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 6);
  }
}
.md\:py-7 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 7);
  }
}
.md\:py-8 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 8);
  }
}
.md\:py-9 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 9);
  }
}
.md\:py-10 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 10);
  }
}
.md\:py-12 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 12);
  }
}
.md\:py-14 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 14);
  }
}
.md\:py-16 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 16);
  }
}
.md\:py-20 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 20);
  }
}
.md\:py-32 {
  @media (width >= 48rem) {
    padding-block: calc(var(--spacing) * 32);
  }
}
.md\:pt-0 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 0);
  }
}
.md\:pt-1 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 1);
  }
}
.md\:pt-2 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 2);
  }
}
.md\:pt-5 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 5);
  }
}
.md\:pt-8 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 8);
  }
}
.md\:pt-9 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 9);
  }
}
.md\:pt-10 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 10);
  }
}
.md\:pt-12 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 12);
  }
}
.md\:pt-14 {
  @media (width >= 48rem) {
    padding-top: calc(var(--spacing) * 14);
  }
}
.md\:pt-\[84px\] {
  @media (width >= 48rem) {
    padding-top: 84px;
  }
}
.md\:pr-6 {
  @media (width >= 48rem) {
    padding-right: calc(var(--spacing) * 6);
  }
}
.md\:pb-3\.5 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 3.5);
  }
}
.md\:pb-4 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 4);
  }
}
.md\:pb-6 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 6);
  }
}
.md\:pb-8 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 8);
  }
}
.md\:pb-9 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 9);
  }
}
.md\:pb-10 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 10);
  }
}
.md\:pb-12 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 12);
  }
}
.md\:pb-14 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 14);
  }
}
.md\:pb-20 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 20);
  }
}
.md\:pb-24 {
  @media (width >= 48rem) {
    padding-bottom: calc(var(--spacing) * 24);
  }
}
.md\:pl-2 {
  @media (width >= 48rem) {
    padding-left: calc(var(--spacing) * 2);
  }
}
.md\:text-right {
  @media (width >= 48rem) {
    text-align: right;
  }
}
.md\:text-2xl {
  @media (width >= 48rem) {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
}
.md\:text-3xl {
  @media (width >= 48rem) {
    font-size: var(--text-3xl);
    line-height: var(--tw-leading, var(--text-3xl--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-6xl {
  @media (width >= 48rem) {
    font-size: var(--text-6xl);
    line-height: var(--tw-leading, var(--text-6xl--line-height));
  }
}
.md\:text-base {
  @media (width >= 48rem) {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
}
.md\:text-lg {
  @media (width >= 48rem) {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
}
.md\:text-xl {
  @media (width >= 48rem) {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }
}
.md\:text-\[1\.7rem\] {
  @media (width >= 48rem) {
    font-size: 1.7rem;
  }
}
.md\:text-\[1\.35rem\] {
  @media (width >= 48rem) {
    font-size: 1.35rem;
  }
}
.md\:text-\[1\.45rem\] {
  @media (width >= 48rem) {
    font-size: 1.45rem;
  }
}
.md\:text-\[1\.91rem\] {
  @media (width >= 48rem) {
    font-size: 1.91rem;
  }
}
.md\:text-\[2\.3rem\] {
  @media (width >= 48rem) {
    font-size: 2.3rem;
  }
}
.md\:leading-\[1\.06\] {
  @media (width >= 48rem) {
    --tw-leading: 1.06;
    line-height: 1.06;
  }
}
.lg\:block {
  @media (width >= 64rem) {
    display: block;
  }
}
.lg\:flex {
  @media (width >= 64rem) {
    display: flex;
  }
}
.lg\:hidden {
  @media (width >= 64rem) {
    display: none;
  }
}
.lg\:grid-cols-4 {
  @media (width >= 64rem) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.lg\:grid-cols-5 {
  @media (width >= 64rem) {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
.lg\:gap-16 {
  @media (width >= 64rem) {
    gap: calc(var(--spacing) * 16);
  }
}
.lg\:border-l {
  @media (width >= 64rem) {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
  }
}
.lg\:first\:border-l-0 {
  @media (width >= 64rem) {
    &:first-child {
      border-left-style: var(--tw-border-style);
      border-left-width: 0px;
    }
  }
}
.\[\&_svg\]\:h-3 {
  & svg {
    height: calc(var(--spacing) * 3);
  }
}
.\[\&_svg\]\:h-4 {
  & svg {
    height: calc(var(--spacing) * 4);
  }
}
.md\:\[\&_svg\]\:h-4 {
  @media (width >= 48rem) {
    & svg {
      height: calc(var(--spacing) * 4);
    }
  }
}
.md\:\[\&_svg\]\:h-5 {
  @media (width >= 48rem) {
    & svg {
      height: calc(var(--spacing) * 5);
    }
  }
}
.\[\&\:\:-webkit-scrollbar\]\:hidden {
  &::-webkit-scrollbar {
    display: none;
  }
}
@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-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-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-backdrop-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@property --tw-ease {
  syntax: "*";
  inherits: false;
}
@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-space-y-reverse: 0;
      --tw-divide-y-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-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-space-x-reverse: 0;
    }
  }
}

/* Original Hostinger craft styles, preserved */



@layer base {
  :root {
    --background: 80 40% 94%;
    --foreground: 190 13% 18%;
    --card: 80 40% 97%;
    --card-foreground: 190 13% 18%;
    --popover: 80 40% 97%;
    --popover-foreground: 190 13% 18%;
    --primary: 190 13% 18%;
    --primary-foreground: 80 40% 96%;
    --secondary: 80 24% 89%;
    --secondary-foreground: 190 13% 18%;
    --muted: 80 24% 89%;
    --muted-foreground: 190 8% 38%;
    --accent: 31 41% 90%;
    --accent-foreground: 190 13% 18%;
    --destructive: 0 72% 45%;
    --destructive-foreground: 0 0% 98%;
    --border: 190 10% 78%;
    --input: 190 10% 78%;
    --ring: 151 14% 45%;
    --radius: 0.5rem;
    --sage: 151 14% 59%;
    --sage-foreground: 190 13% 15%;
    --aqua: 167 40% 64%;
    --aqua-foreground: 190 13% 15%;
    --peach: 31 67% 87%;
    --peach-foreground: 190 13% 18%;
    --charcoal: 190 13% 18%;
    --charcoal-foreground: 80 40% 94%;
    --sidebar-background: 80 40% 96%;
    --sidebar-foreground: 190 13% 18%;
    --sidebar-primary: 190 13% 18%;
    --sidebar-primary-foreground: 80 40% 96%;
    --sidebar-accent: 80 24% 89%;
    --sidebar-accent-foreground: 190 13% 18%;
    --sidebar-border: 190 10% 78%;
    --sidebar-ring: 151 14% 45%;
  }
  .dark {
    --background: 190 13% 12%;
    --foreground: 80 40% 94%;
    --card: 190 13% 15%;
    --card-foreground: 80 40% 94%;
    --popover: 190 13% 15%;
    --popover-foreground: 80 40% 94%;
    --primary: 80 40% 94%;
    --primary-foreground: 190 13% 18%;
    --secondary: 190 10% 20%;
    --secondary-foreground: 80 40% 94%;
    --muted: 190 10% 20%;
    --muted-foreground: 80 12% 65%;
    --accent: 190 10% 22%;
    --accent-foreground: 80 40% 94%;
    --destructive: 0 62.8% 40%;
    --destructive-foreground: 0 0% 98%;
    --border: 190 10% 24%;
    --input: 190 10% 24%;
    --ring: 167 40% 64%;
  }
}

@layer base {
  body {
    background:hsl(var(--background));color:hsl(var(--foreground));font-family:Archivo,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased;
    overflow-x: clip;
  }
  ::selection {
    background: hsl(var(--aqua) / 0.55);
    color: hsl(var(--charcoal));
  }
}

@layer utilities {
  /* About page body copy — PT Sans Regular */
  .font-body {
    font-family: 'PT Sans', 'Archivo', ui-sans-serif, system-ui, sans-serif;
    font-weight: 400;
  }

  /* Standardised event booking button — same height, padding, font, radius site-wide */
  .btn-book {
    display:inline-flex;height:2.75rem;align-items:center;justify-content:center;border-radius:999px;background:hsl(var(--charcoal));padding:0 1.5rem;font-size:.875rem;font-weight:500;letter-spacing:.14em;color:hsl(var(--charcoal-foreground));transition:all .2s;
  }
  .marker-peach {
    background-image: linear-gradient(to top, hsl(var(--peach)) 36%, transparent 36%);
  }
  .marker-aqua {
    background-image: linear-gradient(to top, hsl(var(--aqua) / 0.6) 36%, transparent 36%);
  }
  .marker-sage {
    background-image: linear-gradient(to top, hsl(var(--sage) / 0.5) 36%, transparent 36%);
  }

  /* Cut-paper offset shadows (crafty, rigid) */
  .shadow-cut-peach {
    box-shadow: 10px 10px 0 0 hsl(var(--peach));
  }
  .shadow-cut-sage {
    box-shadow: 10px 10px 0 0 hsl(var(--sage));
  }
  .shadow-cut-aqua {
    box-shadow: 10px 10px 0 0 hsl(var(--aqua));
  }

  /* Soft tinted shadows for layered paper photos */
  .shadow-soft {
    box-shadow: 0 18px 38px -20px hsl(var(--charcoal) / 0.35);
  }
  .shadow-soft-lg {
    box-shadow: 0 34px 64px -28px hsl(var(--charcoal) / 0.38);
  }

  /* Subtle paper grain — apply to solid-colour sections so they read as paper */
  .paper-grain {
    position: relative;
    isolation: isolate;
  }
  .paper-grain::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 160px 160px;
    opacity: 0.05;
    mix-blend-mode: multiply;
    z-index: 0;
  }
  /* Organic, imperfect image crops — never rows of identical squares */
  .img-blob-a {
    border-radius: 58% 42% 56% 44% / 45% 56% 44% 55%;
  }
  .img-blob-b {
    border-radius: 42% 58% 44% 56% / 56% 44% 56% 44%;
  }
  .img-blob-c {
    border-radius: 50% 50% 42% 58% / 58% 42% 58% 42%;
  }
  .img-blob-d {
    border-radius: 63% 37% 52% 48% / 48% 58% 42% 52%;
  }

  /* Torn-paper edges via clip-path */
  .clip-torn-top {
    clip-path: polygon(0% 5%, 3% 1%, 7% 6%, 11% 2%, 15% 7%, 19% 1%, 24% 6%, 28% 2%, 33% 7%, 37% 1%, 42% 6%, 47% 2%, 52% 7%, 57% 1%, 62% 6%, 67% 2%, 72% 7%, 77% 1%, 82% 6%, 87% 2%, 92% 7%, 96% 1%, 100% 5%, 100% 100%, 0% 100%);
  }
  .clip-torn-bottom {
    clip-path: polygon(0% 0%, 100% 0%, 100% 95%, 96% 99%, 92% 94%, 87% 98%, 82% 93%, 77% 99%, 72% 94%, 67% 98%, 62% 93%, 57% 99%, 52% 94%, 47% 98%, 42% 93%, 37% 99%, 33% 94%, 28% 98%, 24% 93%, 19% 99%, 15% 94%, 11% 98%, 7% 93%, 3% 98%, 0% 95%);
  }

  /* Hand-painted brush-stroke underline for single accent words */
  .brush-peach {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 12' preserveAspectRatio='none'%3E%3Cpath d='M3 5 Q25 1 50 4 T97 5 L97 8 Q70 10 50 8 T3 7 Z' fill='%23f4dec7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0 92%;
    background-size: 100% 0.42em;
    padding-bottom: 0.06em;
  }
  .brush-sage {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 12' preserveAspectRatio='none'%3E%3Cpath d='M3 5 Q25 1 50 4 T97 5 L97 8 Q70 10 50 8 T3 7 Z' fill='%2387a496'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0 92%;
    background-size: 100% 0.42em;
    padding-bottom: 0.06em;
  }
  .brush-aqua {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 12' preserveAspectRatio='none'%3E%3Cpath d='M3 5 Q25 1 50 4 T97 5 L97 8 Q70 10 50 8 T3 7 Z' fill='%237dc7b7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0 92%;
    background-size: 100% 0.42em;
    padding-bottom: 0.06em;
  }
  .brush-charcoal {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 12' preserveAspectRatio='none'%3E%3Cpath d='M3 5 Q25 1 50 4 T97 5 L97 8 Q70 10 50 8 T3 7 Z' fill='%23293335'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0 92%;
    background-size: 100% 0.42em;
    padding-bottom: 0.06em;
  }

  /* Washi-tape scrapbook detail */
  .tape {
    background: repeating-linear-gradient(
      45deg,
      hsl(var(--aqua) / 0.55),
      hsl(var(--aqua) / 0.55) 6px,
      hsl(var(--aqua) / 0.4) 6px,
      hsl(var(--aqua) / 0.4) 12px
    );
  }
  .tape-peach {
    background: repeating-linear-gradient(
      45deg,
      hsl(var(--peach) / 0.85),
      hsl(var(--peach) / 0.85) 6px,
      hsl(var(--peach) / 0.65) 6px,
      hsl(var(--peach) / 0.65) 12px
    );
  }
  .tape-sage {
    background: repeating-linear-gradient(
      45deg,
      hsl(var(--sage) / 0.6),
      hsl(var(--sage) / 0.6) 6px,
      hsl(var(--sage) / 0.45) 6px,
      hsl(var(--sage) / 0.45) 12px
    );
  }
}

/* WordPress integration and a CSS-only mobile menu. */
#rhs-app{min-height:100vh}
#rhs-app *,#rhs-app *::before,#rhs-app *::after{box-sizing:border-box}
#rhs-app button,#rhs-app input,#rhs-app select,#rhs-app textarea{font:inherit}
#rhs-app a{text-decoration:none}
#rhs-app img{max-width:100%}
#rhs-app .rhs-sheet{position:fixed;right:0;top:0;bottom:0;z-index:100;background:hsl(var(--background));box-shadow:0 10px 40px #2224;transform:translateX(105%);visibility:hidden;transition:transform .24s,visibility .24s;padding:2rem;overflow-y:auto}
#rhs-app .rhs-sheet-open{transform:translateX(0);visibility:visible}
@media(min-width:1024px){#rhs-app .rhs-sheet{display:none}}
#rhs-app .rhs-reveal{transition:opacity .55s ease,transform .55s ease}
#rhs-app .rhs-reveal:not(.rhs-visible){opacity:0;transform:translateY(24px)}
@media(prefers-reduced-motion:reduce){#rhs-app .rhs-reveal{transition:none;opacity:1;transform:none}}
#rhs-app .btn-book:hover{background:hsl(var(--charcoal)/.9)}
#rhs-app .btn-book:active{transform:scale(.98)}
#rhs-app .font-display{font-family:'Instrument Serif',Georgia,serif}
#rhs-app .font-script{font-family:'Caveat',cursive}
#rhs-app .font-body{font-family:'PT Sans','Archivo',sans-serif}

/* v2.4 mobile navigation: drawer is portal-mounted under <body> to escape
   the sticky header's backdrop-filter containing block. */
html,body{max-width:100%;overflow-x:clip}
#rhs-app{max-width:100%;width:100%;overflow-x:clip}
#rhs-app main,#rhs-app section{max-width:100%}
#rhs-app img{max-width:100%}
.rhs-mobile-menu-backdrop{position:fixed;inset:0;z-index:2147483600;border:0;background:rgba(25,32,27,.55);cursor:pointer}
.rhs-mobile-menu-drawer{position:fixed;inset:0 0 0 auto;z-index:2147483601;width:min(88vw,380px);max-width:100%;height:100dvh;overflow-y:auto;overscroll-behavior:contain;background:hsl(var(--background,37 33% 94%));color:hsl(var(--foreground,156 11% 20%));box-shadow:-14px 0 32px #0002;padding:18px 25px 32px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
.rhs-mobile-menu-drawer.rhs-sheet-open{opacity:1;visibility:visible;pointer-events:auto}
.rhs-mobile-menu-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;font-weight:700;font-size:16px;padding:2px 0 11px;border-bottom:1px solid #7774}
.rhs-mobile-menu-close{display:grid;place-items:center;min-width:42px;min-height:42px;border:1px solid currentColor;border-radius:50%;background:transparent;color:inherit;font-size:21px;cursor:pointer}
.rhs-mobile-menu-drawer nav{display:flex!important;flex-direction:column!important;max-width:100%}
.rhs-mobile-menu-drawer nav a{display:block!important;visibility:visible!important;opacity:1!important;color:inherit!important;text-decoration:none;padding:15px 0;border-bottom:1px solid #7773;white-space:normal;overflow-wrap:anywhere}
.rhs-mobile-menu-drawer nav a:focus-visible,.rhs-mobile-menu-close:focus-visible{outline:3px solid #71958a;outline-offset:3px}
body.rhs-mobile-menu-open{overflow-y:hidden}
@media(min-width:1024px){.rhs-mobile-menu-drawer,.rhs-mobile-menu-backdrop{display:none!important}}
@media(max-width:767px){#rhs-app .max-w-7xl,#rhs-app .max-w-6xl,#rhs-app .max-w-5xl{max-width:100%}#rhs-app main :is(h1,h2,h3,p){overflow-wrap:break-word}}
@supports not (overflow:clip){html,body,#rhs-app{overflow-x:hidden}}
/* Keep even freely placed decorative shapes inside the site paint box. */
#rhs-app{position:relative;overflow-x:clip}

/* v2.7 — mobile containment. Preserve the real responsive layout rather than
   scaling the desktop canvas; constrain intrinsically oversized content. */
@media (max-width:767px) {
  html, body, body.rhs-theme {
    width:100%; max-width:100%; min-width:0; overflow-x:clip!important;
    overscroll-behavior-x:none;
  }
  #rhs-app, #rhs-app main, #rhs-app main > *,
  #rhs-app .rhs-page-layout, #rhs-app .rhs-builder-content,
  #rhs-app .rhs-section, #rhs-app .rhs-section-inner,
  #rhs-app .rhs-section-main, #rhs-app .rhs-section-items,
  #rhs-app .rhs-section-copy, #rhs-app .rhs-section-photo {
    box-sizing:border-box; max-inline-size:100%; min-inline-size:0;
  }
  #rhs-app, #rhs-app main {overflow-x:clip;}
  #rhs-app :is(img,video,canvas,iframe,embed,object) {max-inline-size:100%;}
  #rhs-app :is(h1,h2,h3,h4,h5,h6,p,blockquote,li,button,a) {
    overflow-wrap:anywhere; min-inline-size:0;
  }
  #rhs-app :is(pre,table) {max-inline-size:100%;}
  #rhs-app pre {overflow-x:auto; white-space:pre-wrap; overflow-wrap:anywhere;}
  #rhs-app :is(.grid,.flex) > * {min-inline-size:0;}
  .rhs-mobile-menu-drawer {box-sizing:border-box;max-inline-size:100dvw;
    width:min(88dvw,380px);overflow-x:hidden; overflow-wrap:anywhere;}
  .rhs-mobile-menu-drawer :is(nav,a,button) {max-inline-size:100%;}
}
@supports not (overflow:clip) {
  @media (max-width:767px) {
    html,body,body.rhs-theme,#rhs-app,#rhs-app main{overflow-x:hidden!important;}
  }
}

/* v2.8: event artwork occupies a uniform, modest preview frame; copy has priority. */
#rhs-app .rhs-event-card{grid-template-columns:minmax(0,1fr);max-width:100%;align-items:start}
#rhs-app .rhs-event-card > :first-child{min-width:0;overflow-wrap:anywhere}
#rhs-app .rhs-event-artwork-trigger{display:flex;place-items:center;justify-content:center;align-items:center;width:100%;max-width:240px;height:232px;margin:auto;overflow:hidden;border-radius:11px;background:#f6f5ee;border:1px solid #d7d8cf;cursor:zoom-in}
#rhs-app .rhs-event-artwork-img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;padding:9px;object-fit:contain;border:0}
@media(min-width:768px){#rhs-app .rhs-event-card{grid-template-columns:minmax(0,1fr) 245px}#rhs-app .rhs-event-artwork-trigger{margin:0 0 0 auto}}
#rhs-app .rhs-event-detail-artwork,#rhs-app .rhs-event-three-trees-artwork{width:min(100%,360px);max-width:360px;height:300px;max-height:300px;display:flex;align-items:center;justify-content:center;background:#f9f7f1;border:1px solid #d7d9d3;border-radius:12px;cursor:zoom-in;overflow:hidden;isolation:isolate}
#rhs-app .rhs-event-detail-img,#rhs-app .rhs-event-three-trees-img{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;padding:12px}
#rhs-app [data-rhs-event-artwork]:focus-visible{outline:3px solid #386f59;outline-offset:4px}
.rhs-event-image-dialog{position:fixed;inset:0;margin:auto;width:min(94vw,960px);max-width:94vw;max-height:94dvh;padding:0;background:#f9faf7;color:#263d33;border:1px solid #bfcfc4;border-radius:15px;box-shadow:0 24px 80px #0007;overflow:hidden;z-index:2147483610}
.rhs-event-image-dialog::backdrop{background:rgba(11,28,20,.80)}
.rhs-event-image-dialog .rhs-event-modal-header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 17px;background:#edf3ed;border-bottom:1px solid #d6e2d7}
.rhs-event-image-dialog .rhs-event-modal-header button{background:#254639;color:#fff;border:1px solid #254639;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:700}
.rhs-event-image-dialog img{display:block;max-width:100%;width:auto;height:auto;max-height:calc(94dvh - 84px);object-fit:contain;margin:auto;padding:12px}
/* These are the original CTA colours; live contrast correction also handles saved custom colours. */
#rhs-app .btn-book{background:#263c35;color:#ffffff;border:1px solid #263c35;min-height:44px;line-height:1.3;text-align:center}
#rhs-app .btn-book:hover,#rhs-app .btn-book:focus-visible{background:#182a22;color:#ffffff}
#rhs-app .rhs-event-card [class*="bg-charcoal"],#rhs-app [class*="bg-charcoal"][class*="text-charcoal-foreground"]{color:#fff}
@media(max-width:767px){#rhs-app .rhs-event-card{display:grid;grid-template-columns:minmax(0,1fr);padding:16px;gap:16px}
#rhs-app .rhs-event-artwork-trigger{height:195px;max-width:210px}#rhs-app .rhs-event-detail-artwork,#rhs-app .rhs-event-three-trees-artwork{height:245px;max-height:245px}
#rhs-app .rhs-event-card a:not(.rhs-event-artwork-trigger),#rhs-app .rhs-event-card button{max-width:100%;white-space:normal;text-align:center}}