/** Shopify CDN: Minification failed

Line 7022:15 Unexpected "{"
Line 7022:24 Expected ":"
Line 7027:15 Unexpected "{"
Line 7027:24 Expected ":"
Line 7028:15 Unexpected "{"
Line 7028:24 Expected ":"
Line 7928:0 Unexpected "<"
Line 7961:0 Unexpected "<"
Line 8305:0 Unexpected "<"
Line 8310:0 Unexpected "<"

**/
/*
! tailwindcss v3.1.8 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box;
  /* 1 */
  border-width: 0;
  /* 2 */
  border-style: solid;
  /* 2 */
  border-color: currentColor;
  /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
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.
*/

html {
  line-height: 1.5;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  /* 3 */
  tab-size: 4;
  /* 3 */
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  /* 4 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
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. Ensure horizontal rules are visible by default.
*/

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;
  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. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/*
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 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button;
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

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

:-moz-focusring {
  outline: auto;
}

/*
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;
}

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

progress {
  vertical-align: baseline;
}

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

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

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

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

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

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

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

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

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

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
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;
}

a {
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

b {
  font-weight: var(--font-body-bold-weight);
}

h1 {
  font-family: var(--font-heading-family);
  font-size: 2.5rem;
  line-height: 2.75rem;
  font-weight: var(--font-heading-weight);
  --tw-text-opacity: 1;
  color: rgb(var(--color-heading) / var(--tw-text-opacity));
}

h2 {
  font-family: var(--font-heading-family);
  font-size: 2rem;
  line-height: 2.75rem;
  font-weight: var(--font-heading-weight);
  --tw-text-opacity: 1;
  color: rgb(var(--color-heading) / var(--tw-text-opacity));
}

h3 {
  font-family: var(--font-heading-family);
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: var(--font-heading-weight);
  --tw-text-opacity: 1;
  color: rgb(var(--color-heading) / var(--tw-text-opacity));
}

h4 {
  font-family: var(--font-heading-family);
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: var(--font-heading-weight);
  --tw-text-opacity: 1;
  color: rgb(var(--color-heading) / var(--tw-text-opacity));
}

h5 {
  font-family: var(--font-heading-family);
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: var(--font-heading-weight);
  --tw-text-opacity: 1;
  color: rgb(var(--color-heading) / var(--tw-text-opacity));
}

h6 {
  font-family: var(--font-heading-family);
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: var(--font-heading-weight);
  --tw-text-opacity: 1;
  color: rgb(var(--color-heading) / var(--tw-text-opacity));
}

p {
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

s {
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

summary::-webkit-details-marker {
  display: none;
}

strong {
  font-weight: var(--font-body-bold-weight);
}

*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}

.container {
  width: 100%;
}

.\!container {
  width: 100% !important;
}

@media (min-width: 480px) {
  .container {
    max-width: 480px;
  }

  .\!container {
    max-width: 480px !important;
  }
}

@media (min-width: 568px) {
  .container {
    max-width: 568px;
  }

  .\!container {
    max-width: 568px !important;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }

  .\!container {
    max-width: 768px !important;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }

  .\!container {
    max-width: 1024px !important;
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }

  .\!container {
    max-width: 1280px !important;
  }
}

@media (min-width: 1440px) {
  .container {
    max-width: 1440px;
  }

  .\!container {
    max-width: 1440px !important;
  }
}

@media (min-width: 1520px) {
  .container {
    max-width: 1520px;
  }

  .\!container {
    max-width: 1520px !important;
  }
}

.blockquote {
  position: relative;
  padding-left: 3.75rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

.blockquote::before {
  position: absolute;
  left: 0px;
  top: 0.375rem;
  height: 1.875rem;
  width: 2.75rem;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-body-text) / var(--tw-bg-opacity));
  content: var(--tw-content);
  opacity: 0.25;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='44' height='30' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 30'%3E%3Cpath d='M7.882 30c-2.274 0-4.157-.784-5.647-2.35C.745 26.081 0 24.066 0 21.604c0-3.284.902-6.456 2.706-9.515C4.51 9.03 6.902 6.418 9.882 4.254c3.06-2.24 6.393-3.657 10-4.254l2.47 5.373c-3.058.224-5.646.97-7.764 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.234.223c.157-.074.471-.149.942-.223a6.257 6.257 0 0 1 1.647-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C12.275 29.216 10.314 30 7.882 30Zm21.647 0c-2.274 0-4.157-.784-5.647-2.35-1.49-1.568-2.235-3.583-2.235-6.045 0-3.284.902-6.456 2.706-9.515 1.804-3.06 4.196-5.672 7.176-7.836 3.06-2.24 6.393-3.657 10-4.254L44 5.373c-3.059.224-5.647.97-7.765 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.235.223c.156-.074.47-.149.94-.223a6.258 6.258 0 0 1 1.648-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C33.922 29.216 31.96 30 29.529 30Z' fill='%23000'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg width='44' height='30' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 30'%3E%3Cpath d='M7.882 30c-2.274 0-4.157-.784-5.647-2.35C.745 26.081 0 24.066 0 21.604c0-3.284.902-6.456 2.706-9.515C4.51 9.03 6.902 6.418 9.882 4.254c3.06-2.24 6.393-3.657 10-4.254l2.47 5.373c-3.058.224-5.646.97-7.764 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.234.223c.157-.074.471-.149.942-.223a6.257 6.257 0 0 1 1.647-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C12.275 29.216 10.314 30 7.882 30Zm21.647 0c-2.274 0-4.157-.784-5.647-2.35-1.49-1.568-2.235-3.583-2.235-6.045 0-3.284.902-6.456 2.706-9.515 1.804-3.06 4.196-5.672 7.176-7.836 3.06-2.24 6.393-3.657 10-4.254L44 5.373c-3.059.224-5.647.97-7.765 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.235.223c.156-.074.47-.149.94-.223a6.258 6.258 0 0 1 1.648-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C33.922 29.216 31.96 30 29.529 30Z' fill='%23000'/%3E%3C/svg%3E");
}

.button {
  display: inline-block;
  cursor: pointer;
  touch-action: manipulation;
  text-align: center;
  font-weight: var(--font-body-bold-weight);
}

.button:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.button--primary {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius-button);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-link-alt) / var(--tw-text-opacity));
}

.button--primary::before {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  transform-origin: left;
  --tw-scale-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: rgb(var(--color-link-alt) / 0.1);
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  content: var(--tw-content);
  transition-timing-function: cubic-bezier(0.6,0,0.8,0.6);
}

@media (prefers-reduced-motion: no-preference) {
  .button--primary:hover:not([aria-disabled="true"])::before {
    content: var(--tw-content);
    --tw-scale-x: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
}

.button--secondary {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius-button);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link-alt) / var(--tw-bg-opacity));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-link) / var(--tw-text-opacity));
  --tw-shadow: inset 0 0 0 2px currentColor;
  --tw-shadow-colored: inset 0 0 0 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.button--secondary::before {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  transform-origin: left;
  --tw-scale-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: rgb(var(--color-link) / 0.1);
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  content: var(--tw-content);
  transition-timing-function: cubic-bezier(0.6,0,0.8,0.6);
}

@media (prefers-reduced-motion: no-preference) {
  .button--secondary:hover:not([aria-disabled="true"])::before {
    content: var(--tw-content);
    --tw-scale-x: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
}

.button--tertiary {
  position: relative;
  --tw-text-opacity: 1;
  color: rgb(var(--color-link) / var(--tw-text-opacity));
}

.button--tertiary::before {
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  transform-origin: left;
  --tw-scale-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  border-bottom-width: 2px;
  --tw-border-opacity: 1;
  border-bottom-color: rgb(var(--color-link) / var(--tw-border-opacity));
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  content: var(--tw-content);
  transition-timing-function: cubic-bezier(0.6,0,0.8,0.6);
}

@media (prefers-reduced-motion: no-preference) {
  .button--tertiary:hover:not([aria-disabled="true"])::before {
    content: var(--tw-content);
    --tw-scale-x: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
}

.button--square {
  display: flex;
  height: 3rem;
  width: 3rem;
  align-items: center;
  justify-content: center;
  padding: 0px;
}

.inline-link {
  display: inline;
  cursor: pointer;
  --tw-text-opacity: 1;
  color: rgb(var(--color-link) / var(--tw-text-opacity));
}

.inline-link:hover {
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.inline-link:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.input-text {
  display: block;
  width: 100%;
  -webkit-appearance: none;
          appearance: none;
  border-radius: var(--border-radius-button);
  background-color: transparent;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-bottom: 0.25rem;
  padding-top: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
  --tw-shadow: inset 0 0 0 1px rgb(var(--color-body-text) / 0.5);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.input-text::placeholder {
  color: rgb(var(--color-body-text) / 0.75);
  opacity: 0;
}

.input-text:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.rte {
  overflow-wrap: break-word;
  text-align: left;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

.rte > *:last-child {
  margin-bottom: 0px;
}

.rte a {
  display: inline;
  cursor: pointer;
  --tw-text-opacity: 1;
  color: rgb(var(--color-link) / var(--tw-text-opacity));
}

.rte a:hover {
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.rte a:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.rte blockquote {
  position: relative;
  margin-bottom: 1.25rem;
  padding-left: 3.75rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

.rte blockquote::before {
  position: absolute;
  left: 0px;
  top: 0.375rem;
  height: 1.875rem;
  width: 2.75rem;
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-body-text) / var(--tw-bg-opacity));
  content: var(--tw-content);
  opacity: 0.25;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='44' height='30' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 30'%3E%3Cpath d='M7.882 30c-2.274 0-4.157-.784-5.647-2.35C.745 26.081 0 24.066 0 21.604c0-3.284.902-6.456 2.706-9.515C4.51 9.03 6.902 6.418 9.882 4.254c3.06-2.24 6.393-3.657 10-4.254l2.47 5.373c-3.058.224-5.646.97-7.764 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.234.223c.157-.074.471-.149.942-.223a6.257 6.257 0 0 1 1.647-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C12.275 29.216 10.314 30 7.882 30Zm21.647 0c-2.274 0-4.157-.784-5.647-2.35-1.49-1.568-2.235-3.583-2.235-6.045 0-3.284.902-6.456 2.706-9.515 1.804-3.06 4.196-5.672 7.176-7.836 3.06-2.24 6.393-3.657 10-4.254L44 5.373c-3.059.224-5.647.97-7.765 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.235.223c.156-.074.47-.149.94-.223a6.258 6.258 0 0 1 1.648-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C33.922 29.216 31.96 30 29.529 30Z' fill='%23000'/%3E%3C/svg%3E");
          mask-image: url("data:image/svg+xml,%3Csvg width='44' height='30' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 30'%3E%3Cpath d='M7.882 30c-2.274 0-4.157-.784-5.647-2.35C.745 26.081 0 24.066 0 21.604c0-3.284.902-6.456 2.706-9.515C4.51 9.03 6.902 6.418 9.882 4.254c3.06-2.24 6.393-3.657 10-4.254l2.47 5.373c-3.058.224-5.646.97-7.764 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.234.223c.157-.074.471-.149.942-.223a6.257 6.257 0 0 1 1.647-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C12.275 29.216 10.314 30 7.882 30Zm21.647 0c-2.274 0-4.157-.784-5.647-2.35-1.49-1.568-2.235-3.583-2.235-6.045 0-3.284.902-6.456 2.706-9.515 1.804-3.06 4.196-5.672 7.176-7.836 3.06-2.24 6.393-3.657 10-4.254L44 5.373c-3.059.224-5.647.97-7.765 2.239-2.039 1.194-3.647 2.575-4.823 4.142-1.177 1.492-2 2.873-2.47 4.142l.235.223c.156-.074.47-.149.94-.223a6.258 6.258 0 0 1 1.648-.224c2.039 0 3.53.597 4.47 1.79 1.02 1.195 1.53 2.575 1.53 4.143 0 2.387-.785 4.402-2.353 6.044C33.922 29.216 31.96 30 29.529 30Z' fill='%23000'/%3E%3C/svg%3E");
}

.rte h1 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.rte h2 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.rte h3 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.rte h4 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.rte h5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.rte h6 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.rte img {
  border-radius: var(--border-radius-other);
}

.rte .iframe-container {
  position: relative;
  aspect-ratio: 16 / 9;
}

@supports not (aspect-ratio: initial) {
  .rte .iframe-container::before {
    float: left;
    content: var(--tw-content);
    padding-bottom: 56.25%;
  }

  .rte .iframe-container::after {
    clear: both;
    content: var(--tw-content);
    display: table;
  }
}

.rte .iframe-container > iframe {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 100%;
  width: 100%;
  border-radius: var(--border-radius-other);
}

.rte ol {
  margin-bottom: 1.25rem;
  list-style-position: inside;
  list-style-type: decimal;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

.rte ol li {
  margin-bottom: 0.25rem;
}

.rte ol ol {
  margin-bottom: 0px;
  padding-left: 1.875rem;
}

.rte ul {
  margin-bottom: 1.25rem;
  list-style-position: inside;
  list-style-type: var(--list-style-type);
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

.rte ul li {
  margin-bottom: 0.25rem;
}

.rte ul ul {
  margin-bottom: 0px;
  padding-left: 1.875rem;
}

.rte p {
  margin-bottom: 1.25rem;
}

.rte p:empty::before {
  --tw-content: '\a0';
  content: var(--tw-content);
}

.rte table {
  margin-bottom: 1.25rem;
  overflow: hidden;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

.rte thead, 
  .rte tbody {
  vertical-align: baseline;
}

.rte tr {
  border-bottom-width: 1px;
  border-bottom-color: rgb(var(--color-body-text) / 0.25);
}

.rte th, 
  .rte td {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  text-align: left;
}

.rte-left img {
  margin-right: auto;
}

.rte-center img {
  margin-left: auto;
  margin-right: auto;
}

.rte-right img {
  margin-left: auto;
}

.select {
  width: 100%;
  cursor: pointer;
  -webkit-appearance: none;
          appearance: none;
  border-radius: var(--border-radius-button);
  background-color: transparent;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 0.75rem;
  padding-right: 2.125rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
  --tw-shadow: inset 0 0 0 1px rgb(var(--color-body-text) / 0.5);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.select:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.select-caret {
  pointer-events: none;
  position: absolute;
  right: 0.75rem;
  top: 50%;
  display: flex;
  height: 0.625rem;
  width: 0.625rem;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  align-items: center;
  justify-content: center;
  color: rgb(var(--color-body-text) / 0.75);
}

.textarea {
  display: block;
  width: 100%;
  resize: none;
  -webkit-appearance: none;
          appearance: none;
  border-radius: var(--border-radius-button);
  background-color: transparent;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-bottom: 0.25rem;
  padding-top: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
  --tw-shadow: inset 0 0 0 1px rgb(var(--color-body-text) / 0.5);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.textarea::placeholder {
  color: rgb(var(--color-body-text) / 0.75);
  opacity: 0;
}

.textarea:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.aspect-ratio {
  position: relative;
  display: block;
  aspect-ratio: var(--width)/var(--height);
  width: 100%;
}

@supports not (aspect-ratio: initial) {
  .aspect-ratio {
    display: block;
  }

  .aspect-ratio::before {
    float: left;
    content: var(--tw-content);
    padding-bottom: calc(var(--width) / var(--height) * 100%);
  }

  .aspect-ratio::after {
    clear: both;
    content: var(--tw-content);
    display: table;
  }
}

.aspect-ratio > iframe, 
.aspect-ratio > div > iframe, 
.aspect-ratio > ce-animate-image-load > iframe {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
}

.aspect-ratio > img, 
.aspect-ratio > ce-animate-image-load > img {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.aspect-ratio > svg, 
.aspect-ratio > ce-animate-image-load > svg {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
}

.aspect-ratio > video, 
.aspect-ratio > ce-animate-image-load > video, 
.aspect-ratio > ce-lazy-load-video > video {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media (min-width: 768px) {
  .aspect-ratio {
    position: relative;
    display: block;
    aspect-ratio: var(--md-width,var(--width))/var(--md-height,var(--height));
    width: 100%;
  }

  @supports not (aspect-ratio: initial) {
    .aspect-ratio {
      display: block;
    }

    .aspect-ratio::before {
      float: left;
      content: var(--tw-content);
      padding-bottom: calc(var(--md-width,var(--width)) / var(--md-height,var(--height)) * 100%);
    }

    .aspect-ratio::after {
      clear: both;
      content: var(--tw-content);
      display: table;
    }
  }
}

@media (min-width: 1280px) {
  .aspect-ratio {
    position: relative;
    display: block;
    aspect-ratio: var(--xl-width,var(--md-width,var(--width)))/var(--xl-height,var(--md-height,var(--height)));
    width: 100%;
  }

  @supports not (aspect-ratio: initial) {
    .aspect-ratio {
      display: block;
    }

    .aspect-ratio::before {
      float: left;
      content: var(--tw-content);
      padding-bottom: calc(var(--xl-width,var(--md-width,var(--width))) / var(--xl-height,var(--md-height,var(--height))) * 100%);
    }

    .aspect-ratio::after {
      clear: both;
      content: var(--tw-content);
      display: table;
    }
  }
}

.color-scheme-primary-1 {
  --color-heading: var(--color-primary-heading);
  --color-subheading: var(--color-primary-subheading);
  --color-body-text: var(--color-primary-body-text);
  --color-link: var(--color-primary-link);
  --color-link-alt: var(--color-primary-background-1);
  --color-background: var(--color-primary-background-1);
  --color-background-alt: var(--color-primary-background-2);
}

.color-scheme-primary-2 {
  --color-heading: var(--color-primary-heading);
  --color-subheading: var(--color-primary-subheading);
  --color-body-text: var(--color-primary-body-text);
  --color-link: var(--color-primary-link);
  --color-link-alt: var(--color-primary-background-2);
  --color-background: var(--color-primary-background-2);
  --color-background-alt: var(--color-primary-background-1);
}

.color-scheme-primary-inverse {
  --color-heading: var(--color-primary-background-1);
  --color-subheading: var(--color-primary-background-1);
  --color-body-text: var(--color-primary-background-1);
  --color-link: var(--color-primary-background-1);
  --color-link-alt: var(--color-primary-body-text);
  --color-background: var(--color-primary-body-text);
  --color-background-alt: var(--color-primary-body-text);
}

.color-scheme-secondary-1 {
  --color-heading: var(--color-secondary-heading);
  --color-subheading: var(--color-secondary-subheading);
  --color-body-text: var(--color-secondary-body-text);
  --color-link: var(--color-secondary-link);
  --color-link-alt: var(--color-secondary-background-1);
  --color-background: var(--color-secondary-background-1);
  --color-background-alt: var(--color-secondary-background-2);
}

.color-scheme-secondary-2 {
  --color-heading: var(--color-secondary-heading);
  --color-subheading: var(--color-secondary-subheading);
  --color-body-text: var(--color-secondary-body-text);
  --color-link: var(--color-secondary-link);
  --color-link-alt: var(--color-secondary-background-2);
  --color-background: var(--color-secondary-background-2);
  --color-background-alt: var(--color-secondary-background-1);
}

.color-scheme-secondary-inverse {
  --color-heading: var(--color-secondary-background-1);
  --color-subheading: var(--color-secondary-background-1);
  --color-body-text: var(--color-secondary-background-1);
  --color-link: var(--color-secondary-background-1);
  --color-link-alt: var(--color-secondary-body-text);
  --color-background: var(--color-secondary-body-text);
  --color-background-alt: var(--color-secondary-body-text);
}

.color-scheme-accent-1 {
  --color-heading: var(--color-accent-1-body-text);
  --color-subheading: var(--color-accent-1-body-text);
  --color-body-text: var(--color-accent-1-body-text);
  --color-link: var(--color-accent-1-body-text);
  --color-link-alt: var(--color-accent-1-background);
  --color-background: var(--color-accent-1-background);
  --color-background-alt: var(--color-accent-1-background);
}

.color-scheme-accent-2 {
  --color-heading: var(--color-accent-2-body-text);
  --color-subheading: var(--color-accent-2-body-text);
  --color-body-text: var(--color-accent-2-body-text);
  --color-link: var(--color-accent-2-body-text);
  --color-link-alt: var(--color-accent-2-background);
  --color-background: var(--color-accent-2-background);
  --color-background-alt: var(--color-accent-2-background);
}

.color-scheme-accent-3 {
  --color-heading: var(--color-accent-3-body-text);
  --color-subheading: var(--color-accent-3-body-text);
  --color-body-text: var(--color-accent-3-body-text);
  --color-link: var(--color-accent-3-body-text);
  --color-link-alt: var(--color-accent-3-background);
  --color-background: var(--color-accent-3-background);
  --color-background-alt: var(--color-accent-3-background);
}

@media (min-width: 768px) {
  .md\:color-scheme-primary-1 {
    --color-heading: var(--color-primary-heading);
    --color-subheading: var(--color-primary-subheading);
    --color-body-text: var(--color-primary-body-text);
    --color-link: var(--color-primary-link);
    --color-link-alt: var(--color-primary-background-1);
    --color-background: var(--color-primary-background-1);
    --color-background-alt: var(--color-primary-background-2);
  }

  .md\:color-scheme-primary-2 {
    --color-heading: var(--color-primary-heading);
    --color-subheading: var(--color-primary-subheading);
    --color-body-text: var(--color-primary-body-text);
    --color-link: var(--color-primary-link);
    --color-link-alt: var(--color-primary-background-2);
    --color-background: var(--color-primary-background-2);
    --color-background-alt: var(--color-primary-background-1);
  }

  .md\:color-scheme-primary-inverse {
    --color-heading: var(--color-primary-background-1);
    --color-subheading: var(--color-primary-background-1);
    --color-body-text: var(--color-primary-background-1);
    --color-link: var(--color-primary-background-1);
    --color-link-alt: var(--color-primary-body-text);
    --color-background: var(--color-primary-body-text);
    --color-background-alt: var(--color-primary-body-text);
  }

  .md\:color-scheme-secondary-1 {
    --color-heading: var(--color-secondary-heading);
    --color-subheading: var(--color-secondary-subheading);
    --color-body-text: var(--color-secondary-body-text);
    --color-link: var(--color-secondary-link);
    --color-link-alt: var(--color-secondary-background-1);
    --color-background: var(--color-secondary-background-1);
    --color-background-alt: var(--color-secondary-background-2);
  }

  .md\:color-scheme-secondary-2 {
    --color-heading: var(--color-secondary-heading);
    --color-subheading: var(--color-secondary-subheading);
    --color-body-text: var(--color-secondary-body-text);
    --color-link: var(--color-secondary-link);
    --color-link-alt: var(--color-secondary-background-2);
    --color-background: var(--color-secondary-background-2);
    --color-background-alt: var(--color-secondary-background-1);
  }

  .md\:color-scheme-secondary-inverse {
    --color-heading: var(--color-secondary-background-1);
    --color-subheading: var(--color-secondary-background-1);
    --color-body-text: var(--color-secondary-background-1);
    --color-link: var(--color-secondary-background-1);
    --color-link-alt: var(--color-secondary-body-text);
    --color-background: var(--color-secondary-body-text);
    --color-background-alt: var(--color-secondary-body-text);
  }

  .md\:color-scheme-accent-1 {
    --color-heading: var(--color-accent-1-body-text);
    --color-subheading: var(--color-accent-1-body-text);
    --color-body-text: var(--color-accent-1-body-text);
    --color-link: var(--color-accent-1-body-text);
    --color-link-alt: var(--color-accent-1-background);
    --color-background: var(--color-accent-1-background);
    --color-background-alt: var(--color-accent-1-background);
  }

  .md\:color-scheme-accent-2 {
    --color-heading: var(--color-accent-2-body-text);
    --color-subheading: var(--color-accent-2-body-text);
    --color-body-text: var(--color-accent-2-body-text);
    --color-link: var(--color-accent-2-body-text);
    --color-link-alt: var(--color-accent-2-background);
    --color-background: var(--color-accent-2-background);
    --color-background-alt: var(--color-accent-2-background);
  }

  .md\:color-scheme-accent-3 {
    --color-heading: var(--color-accent-3-body-text);
    --color-subheading: var(--color-accent-3-body-text);
    --color-body-text: var(--color-accent-3-body-text);
    --color-link: var(--color-accent-3-body-text);
    --color-link-alt: var(--color-accent-3-background);
    --color-background: var(--color-accent-3-background);
    --color-background-alt: var(--color-accent-3-background);
  }
}

.top-padding-none {
  padding-top: 0px;
}

.top-padding-small {
  padding-top: 1.25rem;
}

@media (min-width: 768px) {
  .top-padding-small {
    padding-top: 2.5rem;
  }
}

.top-padding-medium {
  padding-top: 2.5rem;
}

@media (min-width: 768px) {
  .top-padding-medium {
    padding-top: 5rem;
  }
}

.top-padding-large {
  padding-top: 3.75rem;
}

@media (min-width: 768px) {
  .top-padding-large {
    padding-top: 7.5rem;
  }
}

.bottom-padding-none {
  padding-bottom: 0px;
}

.bottom-padding-small {
  padding-bottom: 1.25rem;
}

@media (min-width: 768px) {
  .bottom-padding-small {
    padding-bottom: 2.5rem;
  }
}

.bottom-padding-medium {
  padding-bottom: 2.5rem;
}

@media (min-width: 768px) {
  .bottom-padding-medium {
    padding-bottom: 5rem;
  }
}

.bottom-padding-large {
  padding-bottom: 3.75rem;
}

@media (min-width: 768px) {
  .bottom-padding-large {
    padding-bottom: 7.5rem;
  }
}

.left-padding-none {
  padding-right: 0px;
}

.left-padding-small {
  padding-left: 1.25rem;
}

@media (min-width: 768px) {
  .left-padding-small {
    padding-left: 2.5rem;
  }
}

.left-padding-medium {
  padding-left: 2.5rem;
}

@media (min-width: 768px) {
  .left-padding-medium {
    padding-left: 5rem;
  }
}

.left-padding-large {
  padding-left: 3.75rem;
}

@media (min-width: 768px) {
  .left-padding-large {
    padding-left: 7.5rem;
  }
}

.right-padding-none {
  padding-right: 0px;
}

.right-padding-small {
  padding-right: 1.25rem;
}

@media (min-width: 768px) {
  .right-padding-small {
    padding-right: 2.5rem;
  }
}

.right-padding-medium {
  padding-right: 2.5rem;
}

@media (min-width: 768px) {
  .right-padding-medium {
    padding-right: 5rem;
  }
}

.right-padding-large {
  padding-right: 3.75rem;
}

@media (min-width: 768px) {
  .right-padding-large {
    padding-right: 7.5rem;
  }
}

.grecaptcha-badge {
  bottom: 5rem !important;
  z-index: 35 !important;
}

.shopify-challenge__container {
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
  box-sizing: content-box;
  max-width: 65ch;
  padding-left: 1rem;
  padding-right: 1rem;
  text-align: center;
  --color-heading: var(--color-primary-heading);
  --color-subheading: var(--color-primary-subheading);
  --color-body-text: var(--color-primary-body-text);
  --color-link: var(--color-primary-link);
  --color-link-alt: var(--color-primary-background-1);
  --color-background: var(--color-primary-background-1);
  --color-background-alt: var(--color-primary-background-2);
}

@media (min-width: 768px) {
  .shopify-challenge__container {
    margin-top: 5rem;
    margin-bottom: 5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1280px) {
  .shopify-challenge__container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media (min-width: 1440px) {
  .shopify-challenge__container {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}

.shopify-challenge__container .shopify-challenge__message {
  margin-bottom: 2.5rem;
}

.shopify-challenge__container .shopify-challenge__button {
  display: inline-block;
  cursor: pointer;
  touch-action: manipulation;
  text-align: center;
  font-weight: var(--font-body-bold-weight);
}

.shopify-challenge__container .shopify-challenge__button:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.shopify-challenge__container .shopify-challenge__button {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius-button);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  --tw-text-opacity: 1;
  color: rgb(var(--color-link-alt) / var(--tw-text-opacity));
}

.shopify-challenge__container .shopify-challenge__button::before {
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  transform-origin: left;
  --tw-scale-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-color: rgb(var(--color-link-alt) / 0.1);
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 200ms;
  content: var(--tw-content);
  transition-timing-function: cubic-bezier(0.6,0,0.8,0.6);
}

@media (prefers-reduced-motion: no-preference) {
  .shopify-challenge__container .shopify-challenge__button:hover:not([aria-disabled="true"])::before {
    content: var(--tw-content);
    --tw-scale-x: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
}

.shopify-challenge__container .shopify-challenge__button {
  margin-top: 2.5rem;
}

.shopify-policy__container {
  margin-left: auto;
  margin-right: auto;
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
  box-sizing: content-box;
  max-width: 65ch;
  padding-left: 1rem;
  padding-right: 1rem;
}

@media (min-width: 768px) {
  .shopify-policy__container {
    margin-top: 5rem;
    margin-bottom: 5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1280px) {
  .shopify-policy__container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media (min-width: 1440px) {
  .shopify-policy__container {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}

.shopify-policy__title {
  margin-bottom: 5rem;
  text-align: left;
}

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

.pointer-events-none {
  pointer-events: none;
}

.pointer-events-auto {
  pointer-events: auto;
}

.visible {
  visibility: visible;
}

.invisible {
  visibility: hidden;
}

.static {
  position: static;
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.sticky {
  position: sticky;
}

.inset-0 {
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
}

.-right-0\.5 {
  right: -0.125rem;
}

.top-0\.5 {
  top: 0.125rem;
}

.-right-0 {
  right: -0px;
}

.top-0 {
  top: 0px;
}

.left-0 {
  left: 0px;
}

.right-0 {
  right: 0px;
}

.bottom-2 {
  bottom: 0.5rem;
}

.right-2 {
  right: 0.5rem;
}

.top-2 {
  top: 0.5rem;
}

.bottom-1 {
  bottom: 0.25rem;
}

.-right-3\.5 {
  right: -0.875rem;
}

.-right-3 {
  right: -0.75rem;
}

.left-3 {
  left: 0.75rem;
}

.bottom-0 {
  bottom: 0px;
}

.bottom-1\.5 {
  bottom: 0.375rem;
}

.right-3 {
  right: 0.75rem;
}

.top-1\/2 {
  top: 50%;
}

.left-1\/2 {
  left: 50%;
}

.-right-1\.5 {
  right: -0.375rem;
}

.-top-1\.5 {
  top: -0.375rem;
}

.-right-1 {
  right: -0.25rem;
}

.-top-1 {
  top: -0.25rem;
}

.top-\[var\(--top\)\] {
  top: var(--top);
}

.top-\[11px\] {
  top: 11px;
}

.left-2 {
  left: 0.5rem;
}

.left-4 {
  left: 1rem;
}

.right-4 {
  right: 1rem;
}

.top-1\/1 {
  top: 100%;
}

.top-4 {
  top: 1rem;
}

.-right-4 {
  right: -1rem;
}

.left-1\.5 {
  left: 0.375rem;
}

.left-1 {
  left: 0.25rem;
}

.top-1 {
  top: 0.25rem;
}

.right-1 {
  right: 0.25rem;
}

.bottom-4 {
  bottom: 1rem;
}

.-left-2 {
  left: -0.5rem;
}

.-right-2 {
  right: -0.5rem;
}

.top-\[calc\(100\%\+0\.5rem\)\] {
  top: calc(100% + 0.5rem);
}

.top-6 {
  top: 1.5rem;
}

.right-8 {
  right: 2rem;
}

.-left-1 {
  left: -0.25rem;
}

.-left-0\.5 {
  left: -0.125rem;
}

.-left-0 {
  left: -0px;
}

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

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

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

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

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

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

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

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

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

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

.order-1 {
  order: 1;
}

.order-2 {
  order: 2;
}

.order-3 {
  order: 3;
}

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

.col-span-1 {
  grid-column: span 1 / span 1;
}

.col-start-1 {
  grid-column-start: 1;
}

.col-start-3 {
  grid-column-start: 3;
}

.col-start-2 {
  grid-column-start: 2;
}

.col-end-4 {
  grid-column-end: 4;
}

.col-end-2 {
  grid-column-end: 2;
}

.col-end-3 {
  grid-column-end: 3;
}

.col-end-\[-1\] {
  grid-column-end: -1;
}

.row-span-1 {
  grid-row: span 1 / span 1;
}

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

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

.-mx-2 {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}

.mx-2 {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

.my-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.-mx-4 {
  margin-left: -1rem;
  margin-right: -1rem;
}

.mx-4 {
  margin-left: 1rem;
  margin-right: 1rem;
}

.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}

.-mx-3 {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}

.my-1\.5 {
  margin-top: 0.375rem;
  margin-bottom: 0.375rem;
}

.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

.-mx-6 {
  margin-left: -1.5rem;
  margin-right: -1.5rem;
}

.my-14 {
  margin-top: 3.5rem;
  margin-bottom: 3.5rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.mb-1 {
  margin-bottom: 0.25rem;
}

.mt-1 {
  margin-top: 0.25rem;
}

.ml-8 {
  margin-left: 2rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.-mb-3 {
  margin-bottom: -0.75rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.-ml-4 {
  margin-left: -1rem;
}

.-mr-4 {
  margin-right: -1rem;
}

.mb-7 {
  margin-bottom: 1.75rem;
}

.ml-1 {
  margin-left: 0.25rem;
}

.mb-10 {
  margin-bottom: 2.5rem;
}

.mr-3 {
  margin-right: 0.75rem;
}

.ml-4 {
  margin-left: 1rem;
}

.mt-\[136px\] {
  margin-top: 136px;
}

.mt-20 {
  margin-top: 5rem;
}

.mb-5 {
  margin-bottom: 1.25rem;
}

.mt-10 {
  margin-top: 2.5rem;
}

.-mb-7 {
  margin-bottom: -1.75rem;
}

.-mb-4 {
  margin-bottom: -1rem;
}

.mt-0\.5 {
  margin-top: 0.125rem;
}

.mt-0 {
  margin-top: 0px;
}

.-mb-1 {
  margin-bottom: -0.25rem;
}

.mr-2 {
  margin-right: 0.5rem;
}

.mr-4 {
  margin-right: 1rem;
}

.-mt-2 {
  margin-top: -0.5rem;
}

.mr-auto {
  margin-right: auto;
}

.ml-auto {
  margin-left: auto;
}

.-mb-5 {
  margin-bottom: -1.25rem;
}

.-mb-2 {
  margin-bottom: -0.5rem;
}

.-mb-10 {
  margin-bottom: -2.5rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mt-auto {
  margin-top: auto;
}

.mt-2\.5 {
  margin-top: 0.625rem;
}

.mb-6\.5 {
  margin-bottom: 1.625rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.ml-0\.5 {
  margin-left: 0.125rem;
}

.-mr-0\.5 {
  margin-right: -0.125rem;
}

.ml-0 {
  margin-left: 0px;
}

.-mr-0 {
  margin-right: -0px;
}

.mb-0 {
  margin-bottom: 0px;
}

.ml-16 {
  margin-left: 4rem;
}

.ml-2 {
  margin-left: 0.5rem;
}

.-mb-12 {
  margin-bottom: -3rem;
}

.mb-12 {
  margin-bottom: 3rem;
}

.mb-\[-6rem\] {
  margin-bottom: -6rem;
}

.mt-5 {
  margin-top: 1.25rem;
}

.mb-20 {
  margin-bottom: 5rem;
}

.mb-14 {
  margin-bottom: 3.5rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.-mb-8 {
  margin-bottom: -2rem;
}

.mr-2\.5 {
  margin-right: 0.625rem;
}

.mr-0 {
  margin-right: 0px;
}

.-mb-11 {
  margin-bottom: -2.75rem;
}

.-mb-16 {
  margin-bottom: -4rem;
}

.mb-16 {
  margin-bottom: 4rem;
}

.mt-7 {
  margin-top: 1.75rem;
}

.mt-8 {
  margin-top: 2rem;
}

.-mb-0\.5 {
  margin-bottom: -0.125rem;
}

.-mb-0 {
  margin-bottom: -0px;
}

.mb-0\.5 {
  margin-bottom: 0.125rem;
}

.ml-3 {
  margin-left: 0.75rem;
}

.-ml-3\.5 {
  margin-left: -0.875rem;
}

.-ml-3 {
  margin-left: -0.75rem;
}

.ml-1\.5 {
  margin-left: 0.375rem;
}

.-mb-9 {
  margin-bottom: -2.25rem;
}

.mb-9 {
  margin-bottom: 2.25rem;
}

.mr-14 {
  margin-right: 3.5rem;
}

.mb-19 {
  margin-bottom: 4.75rem;
}

.-mt-4 {
  margin-top: -1rem;
}

.-mr-2 {
  margin-right: -0.5rem;
}

.box-content {
  box-sizing: content-box;
}

.block {
  display: block;
}

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

.inline {
  display: inline;
}

.flex {
  display: flex;
}

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

.table {
  display: table;
}

.grid {
  display: grid;
}

.hidden {
  display: none;
}

.h-5 {
  height: 1.25rem;
}

.h-4 {
  height: 1rem;
}

.h-10 {
  height: 2.5rem;
}

.h-2 {
  height: 0.5rem;
}

.h-16 {
  height: 4rem;
}

.h-2\.5 {
  height: 0.625rem;
}

.h-1\/1 {
  height: 100%;
}

.h-15 {
  height: 3.75rem;
}

.h-\[21px\] {
  height: 21px;
}

.h-\[var\(--height\)\] {
  height: var(--height);
}

.h-\[var\(--logo-height\)\] {
  height: var(--logo-height);
}

.h-14 {
  height: 3.5rem;
}

.h-12 {
  height: 3rem;
}

.h-3 {
  height: 0.75rem;
}

.h-18 {
  height: 4.5rem;
}

.h-6 {
  height: 1.5rem;
}

.h-2\.75 {
  height: 0.6875rem;
}

.h-8 {
  height: 2rem;
}

.h-9 {
  height: 2.25rem;
}

.h-\[calc\(100vh-2rem\)\] {
  height: calc(100vh - 2rem);
}

.h-px {
  height: 1px;
}

.h-7 {
  height: 1.75rem;
}

.h-6\.5 {
  height: 1.625rem;
}

.max-h-1\/1 {
  max-height: 100%;
}

.max-h-\[calc\(100vh-8rem\)\] {
  max-height: calc(100vh - 8rem);
}

.max-h-\[810px\] {
  max-height: 810px;
}

.max-h-\[calc\(100vh-12rem\)\] {
  max-height: calc(100vh - 12rem);
}

.min-h-12 {
  min-height: 3rem;
}

.min-h-\[calc\(100\%-4\.25rem\)\] {
  min-height: calc(100% - 4.25rem);
}

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

.w-1\/2 {
  width: 50%;
}

.w-2\/3 {
  width: 66.666667%;
}

.w-5 {
  width: 1.25rem;
}

.w-\[7px\] {
  width: 7px;
}

.w-\[calc\(100\%-1rem\)\] {
  width: calc(100% - 1rem);
}

.w-16 {
  width: 4rem;
}

.w-12 {
  width: 3rem;
}

.w-2\.5 {
  width: 0.625rem;
}

.w-2 {
  width: 0.5rem;
}

.w-max {
  width: max-content;
}

.w-15 {
  width: 3.75rem;
}

.w-\[calc\(100\%-2rem\)\] {
  width: calc(100% - 2rem);
}

.w-auto {
  width: auto;
}

.w-\[21px\] {
  width: 21px;
}

.w-\[var\(--width\)\] {
  width: var(--width);
}

.w-1\/3 {
  width: 33.333333%;
}

.w-14 {
  width: 3.5rem;
}

.w-80 {
  width: 20rem;
}

.w-1\/4 {
  width: 25%;
}

.w-3 {
  width: 0.75rem;
}

.w-\[calc\(var\(--width\)\*1px\)\] {
  width: calc(var(--width) * 1px);
}

.w-4 {
  width: 1rem;
}

.w-18 {
  width: 4.5rem;
}

.w-\[54px\] {
  width: 54px;
}

.w-24 {
  width: 6rem;
}

.w-6 {
  width: 1.5rem;
}

.w-2\.75 {
  width: 0.6875rem;
}

.w-8 {
  width: 2rem;
}

.w-9 {
  width: 2.25rem;
}

.w-\[192px\] {
  width: 192px;
}

.w-\[136px\] {
  width: 136px;
}

.w-30 {
  width: 7.5rem;
}

.w-60 {
  width: 15rem;
}

.w-7 {
  width: 1.75rem;
}

.w-6\.5 {
  width: 1.625rem;
}

.min-w-0 {
  min-width: 0px;
}

.min-w-\[120px\] {
  min-width: 120px;
}

.min-w-12 {
  min-width: 3rem;
}

.max-w-screen-2xl {
  max-width: 1440px;
}

.max-w-prose {
  max-width: 65ch;
}

.max-w-\[480px\] {
  max-width: 480px;
}

.max-w-\[calc\(100\%-0\.5rem\)\] {
  max-width: calc(100% - 0.5rem);
}

.max-w-\[375px\] {
  max-width: 375px;
}

.max-w-md {
  max-width: 28rem;
}

.max-w-sm {
  max-width: 24rem;
}

.max-w-xs {
  max-width: 20rem;
}

.max-w-5xl {
  max-width: 64rem;
}

.max-w-1\/1 {
  max-width: 100%;
}

.max-w-full {
  max-width: 100%;
}

.max-w-\[672px\] {
  max-width: 672px;
}

.flex-none {
  flex: none;
}

.flex-1 {
  flex: 1 1 0%;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.flex-shrink {
  flex-shrink: 1;
}

.flex-grow {
  flex-grow: 1;
}

.origin-top {
  transform-origin: top;
}

.origin-left {
  transform-origin: left;
}

.translate-y-0 {
  --tw-translate-y: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-translate-y-1\/2 {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-x-\[var\(--translate-x\)\] {
  --tw-translate-x: var(--translate-x);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-rotate-90 {
  --tw-rotate: -90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-100 {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-150 {
  --tw-scale-x: 1.5;
  --tw-scale-y: 1.5;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-75 {
  --tw-scale-x: .75;
  --tw-scale-y: .75;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-95 {
  --tw-scale-x: .95;
  --tw-scale-y: .95;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-x-\[calc\(var\(--current\)\/var\(--max\)\)\] {
  --tw-scale-x: calc(var(--current) / var(--max));
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.scale-x-0 {
  --tw-scale-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.cursor-pointer {
  cursor: pointer;
}

.touch-none {
  touch-action: none;
}

.touch-manipulation {
  touch-action: manipulation;
}

.select-none {
  -webkit-user-select: none;
          user-select: none;
}

.resize {
  resize: both;
}

.snap-x {
  scroll-snap-type: x var(--tw-scroll-snap-strictness);
}

.snap-mandatory {
  --tw-scroll-snap-strictness: mandatory;
}

.snap-center {
  scroll-snap-align: center;
}

.list-outside {
  list-style-position: outside;
}

.list-\[var\(--list-style-type\)\] {
  list-style-type: var(--list-style-type);
}

.appearance-none {
  -webkit-appearance: none;
          appearance: none;
}

.grid-flow-row-dense {
  grid-auto-flow: row dense;
}

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

.grid-cols-\[72px_1fr\] {
  grid-template-columns: 72px 1fr;
}

.grid-cols-\[1fr_max-content\] {
  grid-template-columns: 1fr max-content;
}

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

.grid-cols-\[72px_minmax\(0\2c 1fr\)_max-content\] {
  grid-template-columns: 72px minmax(0,1fr) max-content;
}

.grid-cols-\[54px_minmax\(0\2c 1fr\)_max-content\] {
  grid-template-columns: 54px minmax(0,1fr) max-content;
}

.grid-rows-\[repeat\(var\(--rows\)\2c minmax\(3rem\2c 1fr\)\)\] {
  grid-template-rows: repeat(var(--rows),minmax(3rem,1fr));
}

.grid-rows-\[auto\] {
  grid-template-rows: auto;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

.gap-3 {
  gap: 0.75rem;
}

.gap-4 {
  gap: 1rem;
}

.gap-2 {
  gap: 0.5rem;
}

.gap-0\.5 {
  gap: 0.125rem;
}

.gap-0 {
  gap: 0px;
}

.gap-x-4 {
  column-gap: 1rem;
}

.gap-y-3 {
  row-gap: 0.75rem;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-x-auto {
  overflow-x: auto;
}

.overflow-y-auto {
  overflow-y: auto;
}

.overflow-x-hidden {
  overflow-x: hidden;
}

.overflow-y-hidden {
  overflow-y: hidden;
}

.overscroll-x-contain {
  overscroll-behavior-x: contain;
}

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

.whitespace-normal {
  white-space: normal;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.break-normal {
  overflow-wrap: normal;
  word-break: normal;
}

.break-words {
  overflow-wrap: break-word;
}

.break-all {
  word-break: break-all;
}

.rounded-other {
  border-radius: var(--border-radius-other);
}

.rounded-button {
  border-radius: var(--border-radius-button);
}

.rounded-\[calc\(var\(--border-radius-other\)\+0\.5rem\)\] {
  border-radius: calc(var(--border-radius-other) + 0.5rem);
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-\[1rem\] {
  border-radius: 1rem;
}

.rounded-\[12px\] {
  border-radius: 12px;
}

.rounded-\[min\(8px\2c var\(--border-radius-button\)\)\] {
  border-radius: min(8px,var(--border-radius-button));
}

.rounded-\[2px\] {
  border-radius: 2px;
}

.rounded-t-other {
  border-top-left-radius: var(--border-radius-other);
  border-top-right-radius: var(--border-radius-other);
}

.border-4 {
  border-width: 4px;
}

.border {
  border-width: 1px;
}

.border-\[0\.5rem\] {
  border-width: 0.5rem;
}

.border-2 {
  border-width: 2px;
}

.border-b {
  border-bottom-width: 1px;
}

.border-t {
  border-top-width: 1px;
}

.border-dashed {
  border-style: dashed;
}

.border-dotted {
  border-style: dotted;
}

.border-black {
  --tw-border-opacity: 1;
  border-color: rgb(0 0 0 / var(--tw-border-opacity));
}

.border-body-text\/10 {
  border-color: rgb(var(--color-body-text) / 0.1);
}

.border-body-text\/25 {
  border-color: rgb(var(--color-body-text) / 0.25);
}

.border-danger {
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-danger) / var(--tw-border-opacity));
}

.border-link\/5 {
  border-color: rgb(var(--color-link) / 0.05);
}

.border-body-text\/5 {
  border-color: rgb(var(--color-body-text) / 0.05);
}

.border-background {
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-background) / var(--tw-border-opacity));
}

.border-success {
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-success) / var(--tw-border-opacity));
}

.border-disabled {
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-disabled) / var(--tw-border-opacity));
}

.border-body-text {
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-body-text) / var(--tw-border-opacity));
}

.border-transparent {
  border-color: transparent;
}

.border-link {
  --tw-border-opacity: 1;
  border-color: rgb(var(--color-link) / var(--tw-border-opacity));
}

.border-\[\#000\] {
  --tw-border-opacity: 1;
  border-color: rgb(0 0 0 / var(--tw-border-opacity));
}

.border-b-body-text\/25 {
  border-bottom-color: rgb(var(--color-body-text) / 0.25);
}

.border-b-body-text\/75 {
  border-bottom-color: rgb(var(--color-body-text) / 0.75);
}

.bg-background-alt {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-background-alt) / var(--tw-bg-opacity));
}

.bg-body-text\/25 {
  background-color: rgb(var(--color-body-text) / 0.25);
}

.bg-link {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
}

.bg-background {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-background) / var(--tw-bg-opacity));
}

.bg-\[\#ff0\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 0 / var(--tw-bg-opacity));
}

.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}

.bg-transparent {
  background-color: transparent;
}

.bg-link-alt\/90 {
  background-color: rgb(var(--color-link-alt) / 0.9);
}

.bg-danger {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-danger) / var(--tw-bg-opacity));
}

.bg-warning {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-warning) / var(--tw-bg-opacity));
}

.bg-success {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-success) / var(--tw-bg-opacity));
}

.bg-disabled {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-disabled) / var(--tw-bg-opacity));
}

.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.bg-body-text {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-body-text) / var(--tw-bg-opacity));
}

.bg-link-alt {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link-alt) / var(--tw-bg-opacity));
}

.bg-\[\#000\] {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}

.bg-\[\#fff\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}

.bg-cover {
  background-size: cover;
}

.bg-contain {
  background-size: contain;
}

.fill-body-text {
  fill: rgb(var(--color-body-text));
}

.\!object-contain {
  object-fit: contain !important;
}

.object-contain {
  object-fit: contain;
}

.object-cover {
  object-fit: cover;
}

.p-4 {
  padding: 1rem;
}

.p-\[1\.1875rem\] {
  padding: 1.1875rem;
}

.p-3 {
  padding: 0.75rem;
}

.p-2 {
  padding: 0.5rem;
}

.p-\[3px\] {
  padding: 3px;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.px-4\.5 {
  padding-left: 1.125rem;
  padding-right: 1.125rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}

.py-1\.25 {
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
}

.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}

.py-0 {
  padding-top: 0px;
  padding-bottom: 0px;
}

.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.pl-3 {
  padding-left: 0.75rem;
}

.pl-8 {
  padding-left: 2rem;
}

.pl-4 {
  padding-left: 1rem;
}

.pr-11 {
  padding-right: 2.75rem;
}

.pr-2 {
  padding-right: 0.5rem;
}

.pl-2 {
  padding-left: 0.5rem;
}

.pt-4 {
  padding-top: 1rem;
}

.pb-7 {
  padding-bottom: 1.75rem;
}

.pb-4 {
  padding-bottom: 1rem;
}

.pt-2 {
  padding-top: 0.5rem;
}

.pt-3 {
  padding-top: 0.75rem;
}

.pb-23 {
  padding-bottom: 5.75rem;
}

.pr-9 {
  padding-right: 2.25rem;
}

.pb-8 {
  padding-bottom: 2rem;
}

.pt-6 {
  padding-top: 1.5rem;
}

.pt-8 {
  padding-top: 2rem;
}

.pb-3 {
  padding-bottom: 0.75rem;
}

.pr-8 {
  padding-right: 2rem;
}

.pb-0\.5 {
  padding-bottom: 0.125rem;
}

.pb-0 {
  padding-bottom: 0px;
}

.pb-px {
  padding-bottom: 1px;
}

.pb-12 {
  padding-bottom: 3rem;
}

.pl-16 {
  padding-left: 4rem;
}

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

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

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

.font-body {
  font-family: var(--font-body-family);
}

.font-heading {
  font-family: var(--font-heading-family);
}

.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}

.text-3xl {
  font-size: 2rem;
  line-height: 2.75rem;
}

.text-\[9rem\] {
  font-size: 9rem;
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.font-bold-body {
  font-weight: var(--font-body-bold-weight);
}

.font-normal-body {
  font-weight: var(--font-body-weight);
}

.font-normal-heading {
  font-weight: var(--font-heading-weight);
}

.uppercase {
  text-transform: uppercase;
}

.italic {
  font-style: italic;
}

.leading-none {
  line-height: 1;
}

.leading-\[0\] {
  line-height: 0;
}

.text-body-text {
  --tw-text-opacity: 1;
  color: rgb(var(--color-body-text) / var(--tw-text-opacity));
}

.text-black {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity));
}

.text-subheading {
  --tw-text-opacity: 1;
  color: rgb(var(--color-subheading) / var(--tw-text-opacity));
}

.text-heading {
  --tw-text-opacity: 1;
  color: rgb(var(--color-heading) / var(--tw-text-opacity));
}

.text-link {
  --tw-text-opacity: 1;
  color: rgb(var(--color-link) / var(--tw-text-opacity));
}

.text-danger {
  --tw-text-opacity: 1;
  color: rgb(var(--color-danger) / var(--tw-text-opacity));
}

.text-body-text\/60 {
  color: rgb(var(--color-body-text) / 0.6);
}

.text-heading\/10 {
  color: rgb(var(--color-heading) / 0.1);
}

.text-body-text\/75 {
  color: rgb(var(--color-body-text) / 0.75);
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.text-link-alt {
  --tw-text-opacity: 1;
  color: rgb(var(--color-link-alt) / var(--tw-text-opacity));
}

.text-disabled {
  --tw-text-opacity: 1;
  color: rgb(var(--color-disabled) / var(--tw-text-opacity));
}

.underline {
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.no-underline {
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}

.opacity-0 {
  opacity: 0;
}

.opacity-25 {
  opacity: 0.25;
}

.opacity-100 {
  opacity: 1;
}

.shadow-toast {
  --tw-shadow: 0 3px 7px rgb(0 0 0 / 0.5);
  --tw-shadow-colored: 0 3px 7px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-modal {
  --tw-shadow: 0 0 3px 1px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 0 3px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-card {
  --tw-shadow: 0 6px 6px 0 rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 6px 6px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-input {
  --tw-shadow: inset 0 0 0 1px rgb(var(--color-body-text) / 0.5);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-button {
  --tw-shadow: inset 0 0 0 2px currentColor;
  --tw-shadow-colored: inset 0 0 0 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-link {
  --tw-shadow-color: rgb(var(--color-link));
  --tw-shadow: var(--tw-shadow-colored);
}

.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.grayscale {
  --tw-grayscale: grayscale(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-none {
  transition-property: none;
}

.transition {
  transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-colors {
  transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.duration-200 {
  transition-duration: 200ms;
}

.duration-500 {
  transition-duration: 500ms;
}

.duration-100 {
  transition-duration: 100ms;
}

.backface-hidden {
  backface-visibility: hidden;
}

.bg-disabled-half {
  background: var(--color-disabled);
  background: linear-gradient(180deg, rgb(var(--color-background)) 0%, rgb(var(--color-background)) 50%, var(--color-disabled) 0%, var(--color-disabled) 50%);
}

.bg-success-half {
  background: var(--color-success);
  background: linear-gradient(180deg, rgb(var(--color-background)) 0%, rgb(var(--color-background)) 50%, var(--color-success) 0%, var(--color-success) 50%);
}

.outline-theme:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
  display: none;
}

.before\:absolute::before {
  content: var(--tw-content);
  position: absolute;
}

.before\:-inset-\[5px\]::before {
  content: var(--tw-content);
  top: -5px;
  right: -5px;
  bottom: -5px;
  left: -5px;
}

.before\:inset-0::before {
  content: var(--tw-content);
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
}

.before\:-inset-\[3px\]::before {
  content: var(--tw-content);
  top: -3px;
  right: -3px;
  bottom: -3px;
  left: -3px;
}

.before\:-left-0\.5::before {
  content: var(--tw-content);
  left: -0.125rem;
}

.before\:-right-0\.5::before {
  content: var(--tw-content);
  right: -0.125rem;
}

.before\:top-1\/2::before {
  content: var(--tw-content);
  top: 50%;
}

.before\:-left-0::before {
  content: var(--tw-content);
  left: -0px;
}

.before\:-right-0::before {
  content: var(--tw-content);
  right: -0px;
}

.before\:left-0::before {
  content: var(--tw-content);
  left: 0px;
}

.before\:top-0::before {
  content: var(--tw-content);
  top: 0px;
}

.before\:bottom-0::before {
  content: var(--tw-content);
  bottom: 0px;
}

.before\:top-2::before {
  content: var(--tw-content);
  top: 0.5rem;
}

.before\:left-3::before {
  content: var(--tw-content);
  left: 0.75rem;
}

.before\:right-3::before {
  content: var(--tw-content);
  right: 0.75rem;
}

.before\:bottom-4::before {
  content: var(--tw-content);
  bottom: 1rem;
}

.before\:left-4::before {
  content: var(--tw-content);
  left: 1rem;
}

.before\:right-4::before {
  content: var(--tw-content);
  right: 1rem;
}

.before\:z-\[-1\]::before {
  content: var(--tw-content);
  z-index: -1;
}

.before\:z-10::before {
  content: var(--tw-content);
  z-index: 10;
}

.before\:h-1::before {
  content: var(--tw-content);
  height: 0.25rem;
}

.before\:h-6::before {
  content: var(--tw-content);
  height: 1.5rem;
}

.before\:h-5::before {
  content: var(--tw-content);
  height: 1.25rem;
}

.before\:h-2::before {
  content: var(--tw-content);
  height: 0.5rem;
}

.before\:w-6::before {
  content: var(--tw-content);
  width: 1.5rem;
}

.before\:w-5::before {
  content: var(--tw-content);
  width: 1.25rem;
}

.before\:w-0\.5::before {
  content: var(--tw-content);
  width: 0.125rem;
}

.before\:w-0::before {
  content: var(--tw-content);
  width: 0px;
}

.before\:w-1\/2::before {
  content: var(--tw-content);
  width: 50%;
}

.before\:w-1\/1::before {
  content: var(--tw-content);
  width: 100%;
}

.before\:origin-left::before {
  content: var(--tw-content);
  transform-origin: left;
}

.before\:-translate-y-1\/2::before {
  content: var(--tw-content);
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.before\:-rotate-6::before {
  content: var(--tw-content);
  --tw-rotate: -6deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.before\:scale-x-0::before {
  content: var(--tw-content);
  --tw-scale-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.before\:scale-x-\[var\(--scale-x\)\]::before {
  content: var(--tw-content);
  --tw-scale-x: var(--scale-x);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.before\:rounded-full::before {
  content: var(--tw-content);
  border-radius: 9999px;
}

.before\:rounded-\[calc\(var\(--border-radius-other\)\+5px\)\]::before {
  content: var(--tw-content);
  border-radius: calc(var(--border-radius-other) + 5px);
}

.before\:rounded-other::before {
  content: var(--tw-content);
  border-radius: var(--border-radius-other);
}

.before\:rounded-\[min\(8px\2c var\(--border-radius-button\)\)\]::before {
  content: var(--tw-content);
  border-radius: min(8px,var(--border-radius-button));
}

.before\:rounded-button::before {
  content: var(--tw-content);
  border-radius: var(--border-radius-button);
}

.before\:rounded-\[calc\(var\(--border-radius-button\)\+4px\)\]::before {
  content: var(--tw-content);
  border-radius: calc(var(--border-radius-button) + 4px);
}

.before\:border-b-2::before {
  content: var(--tw-content);
  border-bottom-width: 2px;
}

.before\:border-b-link::before {
  content: var(--tw-content);
  --tw-border-opacity: 1;
  border-bottom-color: rgb(var(--color-link) / var(--tw-border-opacity));
}

.before\:bg-danger\/90::before {
  content: var(--tw-content);
  background-color: rgb(var(--color-danger) / 0.9);
}

.before\:bg-link-alt::before {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link-alt) / var(--tw-bg-opacity));
}

.before\:bg-link::before {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
}

.before\:bg-body-text\/10::before {
  content: var(--tw-content);
  background-color: rgb(var(--color-body-text) / 0.1);
}

.before\:bg-body-text\/25::before {
  content: var(--tw-content);
  background-color: rgb(var(--color-body-text) / 0.25);
}

.before\:bg-link\/10::before {
  content: var(--tw-content);
  background-color: rgb(var(--color-link) / 0.1);
}

.before\:py-3::before {
  content: var(--tw-content);
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.before\:pr-2::before {
  content: var(--tw-content);
  padding-right: 0.5rem;
}

.before\:text-left::before {
  content: var(--tw-content);
  text-align: left;
}

.before\:font-bold-body::before {
  content: var(--tw-content);
  font-weight: var(--font-body-bold-weight);
}

.before\:text-body-text\/50::before {
  content: var(--tw-content);
  color: rgb(var(--color-body-text) / 0.5);
}

.before\:opacity-0::before {
  content: var(--tw-content);
  opacity: 0;
}

.before\:shadow-input::before {
  content: var(--tw-content);
  --tw-shadow: inset 0 0 0 1px rgb(var(--color-body-text) / 0.5);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.before\:shadow-link::before {
  content: var(--tw-content);
  --tw-shadow-color: rgb(var(--color-link));
  --tw-shadow: var(--tw-shadow-colored);
}

.before\:transition-transform::before {
  content: var(--tw-content);
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.before\:duration-200::before {
  content: var(--tw-content);
  transition-duration: 200ms;
}

.before\:ease-\[cubic-bezier\(0\.6\2c 0\2c 0\.8\2c 0\.6\)\]::before {
  content: var(--tw-content);
  transition-timing-function: cubic-bezier(0.6,0,0.8,0.6);
}

.before\:content-\[attr\(data-heading\)\]::before {
  --tw-content: attr(data-heading);
  content: var(--tw-content);
}

.before\:content-\[attr\(data-cart-currency-symbol\)\]::before {
  --tw-content: attr(data-cart-currency-symbol);
  content: var(--tw-content);
}

.after\:absolute::after {
  content: var(--tw-content);
  position: absolute;
}

.after\:left-1::after {
  content: var(--tw-content);
  left: 0.25rem;
}

.after\:top-1::after {
  content: var(--tw-content);
  top: 0.25rem;
}

.after\:left-0::after {
  content: var(--tw-content);
  left: 0px;
}

.after\:top-2::after {
  content: var(--tw-content);
  top: 0.5rem;
}

.after\:z-20::after {
  content: var(--tw-content);
  z-index: 20;
}

.after\:ml-2::after {
  content: var(--tw-content);
  margin-left: 0.5rem;
}

.after\:h-4::after {
  content: var(--tw-content);
  height: 1rem;
}

.after\:h-3::after {
  content: var(--tw-content);
  height: 0.75rem;
}

.after\:h-2::after {
  content: var(--tw-content);
  height: 0.5rem;
}

.after\:w-4::after {
  content: var(--tw-content);
  width: 1rem;
}

.after\:w-3::after {
  content: var(--tw-content);
  width: 0.75rem;
}

.after\:w-1\/1::after {
  content: var(--tw-content);
  width: 100%;
}

.after\:origin-left::after {
  content: var(--tw-content);
  transform-origin: left;
}

.after\:translate-x-\[calc\(var\(--min\)\/var\(--range\)\*100\%\)\]::after {
  content: var(--tw-content);
  --tw-translate-x: calc(var(--min) / var(--range) * 100%);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.after\:scale-0::after {
  content: var(--tw-content);
  --tw-scale-x: 0;
  --tw-scale-y: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.after\:scale-x-\[calc\(\(var\(--max\)-var\(--min\)\)\/var\(--range\)\)\]::after {
  content: var(--tw-content);
  --tw-scale-x: calc((var(--max) - var(--min)) / var(--range));
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.after\:rounded-full::after {
  content: var(--tw-content);
  border-radius: 9999px;
}

.after\:rounded-button::after {
  content: var(--tw-content);
  border-radius: var(--border-radius-button);
}

.after\:bg-link::after {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
}

.after\:content-\[var\(--breadcrumb-separator\)\]::after {
  --tw-content: var(--breadcrumb-separator);
  content: var(--tw-content);
}

.first\:ml-4:first-child {
  margin-left: 1rem;
}

.first\:ml-0:first-child {
  margin-left: 0px;
}

.first\:mt-0:first-child {
  margin-top: 0px;
}

.first\:ml-2:first-child {
  margin-left: 0.5rem;
}

.first\:text-left:first-child {
  text-align: left;
}

.last\:mr-4:last-child {
  margin-right: 1rem;
}

.last\:mr-0:last-child {
  margin-right: 0px;
}

.last\:mb-0:last-child {
  margin-bottom: 0px;
}

.last\:mr-2:last-child {
  margin-right: 0.5rem;
}

.last\:border-b-0:last-child {
  border-bottom-width: 0px;
}

.last\:after\:ml-0:last-child::after {
  content: var(--tw-content);
  margin-left: 0px;
}

.last\:after\:content-none:last-child::after {
  --tw-content: none;
  content: var(--tw-content);
}

.only\:mx-auto:only-child {
  margin-left: auto;
  margin-right: auto;
}

.first-of-type\:ml-4:first-of-type {
  margin-left: 1rem;
}

.last-of-type\:mr-4:last-of-type {
  margin-right: 1rem;
}

.only-of-type\:hidden:only-of-type {
  display: none;
}

.open\:bg-background-alt[open] {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-background-alt) / var(--tw-bg-opacity));
}

.hover\:bg-background-alt:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-background-alt) / var(--tw-bg-opacity));
}

.hover\:bg-link-alt:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link-alt) / var(--tw-bg-opacity));
}

.hover\:underline:hover {
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.focus-visible\:outline-dashed:focus-visible {
  outline-style: dashed;
}

.focus-visible\:outline-2:focus-visible {
  outline-width: 2px;
}

.focus-visible\:outline-offset-\[-8px\]:focus-visible {
  outline-offset: -8px;
}

.focus-visible\:outline-offset-2:focus-visible {
  outline-offset: 2px;
}

.focus-visible\:outline-offset-\[-4px\]:focus-visible {
  outline-offset: -4px;
}

.focus-visible\:outline-offset-8:focus-visible {
  outline-offset: 8px;
}

.focus-visible\:outline-offset-0:focus-visible {
  outline-offset: 0px;
}

.focus-visible\:outline-offset-\[-10px\]:focus-visible {
  outline-offset: -10px;
}

.focus-visible\:outline-offset-\[-2px\]:focus-visible {
  outline-offset: -2px;
}

.focus-visible\:outline-link:focus-visible {
  outline-color: rgb(var(--color-link));
}

.focus-visible\:outline-link-alt:focus-visible {
  outline-color: rgb(var(--color-link-alt));
}

.focus-visible\:outline-body-text:focus-visible {
  outline-color: rgb(var(--color-body-text));
}

.group:last-child .group-last\:mb-0 {
  margin-bottom: 0px;
}

.group[open] .group-open\:visible {
  visibility: visible;
}

.group[open] .group-open\:inline {
  display: inline;
}

.group[open] .group-open\:flex {
  display: flex;
}

.group[open] .group-open\:hidden {
  display: none;
}

.group[open] .group-open\:-rotate-180 {
  --tw-rotate: -180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group[open] .group-open\:transform-none {
  transform: none;
}

.peer:checked ~ .peer-checked\:block {
  display: block;
}

.peer:checked ~ .peer-checked\:bg-link {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
}

.peer:checked ~ .peer-checked\:opacity-100 {
  opacity: 1;
}

.peer:checked ~ .peer-checked\:before\:bg-link::before {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
}

.peer:checked ~ .peer-checked\:after\:scale-100::after {
  content: var(--tw-content);
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.peer:placeholder-shown ~ .peer-placeholder-shown\:translate-y-1\/2 {
  --tw-translate-y: 50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.peer:placeholder-shown ~ .peer-placeholder-shown\:scale-100 {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.peer:placeholder-shown ~ .peer-placeholder-shown\:opacity-100 {
  opacity: 1;
}

.peer:focus-visible ~ .peer-focus-visible\:translate-y-0 {
  --tw-translate-y: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.peer:focus-visible ~ .peer-focus-visible\:scale-75 {
  --tw-scale-x: .75;
  --tw-scale-y: .75;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.peer:focus-visible ~ .peer-focus-visible\:outline-dashed {
  outline-style: dashed;
}

.peer:focus-visible ~ .peer-focus-visible\:outline-2 {
  outline-width: 2px;
}

.peer:focus-visible ~ .peer-focus-visible\:outline-offset-2 {
  outline-offset: 2px;
}

.peer:focus-visible ~ .peer-focus-visible\:outline-link {
  outline-color: rgb(var(--color-link));
}

.aria-checked\:before\:opacity-100[aria-checked="true"]::before {
  content: var(--tw-content);
  opacity: 1;
}

.group:focus-visible .group-focus-visible\:aria-checked\:outline-dashed[aria-checked="true"] {
  outline-style: dashed;
}

.group:focus-visible .group-focus-visible\:aria-checked\:outline-2[aria-checked="true"] {
  outline-width: 2px;
}

.group:focus-visible .group-focus-visible\:aria-checked\:outline-offset-4[aria-checked="true"] {
  outline-offset: 4px;
}

.group:focus-visible .group-focus-visible\:aria-checked\:outline-link[aria-checked="true"] {
  outline-color: rgb(var(--color-link));
}

.aria-current\:before\:opacity-100[aria-current="true"]::before {
  content: var(--tw-content);
  opacity: 1;
}

.aria-disabled\:\!cursor-default[aria-disabled="true"] {
  cursor: default !important;
}

.aria-disabled\:\!opacity-60[aria-disabled="true"] {
  opacity: 0.6 !important;
}

.aria-disabled\:\!filter-none[aria-disabled="true"] {
  filter: none !important;
}

.aria-disabled\:before\:\!cursor-default[aria-disabled="true"]::before {
  content: var(--tw-content);
  cursor: default !important;
}

.aria-disabled\:before\:\!opacity-60[aria-disabled="true"]::before {
  content: var(--tw-content);
  opacity: 0.6 !important;
}

.aria-selected\:outline-dashed[aria-selected="true"] {
  outline-style: dashed;
}

.aria-selected\:outline-2[aria-selected="true"] {
  outline-width: 2px;
}

.aria-selected\:outline-offset-2[aria-selected="true"] {
  outline-offset: 2px;
}

.aria-selected\:outline-link[aria-selected="true"] {
  outline-color: rgb(var(--color-link));
}

.aria-selected\:before\:border-b-2[aria-selected="true"]::before {
  content: var(--tw-content);
  border-bottom-width: 2px;
}

.child\:inline-link > * {
  display: inline;
  cursor: pointer;
  --tw-text-opacity: 1;
  color: rgb(var(--color-link) / var(--tw-text-opacity));
}

.child\:inline-link > *:hover {
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.child\:inline-link > *:focus-visible {
  outline-style: dashed;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: rgb(var(--color-link));
}

.data-shopify-xr-hidden\:hidden[data-shopify-xr-hidden] {
  display: none;
}

.group-1[open] .group-1-open\:hidden {
  display: none;
}

.js .js\:invisible {
  visibility: hidden;
}

.js .js\:fixed {
  position: fixed;
}

.js .js\:absolute {
  position: absolute;
}

.js .js\:inset-0 {
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
}

.js .js\:bottom-19 {
  bottom: 4.75rem;
}

.js .js\:left-0 {
  left: 0px;
}

.js .js\:right-0 {
  right: 0px;
}

.js .js\:top-0 {
  top: 0px;
}

.js .js\:z-60 {
  z-index: 60;
}

.js .js\:z-70 {
  z-index: 70;
}

.js .js\:ml-2 {
  margin-left: 0.5rem;
}

.js .js\:-translate-x-\[calc\(100\%\+1rem\)\] {
  --tw-translate-x: calc(calc(100% + 1rem) * -1);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.js .js\:-translate-y-4 {
  --tw-translate-y: -1rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.js .js\:-translate-x-1\/1 {
  --tw-translate-x: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.js .js\:translate-x-\[calc\(100\%\+5px\)\] {
  --tw-translate-x: calc(100% + 5px);
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.js .js\:-translate-x-12 {
  --tw-translate-x: -3rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.js .js\:scale-95 {
  --tw-scale-x: .95;
  --tw-scale-y: .95;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.js .js\:overflow-y-auto {
  overflow-y: auto;
}

.js .js\:bg-background {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-background) / var(--tw-bg-opacity));
}

.js .js\:px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.js .js\:opacity-0 {
  opacity: 0;
}

.js .js\:shadow-modal {
  --tw-shadow: 0 0 3px 1px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 0 3px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.js .group-1[open] .js\:group-1-open\:visible {
  visibility: visible;
}

.js .group-2[open] .js\:group-2-open\:visible {
  visibility: visible;
}

.no-js .no-js\:ml-4 {
  margin-left: 1rem;
}

.no-js .no-js\:hidden {
  display: none;
}

.no-js .no-js\:last\:border-b-0:last-child {
  border-bottom-width: 0px;
}

.no-js .group-1[open] .no-js\:group-1-open\:rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.no-js .group-2[open] .no-js\:group-2-open\:rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.not-focus\:sr-only:not(:focus) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.webkit-slider-thumb\:pointer-events-auto::-webkit-slider-thumb {
  pointer-events: auto;
}

.webkit-slider-thumb\:relative::-webkit-slider-thumb {
  position: relative;
}

.webkit-slider-thumb\:z-30::-webkit-slider-thumb {
  z-index: 30;
}

.webkit-slider-thumb\:h-6::-webkit-slider-thumb {
  height: 1.5rem;
}

.webkit-slider-thumb\:w-6::-webkit-slider-thumb {
  width: 1.5rem;
}

.webkit-slider-thumb\:cursor-pointer::-webkit-slider-thumb {
  cursor: pointer;
}

.webkit-slider-thumb\:appearance-none::-webkit-slider-thumb {
  -webkit-appearance: none;
          appearance: none;
}

.webkit-slider-thumb\:rounded-button::-webkit-slider-thumb {
  border-radius: var(--border-radius-button);
}

.webkit-slider-thumb\:bg-link::-webkit-slider-thumb {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
}

.webkit-slider-thumb\:shadow-none::-webkit-slider-thumb {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.focus\:webkit-slider-thumb\:outline-dashed:focus::-webkit-slider-thumb {
  outline-style: dashed;
}

.focus\:webkit-slider-thumb\:outline-2:focus::-webkit-slider-thumb {
  outline-width: 2px;
}

.focus\:webkit-slider-thumb\:outline-offset-2:focus::-webkit-slider-thumb {
  outline-offset: 2px;
}

.focus\:webkit-slider-thumb\:outline-link:focus::-webkit-slider-thumb {
  outline-color: rgb(var(--color-link));
}

.moz-range-thumb\:pointer-events-auto::-moz-range-thumb {
  pointer-events: auto;
}

.moz-range-thumb\:relative::-moz-range-thumb {
  position: relative;
}

.moz-range-thumb\:z-30::-moz-range-thumb {
  z-index: 30;
}

.moz-range-thumb\:h-6::-moz-range-thumb {
  height: 1.5rem;
}

.moz-range-thumb\:w-6::-moz-range-thumb {
  width: 1.5rem;
}

.moz-range-thumb\:cursor-pointer::-moz-range-thumb {
  cursor: pointer;
}

.moz-range-thumb\:appearance-none::-moz-range-thumb {
  appearance: none;
}

.moz-range-thumb\:rounded-button::-moz-range-thumb {
  border-radius: var(--border-radius-button);
}

.moz-range-thumb\:bg-link::-moz-range-thumb {
  --tw-bg-opacity: 1;
  background-color: rgb(var(--color-link) / var(--tw-bg-opacity));
}

.focus\:moz-range-thumb\:outline-dashed:focus::-moz-range-thumb {
  outline-style: dashed;
}

.focus\:moz-range-thumb\:outline-2:focus::-moz-range-thumb {
  outline-width: 2px;
}

.focus\:moz-range-thumb\:outline-offset-2:focus::-moz-range-thumb {
  outline-offset: 2px;
}

.focus\:moz-range-thumb\:outline-link:focus::-moz-range-thumb {
  outline-color: rgb(var(--color-link));
}

@media (prefers-reduced-motion: no-preference) {
  @keyframes pulse {
    50% {
      opacity: .5;
    }
  }

  .motion-safe\:animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  }

  @keyframes scroll {
    0% {
      transform: translateX(0);
    }

    100% {
      transform: translateX(var(--finish));
    }
  }

  .motion-safe\:animate-scroll {
    animation: scroll var(--duration) linear infinite var(--direction);
  }

  @keyframes spin {
    to {
      transform: rotate(360deg);
    }
  }

  .motion-safe\:animate-spin {
    animation: spin 1s linear infinite;
  }

  .motion-safe\:transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
  }

  .motion-safe\:transition-opacity {
    transition-property: opacity;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
  }

  .motion-safe\:duration-150 {
    transition-duration: 150ms;
  }

  .motion-safe\:duration-200 {
    transition-duration: 200ms;
  }

  .motion-safe\:before\:transition-transform::before {
    content: var(--tw-content);
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
  }

  .after\:motion-safe\:transition-transform::after {
    content: var(--tw-content);
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
  }

  .after\:motion-safe\:duration-100::after {
    content: var(--tw-content);
    transition-duration: 100ms;
  }

  .group:hover .motion-safe\:group-hover\:-translate-y-1\.5 {
    --tw-translate-y: -0.375rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .group:hover .motion-safe\:group-hover\:-translate-y-1 {
    --tw-translate-y: -0.25rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .group:hover .motion-safe\:group-hover\:opacity-100 {
    opacity: 1;
  }

  .group-1:hover .motion-safe\:group-1-hover\:-translate-y-1\.5 {
    --tw-translate-y: -0.375rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .group-1:hover .motion-safe\:group-1-hover\:-translate-y-1 {
    --tw-translate-y: -0.25rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .group-1:hover .motion-safe\:group-1-hover\:opacity-100 {
    opacity: 1;
  }

  .group-1:not([aria-disabled="true"]) .motion-safe\:group-1-not-aria-disabled\:hover\:before\:scale-x-100:hover::before {
    content: var(--tw-content);
    --tw-scale-x: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .motion-safe\:not-aria-disabled\:hover\:before\:scale-x-100:hover:not([aria-disabled="true"])::before {
    content: var(--tw-content);
    --tw-scale-x: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
}

@media (prefers-reduced-motion: reduce) {
  @keyframes scroll {
    0% {
      transform: translateX(0);
    }

    100% {
      transform: translateX(var(--finish));
    }
  }

  .group:hover .motion-reduce\:group-hover\:animate-scroll {
    animation: scroll var(--duration) linear infinite var(--direction);
  }
}

@media (min-width: 480px) {
  .xs\:col-start-3 {
    grid-column-start: 3;
  }

  .xs\:col-end-3 {
    grid-column-end: 3;
  }

  .xs\:row-start-1 {
    grid-row-start: 1;
  }

  .xs\:row-end-\[-1\] {
    grid-row-end: -1;
  }

  .xs\:mx-2 {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }

  .xs\:mb-0 {
    margin-bottom: 0px;
  }

  .xs\:block {
    display: block;
  }

  .xs\:w-1\/2 {
    width: 50%;
  }

  .xs\:grid-cols-\[72px_1fr_8rem\] {
    grid-template-columns: 72px 1fr 8rem;
  }

  .xs\:grid-cols-\[72px_1fr_10rem\] {
    grid-template-columns: 72px 1fr 10rem;
  }

  .xs\:pr-2 {
    padding-right: 0.5rem;
  }

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

  .xs\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

@media (min-width: 568px) {
  .sm\:absolute {
    position: absolute;
  }

  .sm\:right-0 {
    right: 0px;
  }

  .sm\:top-0 {
    top: 0px;
  }

  .sm\:h-20 {
    height: 5rem;
  }

  .sm\:w-20 {
    width: 5rem;
  }

  .sm\:w-1\/2 {
    width: 50%;
  }

  .sm\:grid-cols-\[96px_1fr_10rem\] {
    grid-template-columns: 96px 1fr 10rem;
  }
}

@media (min-width: 768px) {
  .md\:static {
    position: static;
  }

  .md\:absolute {
    position: absolute;
  }

  .md\:relative {
    position: relative;
  }

  .md\:bottom-auto {
    bottom: auto;
  }

  .md\:top-0 {
    top: 0px;
  }

  .md\:top-1\/2 {
    top: 50%;
  }

  .md\:bottom-0 {
    bottom: 0px;
  }

  .md\:top-auto {
    top: auto;
  }

  .md\:bottom-6 {
    bottom: 1.5rem;
  }

  .md\:left-auto {
    left: auto;
  }

  .md\:right-6 {
    right: 1.5rem;
  }

  .md\:right-\[calc\(1\.5rem-6px\)\] {
    right: calc(1.5rem - 6px);
  }

  .md\:top-\[calc\(1\.5rem-6px\)\] {
    top: calc(1.5rem - 6px);
  }

  .md\:left-18 {
    left: 4.5rem;
  }

  .md\:right-18 {
    right: 4.5rem;
  }

  .md\:left-12 {
    left: 3rem;
  }

  .md\:right-12 {
    right: 3rem;
  }

  .md\:left-6 {
    left: 1.5rem;
  }

  .md\:left-1\/2 {
    left: 50%;
  }

  .md\:left-0 {
    left: 0px;
  }

  .md\:right-0 {
    right: 0px;
  }

  .md\:z-40 {
    z-index: 40;
  }

  .md\:z-30 {
    z-index: 30;
  }

  .md\:order-3 {
    order: 3;
  }

  .md\:order-4 {
    order: 4;
  }

  .md\:col-start-4 {
    grid-column-start: 4;
  }

  .md\:col-start-3 {
    grid-column-start: 3;
  }

  .md\:col-end-4 {
    grid-column-end: 4;
  }

  .md\:-mx-3 {
    margin-left: -0.75rem;
    margin-right: -0.75rem;
  }

  .md\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .md\:-mx-0\.5 {
    margin-left: -0.125rem;
    margin-right: -0.125rem;
  }

  .md\:-mx-0 {
    margin-left: -0px;
    margin-right: -0px;
  }

  .md\:-mx-1\.25 {
    margin-left: -0.3125rem;
    margin-right: -0.3125rem;
  }

  .md\:-mx-1 {
    margin-left: -0.25rem;
    margin-right: -0.25rem;
  }

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

  .md\:-mx-6 {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
  }

  .md\:-mx-2 {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
  }

  .md\:-mx-12 {
    margin-left: -3rem;
    margin-right: -3rem;
  }

  .md\:mb-6 {
    margin-bottom: 1.5rem;
  }

  .md\:mb-2 {
    margin-bottom: 0.5rem;
  }

  .md\:mb-3 {
    margin-bottom: 0.75rem;
  }

  .md\:-mt-11 {
    margin-top: -2.75rem;
  }

  .md\:-mb-6 {
    margin-bottom: -1.5rem;
  }

  .md\:mt-6 {
    margin-top: 1.5rem;
  }

  .md\:-mb-3 {
    margin-bottom: -0.75rem;
  }

  .md\:mt-4\.5 {
    margin-top: 1.125rem;
  }

  .md\:mt-4 {
    margin-top: 1rem;
  }

  .md\:mb-0 {
    margin-bottom: 0px;
  }

  .md\:ml-0 {
    margin-left: 0px;
  }

  .md\:ml-auto {
    margin-left: auto;
  }

  .md\:-mb-16 {
    margin-bottom: -4rem;
  }

  .md\:mb-16 {
    margin-bottom: 4rem;
  }

  .md\:mb-20 {
    margin-bottom: 5rem;
  }

  .md\:mr-auto {
    margin-right: auto;
  }

  .md\:-mb-4 {
    margin-bottom: -1rem;
  }

  .md\:mb-4 {
    margin-bottom: 1rem;
  }

  .md\:mt-20 {
    margin-top: 5rem;
  }

  .md\:ml-6 {
    margin-left: 1.5rem;
  }

  .md\:mb-10 {
    margin-bottom: 2.5rem;
  }

  .md\:mb-40 {
    margin-bottom: 10rem;
  }

  .md\:mr-0 {
    margin-right: 0px;
  }

  .md\:-mb-12 {
    margin-bottom: -3rem;
  }

  .md\:-mb-24 {
    margin-bottom: -6rem;
  }

  .md\:mb-12 {
    margin-bottom: 3rem;
  }

  .md\:mb-24 {
    margin-bottom: 6rem;
  }

  .md\:mr-4 {
    margin-right: 1rem;
  }

  .md\:-mb-7 {
    margin-bottom: -1.75rem;
  }

  .md\:mb-15 {
    margin-bottom: 3.75rem;
  }

  .md\:-mb-2 {
    margin-bottom: -0.5rem;
  }

  .md\:box-content {
    box-sizing: content-box;
  }

  .md\:block {
    display: block;
  }

  .md\:flex {
    display: flex;
  }

  .md\:hidden {
    display: none;
  }

  .md\:h-auto {
    height: auto;
  }

  .md\:max-h-\[66\.67vh\] {
    max-height: 66.67vh;
  }

  .md\:min-h-\[316px\] {
    min-height: 316px;
  }

  .md\:w-2\/3 {
    width: 66.666667%;
  }

  .md\:w-1\/1 {
    width: 100%;
  }

  .md\:w-1\/2 {
    width: 50%;
  }

  .md\:w-1\/3 {
    width: 33.333333%;
  }

  .md\:w-1\/4 {
    width: 25%;
  }

  .md\:w-\[calc\(100\%-1\.5rem\)\] {
    width: calc(100% - 1.5rem);
  }

  .md\:w-\[calc\(\(100\%-1\.5rem\)\/2\)\] {
    width: calc((100% - 1.5rem) / 2);
  }

  .md\:w-\[calc\(\(100\%-1\.5rem\)\/3\)\] {
    width: calc((100% - 1.5rem) / 3);
  }

  .md\:w-\[calc\(\(100\%-1\.5rem\)\/4\)\] {
    width: calc((100% - 1.5rem) / 4);
  }

  .md\:w-3\/5 {
    width: 60%;
  }

  .md\:w-max {
    width: max-content;
  }

  .md\:w-1\/5 {
    width: 20%;
  }

  .md\:w-1\/6 {
    width: 16.666667%;
  }

  .md\:w-\[calc\(\(100\%-1\.5rem\)\/5\)\] {
    width: calc((100% - 1.5rem) / 5);
  }

  .md\:w-\[calc\(\(100\%-1\.5rem\)\/6\)\] {
    width: calc((100% - 1.5rem) / 6);
  }

  .md\:w-24 {
    width: 6rem;
  }

  .md\:w-18 {
    width: 4.5rem;
  }

  .md\:w-32 {
    width: 8rem;
  }

  .md\:w-auto {
    width: auto;
  }

  .md\:w-\[var\(--md-width\)\] {
    width: var(--md-width);
  }

  .md\:w-\[480px\] {
    width: 480px;
  }

  .md\:max-w-screen-2xl {
    max-width: 1440px;
  }

  .md\:max-w-prose {
    max-width: 65ch;
  }

  .md\:max-w-\[40ch\] {
    max-width: 40ch;
  }

  .md\:max-w-1\/4 {
    max-width: 25%;
  }

  .md\:max-w-1\/2 {
    max-width: 50%;
  }

  .md\:max-w-3\/4 {
    max-width: 75%;
  }

  .md\:flex-none {
    flex: none;
  }

  .md\:translate-y-0 {
    --tw-translate-y: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .md\:-translate-y-1\/2 {
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .md\:-translate-x-1\/2 {
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .md\:snap-none {
    scroll-snap-type: none;
  }

  .md\:snap-start {
    scroll-snap-align: start;
  }

  .md\:snap-end {
    scroll-snap-align: end;
  }

  .md\:snap-center {
    scroll-snap-align: center;
  }

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

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

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

  .md\:grid-cols-\[96px_1fr_28ch_6rem\] {
    grid-template-columns: 96px 1fr 28ch 6rem;
  }

  .md\:grid-cols-\[144px_1fr_10rem\] {
    grid-template-columns: 144px 1fr 10rem;
  }

  .md\:grid-cols-\[96px_minmax\(0\2c 1fr\)_max-content\] {
    grid-template-columns: 96px minmax(0,1fr) max-content;
  }

  .md\:grid-cols-\[72px_minmax\(0\2c 1fr\)_max-content\] {
    grid-template-columns: 72px minmax(0,1fr) max-content;
  }

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

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

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

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

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

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

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

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

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

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

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

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

  .md\:gap-4 {
    gap: 1rem;
  }

  .md\:gap-x-6 {
    column-gap: 1.5rem;
  }

  .md\:overflow-visible {
    overflow: visible;
  }

  .md\:overflow-x-auto {
    overflow-x: auto;
  }

  .md\:overflow-y-hidden {
    overflow-y: hidden;
  }

  .md\:overscroll-x-contain {
    overscroll-behavior-x: contain;
  }

  .md\:rounded-\[calc\(var\(--border-radius-other\)\+0\.75rem\)\] {
    border-radius: calc(var(--border-radius-other) + 0.75rem);
  }

  .md\:border-\[0\.75rem\] {
    border-width: 0.75rem;
  }

  .md\:p-6 {
    padding: 1.5rem;
  }

  .md\:p-4 {
    padding: 1rem;
  }

  .md\:py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .md\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .md\:px-3 {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .md\:py-1\.5 {
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
  }

  .md\:py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }

  .md\:px-0\.5 {
    padding-left: 0.125rem;
    padding-right: 0.125rem;
  }

  .md\:px-0 {
    padding-left: 0px;
    padding-right: 0px;
  }

  .md\:px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .md\:py-0 {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .md\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .md\:pr-3 {
    padding-right: 0.75rem;
  }

  .md\:pl-3 {
    padding-left: 0.75rem;
  }

  .md\:pb-0 {
    padding-bottom: 0px;
  }

  .md\:pr-0 {
    padding-right: 0px;
  }

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

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

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

  .md\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  .md\:text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .md\:scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .md\:scrollbar-hide::-webkit-scrollbar {
    display: none;
  }

  .md\:before\:absolute::before {
    content: var(--tw-content);
    position: absolute;
  }

  .md\:before\:inset-1\.5::before {
    content: var(--tw-content);
    top: 0.375rem;
    right: 0.375rem;
    bottom: 0.375rem;
    left: 0.375rem;
  }

  .md\:before\:inset-1::before {
    content: var(--tw-content);
    top: 0.25rem;
    right: 0.25rem;
    bottom: 0.25rem;
    left: 0.25rem;
  }

  .md\:before\:z-\[-1\]::before {
    content: var(--tw-content);
    z-index: -1;
  }

  .md\:before\:rounded-other::before {
    content: var(--tw-content);
    border-radius: var(--border-radius-other);
  }

  .md\:before\:bg-background::before {
    content: var(--tw-content);
    --tw-bg-opacity: 1;
    background-color: rgb(var(--color-background) / var(--tw-bg-opacity));
  }

  .before\:md\:pr-3::before {
    content: var(--tw-content);
    padding-right: 0.75rem;
  }

  .md\:first\:ml-3:first-child {
    margin-left: 0.75rem;
  }

  .md\:first\:ml-1\.25:first-child {
    margin-left: 0.3125rem;
  }

  .md\:first\:ml-1:first-child {
    margin-left: 0.25rem;
  }

  .md\:first\:ml-0:first-child {
    margin-left: 0px;
  }

  .md\:last\:mr-3:last-child {
    margin-right: 0.75rem;
  }

  .md\:last\:mr-1\.25:last-child {
    margin-right: 0.3125rem;
  }

  .md\:last\:mr-1:last-child {
    margin-right: 0.25rem;
  }

  .md\:last\:mr-0:last-child {
    margin-right: 0px;
  }

  .md\:only\:mx-auto:only-child {
    margin-left: auto;
    margin-right: auto;
  }

  .md\:only\:mr-auto:only-child {
    margin-right: auto;
  }

  .md\:only\:ml-auto:only-child {
    margin-left: auto;
  }

  .first-of-type\:md\:ml-12:first-of-type {
    margin-left: 3rem;
  }

  .last-of-type\:md\:mr-12:last-of-type {
    margin-right: 3rem;
  }
}

@media (max-width: 767px) {
  .max-md\:-mx-2 {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
  }

  .max-md\:mb-7 {
    margin-bottom: 1.75rem;
  }

  .max-md\:mb-2 {
    margin-bottom: 0.5rem;
  }

  .max-md\:-mb-4 {
    margin-bottom: -1rem;
  }

  .max-md\:mb-4 {
    margin-bottom: 1rem;
  }

  .max-md\:-mb-1 {
    margin-bottom: -0.25rem;
  }

  .max-md\:mb-1 {
    margin-bottom: 0.25rem;
  }

  .max-md\:mt-7 {
    margin-top: 1.75rem;
  }

  .max-md\:box-content {
    box-sizing: content-box;
  }

  .max-md\:block {
    display: block;
  }

  .max-md\:flex {
    display: flex;
  }

  .max-md\:hidden {
    display: none;
  }

  .max-md\:min-h-\[100vw\] {
    min-height: 100vw;
  }

  .max-md\:w-1\/1 {
    width: 100%;
  }

  .max-md\:w-1\/2 {
    width: 50%;
  }

  .max-md\:w-\[calc\(100\%-1rem\)\] {
    width: calc(100% - 1rem);
  }

  .max-md\:w-\[calc\(\(100\%-1rem\)\/2\)\] {
    width: calc((100% - 1rem) / 2);
  }

  .max-md\:max-w-screen-2xl {
    max-width: 1440px;
  }

  .max-md\:flex-none {
    flex: none;
  }

  .max-md\:flex-col-reverse {
    flex-direction: column-reverse;
  }

  .max-md\:flex-wrap {
    flex-wrap: wrap;
  }

  .max-md\:overflow-x-auto {
    overflow-x: auto;
  }

  .max-md\:overflow-y-hidden {
    overflow-y: hidden;
  }

  .max-md\:overscroll-x-contain {
    overscroll-behavior-x: contain;
  }

  .max-md\:px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .max-md\:px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .max-md\:py-1\.5 {
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
  }

  .max-md\:py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }

  .max-md\:scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .max-md\:scrollbar-hide::-webkit-scrollbar {
    display: none;
  }

  .max-md\:first\:ml-2:first-child {
    margin-left: 0.5rem;
  }

  .max-md\:last\:mr-2:last-child {
    margin-right: 0.5rem;
  }
}

@media (min-width: 1024px) {
  .lg\:sticky {
    position: sticky;
  }

  .lg\:top-6 {
    top: 1.5rem;
  }

  .lg\:mb-7 {
    margin-bottom: 1.75rem;
  }

  .lg\:mt-0 {
    margin-top: 0px;
  }

  .lg\:inline {
    display: inline;
  }

  .lg\:w-4\/10 {
    width: 40%;
  }

  .lg\:w-3\/10 {
    width: 30%;
  }

  .lg\:w-1\/1 {
    width: 100%;
  }

  .lg\:w-3\/4 {
    width: 75%;
  }

  .lg\:w-1\/2 {
    width: 50%;
  }

  .lg\:w-3\/5 {
    width: 60%;
  }

  .lg\:w-2\/5 {
    width: 40%;
  }

  .lg\:w-1\/3 {
    width: 33.333333%;
  }

  .lg\:w-1\/4 {
    width: 25%;
  }

  .lg\:w-\[35\.333333\%\] {
    width: 35.333333%;
  }

  .lg\:w-\[41\.333333\%\] {
    width: 41.333333%;
  }

  .lg\:w-\[29\.333333\%\] {
    width: 29.333333%;
  }

  .lg\:grid-cols-\[96px_1fr_28ch_10rem\] {
    grid-template-columns: 96px 1fr 28ch 10rem;
  }
}

@media (max-width: 1023px) {
  .max-lg\:button--square {
    display: flex;
    height: 3rem;
    width: 3rem;
    align-items: center;
    justify-content: center;
    padding: 0px;
  }
}

@media (min-width: 1280px) {
  .xl\:absolute {
    position: absolute;
  }

  .xl\:right-1\.25 {
    right: 0.3125rem;
  }

  .xl\:top-1\.25 {
    top: 0.3125rem;
  }

  .xl\:right-1 {
    right: 0.25rem;
  }

  .xl\:top-1 {
    top: 0.25rem;
  }

  .xl\:bottom-0 {
    bottom: 0px;
  }

  .xl\:left-0 {
    left: 0px;
  }

  .xl\:top-0 {
    top: 0px;
  }

  .xl\:top-8 {
    top: 2rem;
  }

  .xl\:right-\[53px\] {
    right: 53px;
  }

  .xl\:top-\[23px\] {
    top: 23px;
  }

  .xl\:bottom-8 {
    bottom: 2rem;
  }

  .xl\:right-8 {
    right: 2rem;
  }

  .xl\:right-\[calc\(2rem-6px\)\] {
    right: calc(2rem - 6px);
  }

  .xl\:top-\[calc\(2rem-6px\)\] {
    top: calc(2rem - 6px);
  }

  .xl\:left-44 {
    left: 11rem;
  }

  .xl\:right-44 {
    right: 11rem;
  }

  .xl\:left-36 {
    left: 9rem;
  }

  .xl\:right-36 {
    right: 9rem;
  }

  .xl\:left-8 {
    left: 2rem;
  }

  .xl\:z-30 {
    z-index: 30;
  }

  .xl\:-mx-4 {
    margin-left: -1rem;
    margin-right: -1rem;
  }

  .xl\:my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .xl\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .xl\:my-2 {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }

  .xl\:-mx-8 {
    margin-left: -2rem;
    margin-right: -2rem;
  }

  .xl\:mb-8 {
    margin-bottom: 2rem;
  }

  .xl\:mb-4 {
    margin-bottom: 1rem;
  }

  .xl\:-mb-8 {
    margin-bottom: -2rem;
  }

  .xl\:mt-8 {
    margin-top: 2rem;
  }

  .xl\:-mb-5 {
    margin-bottom: -1.25rem;
  }

  .xl\:mb-5 {
    margin-bottom: 1.25rem;
  }

  .xl\:mt-4 {
    margin-top: 1rem;
  }

  .xl\:mt-10\.5 {
    margin-top: 2.625rem;
  }

  .xl\:mt-10 {
    margin-top: 2.5rem;
  }

  .xl\:ml-32 {
    margin-left: 8rem;
  }

  .xl\:ml-26 {
    margin-left: 6.5rem;
  }

  .xl\:mt-0 {
    margin-top: 0px;
  }

  .xl\:ml-8 {
    margin-left: 2rem;
  }

  .xl\:mb-20 {
    margin-bottom: 5rem;
  }

  .xl\:ml-0 {
    margin-left: 0px;
  }

  .xl\:mr-2 {
    margin-right: 0.5rem;
  }

  .xl\:mb-0 {
    margin-bottom: 0px;
  }

  .xl\:mt-5 {
    margin-top: 1.25rem;
  }

  .xl\:-mb-16 {
    margin-bottom: -4rem;
  }

  .xl\:-mb-32 {
    margin-bottom: -8rem;
  }

  .xl\:mb-16 {
    margin-bottom: 4rem;
  }

  .xl\:mb-32 {
    margin-bottom: 8rem;
  }

  .xl\:mr-4 {
    margin-right: 1rem;
  }

  .xl\:block {
    display: block;
  }

  .xl\:grid {
    display: grid;
  }

  .xl\:hidden {
    display: none;
  }

  .xl\:h-1\/1 {
    height: 100%;
  }

  .xl\:min-h-\[414px\] {
    min-height: 414px;
  }

  .xl\:w-\[calc\(100\%-2rem\)\] {
    width: calc(100% - 2rem);
  }

  .xl\:w-\[calc\(\(100\%-2rem\)\/2\)\] {
    width: calc((100% - 2rem) / 2);
  }

  .xl\:w-\[calc\(\(100\%-2rem\)\/3\)\] {
    width: calc((100% - 2rem) / 3);
  }

  .xl\:w-\[calc\(\(100\%-2rem\)\/4\)\] {
    width: calc((100% - 2rem) / 4);
  }

  .xl\:w-\[calc\(45\%\+2rem\+96px\)\] {
    width: calc(45% + 2rem + 96px);
  }

  .xl\:w-\[calc\(45\%\+2rem\+72px\)\] {
    width: calc(45% + 2rem + 72px);
  }

  .xl\:w-\[calc\(50\%\+2rem\+96px\)\] {
    width: calc(50% + 2rem + 96px);
  }

  .xl\:w-\[calc\(50\%\+2rem\+72px\)\] {
    width: calc(50% + 2rem + 72px);
  }

  .xl\:w-\[calc\(55\%\+2rem\+96px\)\] {
    width: calc(55% + 2rem + 96px);
  }

  .xl\:w-\[calc\(55\%\+2rem\+72px\)\] {
    width: calc(55% + 2rem + 72px);
  }

  .xl\:w-24 {
    width: 6rem;
  }

  .xl\:w-18 {
    width: 4.5rem;
  }

  .xl\:w-\[calc\(55\%-2rem-96px\)\] {
    width: calc(55% - 2rem - 96px);
  }

  .xl\:w-\[calc\(55\%-2rem-72px\)\] {
    width: calc(55% - 2rem - 72px);
  }

  .xl\:w-\[calc\(50\%-2rem-96px\)\] {
    width: calc(50% - 2rem - 96px);
  }

  .xl\:w-\[calc\(50\%-2rem-72px\)\] {
    width: calc(50% - 2rem - 72px);
  }

  .xl\:w-\[calc\(45\%-2rem-96px\)\] {
    width: calc(45% - 2rem - 96px);
  }

  .xl\:w-\[calc\(45\%-2rem-72px\)\] {
    width: calc(45% - 2rem - 72px);
  }

  .xl\:w-3\/4 {
    width: 75%;
  }

  .xl\:w-auto {
    width: auto;
  }

  .xl\:w-2\/3 {
    width: 66.666667%;
  }

  .xl\:w-1\/4 {
    width: 25%;
  }

  .xl\:w-\[calc\(\(100\%-2rem\)\/5\)\] {
    width: calc((100% - 2rem) / 5);
  }

  .xl\:w-\[calc\(\(100\%-2rem\)\/6\)\] {
    width: calc((100% - 2rem) / 6);
  }

  .xl\:w-\[288px\] {
    width: 288px;
  }

  .xl\:w-\[208px\] {
    width: 208px;
  }

  .xl\:max-w-1\/4 {
    max-width: 25%;
  }

  .xl\:max-w-\[960px\] {
    max-width: 960px;
  }

  .xl\:grid-cols-\[144px_1fr_32ch_10rem\] {
    grid-template-columns: 144px 1fr 32ch 10rem;
  }

  .xl\:grid-cols-\[4\.5rem_6rem_1fr_1fr_6\.5rem\] {
    grid-template-columns: 4.5rem 6rem 1fr 1fr 6.5rem;
  }

  .xl\:grid-rows-\[auto\] {
    grid-template-rows: auto;
  }

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

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

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

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

  .xl\:gap-x-8 {
    column-gap: 2rem;
  }

  .xl\:overflow-y-auto {
    overflow-y: auto;
  }

  .xl\:overflow-x-hidden {
    overflow-x: hidden;
  }

  .xl\:rounded-\[calc\(var\(--border-radius-other\)\+1rem\)\] {
    border-radius: calc(var(--border-radius-other) + 1rem);
  }

  .xl\:border-\[1rem\] {
    border-width: 1rem;
  }

  .xl\:border-b {
    border-bottom-width: 1px;
  }

  .xl\:border-b-body-text\/25 {
    border-bottom-color: rgb(var(--color-body-text) / 0.25);
  }

  .xl\:p-4 {
    padding: 1rem;
  }

  .xl\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .xl\:px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .xl\:px-1\.25 {
    padding-left: 0.3125rem;
    padding-right: 0.3125rem;
  }

  .xl\:px-1 {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }

  .xl\:py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .xl\:py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }

  .xl\:pt-4 {
    padding-top: 1rem;
  }

  .xl\:pl-4 {
    padding-left: 1rem;
  }

  .xl\:pr-4 {
    padding-right: 1rem;
  }

  .xl\:pl-0 {
    padding-left: 0px;
  }

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

  .xl\:text-4xl {
    font-size: 2.5rem;
    line-height: 2.75rem;
  }

  .xl\:before\:absolute::before {
    content: var(--tw-content);
    position: absolute;
  }

  .xl\:before\:inset-1\.5::before {
    content: var(--tw-content);
    top: 0.375rem;
    right: 0.375rem;
    bottom: 0.375rem;
    left: 0.375rem;
  }

  .xl\:before\:inset-1::before {
    content: var(--tw-content);
    top: 0.25rem;
    right: 0.25rem;
    bottom: 0.25rem;
    left: 0.25rem;
  }

  .xl\:before\:z-\[-1\]::before {
    content: var(--tw-content);
    z-index: -1;
  }

  .xl\:before\:hidden::before {
    content: var(--tw-content);
    display: none;
  }

  .xl\:before\:rounded-other::before {
    content: var(--tw-content);
    border-radius: var(--border-radius-other);
  }

  .xl\:before\:bg-background::before {
    content: var(--tw-content);
    --tw-bg-opacity: 1;
    background-color: rgb(var(--color-background) / var(--tw-bg-opacity));
  }

  .xl\:first\:ml-4:first-child {
    margin-left: 1rem;
  }

  .xl\:first\:ml-0:first-child {
    margin-left: 0px;
  }

  .xl\:first\:mt-0:first-child {
    margin-top: 0px;
  }

  .xl\:last\:mr-4:last-child {
    margin-right: 1rem;
  }

  .xl\:last\:mb-0:last-child {
    margin-bottom: 0px;
  }

  .xl\:last\:mr-0:last-child {
    margin-right: 0px;
  }

  .xl\:only\:mx-auto:only-child {
    margin-left: auto;
    margin-right: auto;
  }

  .xl\:only\:mr-auto:only-child {
    margin-right: auto;
  }

  .xl\:only\:ml-auto:only-child {
    margin-left: auto;
  }

  .first-of-type\:xl\:ml-0:first-of-type {
    margin-left: 0px;
  }

  .last-of-type\:xl\:mr-0:last-of-type {
    margin-right: 0px;
  }

  @media (min-width: 768px) {
    .xl\:md\:-mx-8 {
      margin-left: -2rem;
      margin-right: -2rem;
    }
  }
}

@media (max-width: 1279px) {
  .max-xl\: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;
  }

  .max-xl\:-mb-4 {
    margin-bottom: -1rem;
  }

  .max-xl\:border-b {
    border-bottom-width: 1px;
  }

  .max-xl\:border-b-body-text\/25 {
    border-bottom-color: rgb(var(--color-body-text) / 0.25);
  }

  .max-xl\:scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  .max-xl\:scrollbar-hide::-webkit-scrollbar {
    display: none;
  }
}

@media (min-width: 1440px) {
  .\32xl\:top-10 {
    top: 2.5rem;
  }

  .\32xl\:bottom-10 {
    bottom: 2.5rem;
  }

  .\32xl\:right-10 {
    right: 2.5rem;
  }

  .\32xl\:right-\[calc\(2\.5rem-6px\)\] {
    right: calc(2.5rem - 6px);
  }

  .\32xl\:top-\[calc\(2\.5rem-6px\)\] {
    top: calc(2.5rem - 6px);
  }

  .\32xl\:left-46 {
    left: 11.5rem;
  }

  .\32xl\:right-46 {
    right: 11.5rem;
  }

  .\32xl\:left-10 {
    left: 2.5rem;
  }

  .\32xl\:-mx-5 {
    margin-left: -1.25rem;
    margin-right: -1.25rem;
  }

  .\32xl\:-mx-10 {
    margin-left: -2.5rem;
    margin-right: -2.5rem;
  }

  .\32xl\:mb-10 {
    margin-bottom: 2.5rem;
  }

  .\32xl\:mb-5 {
    margin-bottom: 1.25rem;
  }

  .\32xl\:-mb-10 {
    margin-bottom: -2.5rem;
  }

  .\32xl\:mt-10 {
    margin-top: 2.5rem;
  }

  .\32xl\:-mb-7 {
    margin-bottom: -1.75rem;
  }

  .\32xl\:mb-7 {
    margin-bottom: 1.75rem;
  }

  .\32xl\:ml-34 {
    margin-left: 8.5rem;
  }

  .\32xl\:ml-28 {
    margin-left: 7rem;
  }

  .\32xl\:-mb-20 {
    margin-bottom: -5rem;
  }

  .\32xl\:mb-20 {
    margin-bottom: 5rem;
  }

  .\32xl\:ml-10 {
    margin-left: 2.5rem;
  }

  .\32xl\:-mb-40 {
    margin-bottom: -10rem;
  }

  .\32xl\:mb-40 {
    margin-bottom: 10rem;
  }

  .\32xl\:w-\[calc\(100\%-2\.5rem\)\] {
    width: calc(100% - 2.5rem);
  }

  .\32xl\:w-\[calc\(\(100\%-2\.5rem\)\/2\)\] {
    width: calc((100% - 2.5rem) / 2);
  }

  .\32xl\:w-\[calc\(\(100\%-2\.5rem\)\/3\)\] {
    width: calc((100% - 2.5rem) / 3);
  }

  .\32xl\:w-\[calc\(\(100\%-2\.5rem\)\/4\)\] {
    width: calc((100% - 2.5rem) / 4);
  }

  .\32xl\:w-\[calc\(45\%\+2\.5rem\+96px\)\] {
    width: calc(45% + 2.5rem + 96px);
  }

  .\32xl\:w-\[calc\(45\%\+2\.5rem\+72px\)\] {
    width: calc(45% + 2.5rem + 72px);
  }

  .\32xl\:w-\[calc\(50\%\+2\.5rem\+96px\)\] {
    width: calc(50% + 2.5rem + 96px);
  }

  .\32xl\:w-\[calc\(50\%\+2\.5rem\+72px\)\] {
    width: calc(50% + 2.5rem + 72px);
  }

  .\32xl\:w-\[calc\(55\%\+2\.5rem\+96px\)\] {
    width: calc(55% + 2.5rem + 96px);
  }

  .\32xl\:w-\[calc\(55\%\+2\.5rem\+72px\)\] {
    width: calc(55% + 2.5rem + 72px);
  }

  .\32xl\:w-\[calc\(55\%-2\.5rem-96px\)\] {
    width: calc(55% - 2.5rem - 96px);
  }

  .\32xl\:w-\[calc\(55\%-2\.5rem-72px\)\] {
    width: calc(55% - 2.5rem - 72px);
  }

  .\32xl\:w-\[calc\(50\%-2\.5rem-96px\)\] {
    width: calc(50% - 2.5rem - 96px);
  }

  .\32xl\:w-\[calc\(50\%-2\.5rem-72px\)\] {
    width: calc(50% - 2.5rem - 72px);
  }

  .\32xl\:w-\[calc\(45\%-2\.5rem-96px\)\] {
    width: calc(45% - 2.5rem - 96px);
  }

  .\32xl\:w-\[calc\(45\%-2\.5rem-72px\)\] {
    width: calc(45% - 2.5rem - 72px);
  }

  .\32xl\:w-1\/6 {
    width: 16.666667%;
  }

  .\32xl\:w-\[calc\(\(100\%-2\.5rem\)\/5\)\] {
    width: calc((100% - 2.5rem) / 5);
  }

  .\32xl\:w-\[calc\(\(100\%-2\.5rem\)\/6\)\] {
    width: calc((100% - 2.5rem) / 6);
  }

  .\32xl\:grid-cols-\[144px_1fr_36ch_10rem\] {
    grid-template-columns: 144px 1fr 36ch 10rem;
  }

  .\32xl\:gap-x-10 {
    column-gap: 2.5rem;
  }

  .\32xl\:rounded-\[calc\(var\(--border-radius-other\)\+1\.25rem\)\] {
    border-radius: calc(var(--border-radius-other) + 1.25rem);
  }

  .\32xl\:border-\[1\.25rem\] {
    border-width: 1.25rem;
  }

  .\32xl\:px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .\32xl\:px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .\32xl\:py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .\32xl\:pl-5 {
    padding-left: 1.25rem;
  }

  .\32xl\:pr-5 {
    padding-right: 1.25rem;
  }

  .\32xl\:first\:ml-5:first-child {
    margin-left: 1.25rem;
  }

  .\32xl\:last\:mr-5:last-child {
    margin-right: 1.25rem;
  }
}

@media (min-width: 1520px) {
  .\33xl\:right-\[calc\(\(\(100\%-1440px\)\/2\)-6px\)\] {
    right: calc(((100% - 1440px) / 2) - 6px);
  }

  .\33xl\:left-\[calc\(\(\(100\%-1440px\)\/2\)\+40px\)\] {
    left: calc(((100% - 1440px) / 2) + 40px);
  }

  .\33xl\:right-\[calc\(\(\(100\%-1440px\)\/2\)\+40px\)\] {
    right: calc(((100% - 1440px) / 2) + 40px);
  }

  .\33xl\:left-\[calc\(\(100\%-1440px\)\/2\)\] {
    left: calc((100% - 1440px) / 2);
  }

  .\33xl\:right-\[calc\(\(100\%-1440px\)\/2\)\] {
    right: calc((100% - 1440px) / 2);
  }

  .\33xl\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }

  .\33xl\:ml-\[calc\(\(100\%-1520px\)\)\/2\] {
    margin-left: calc((100% - 1520px))/2;
  }

  .\33xl\:mr-\[calc\(\(100\%-1520px\)\/2\)\] {
    margin-right: calc((100% - 1520px) / 2);
  }

  .\33xl\:min-h-\[512px\] {
    min-height: 512px;
  }

  .\33xl\:w-1\/1 {
    width: 100%;
  }

  .\33xl\:w-\[1480px\] {
    width: 1480px;
  }

  .\33xl\:w-\[740px\] {
    width: 740px;
  }

  .\33xl\:w-\[493\.333333px\] {
    width: 493.333333px;
  }

  .\33xl\:w-\[370px\] {
    width: 370px;
  }

  .\33xl\:w-\[296px\] {
    width: 296px;
  }

  .\33xl\:w-\[246\.666667px\] {
    width: 246.666667px;
  }

  .\33xl\:px-\[calc\(\(100\%-1440px\)\/2\)\] {
    padding-left: calc((100% - 1440px) / 2);
    padding-right: calc((100% - 1440px) / 2);
  }

  .\33xl\:first\:ml-\[calc\(\(\(100\%-1440px\)\/2\)-1\.25rem\)\]:first-child {
    margin-left: calc(((100% - 1440px) / 2) - 1.25rem);
  }

  .\33xl\:last\:mr-\[calc\(\(\(100\%-1440px\)\/2\)-1\.25rem\)\]:last-child {
    margin-right: calc(((100% - 1440px) / 2) - 1.25rem);
  }
}

.\[\&\>mark\]\:bg-transparent>mark {
  background-color: transparent;
}

.\[\&\>mark\]\:font-normal-body>mark {
  font-weight: var(--font-body-weight);
}

/* === Fontes personalizadas === */

/* Títulos - base (mantém sua família/peso) */
h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat", sans-serif !important; /* ✅ Fonte Montserrat */ 
  font-weight: 900 !important; /* ✅ Black */ 
  font-style: normal !important;
  font-weight: 700 !important;
}

/* Redução proporcional SOMENTE no mobile */
@media (max-width: 767.98px) {
  h1 { font-size: 1.75rem !important; line-height: 1.2 !important; }   /* ~28px */
  h2 { font-size: 1.50rem !important; line-height: 1.25 !important; }  /* ~24px */
  h3 { font-size: 1.25rem !important; line-height: 1.3 !important; }   /* ~20px */
  h4 { font-size: 1.125rem !important; line-height: 1.35 !important; } /* ~18px */
  h5 { font-size: 1.00rem !important; line-height: 1.4 !important; }   /* ~16px */
  h6 { font-size: 0.95rem !important; line-height: 1.45 !important; }  /* ~15px */

  /* Ajuste fino dentro do slideshow (opcional e recomendado) */
  ce-slideshow [data-slideshow-mouse-target] h2 {
    font-size: 1.35rem !important; /* ~21.6px */
  }
  ce-slideshow [data-slideshow-mouse-target] h4,
  ce-slideshow [data-slideshow-mouse-target] h4.text-subheading {
    font-size: 0.95rem !important; /* ~15px */
    font-weight: 600 !important;   /* subheading um pouco mais leve */
  }
}

/* Textos e descrições */
body, p, a, li, span, div {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 500 !important;
}

/* === Slideshow: tipografia e tamanhos === */
/* TÍTULO = Montserrat Black */
ce-slideshow h2 {
  font-family: "Montserrat", sans-serif !important; /* ✅ Fonte Montserrat */ 
  font-weight: 900 !important; /* ✅ Black */ 
  font-style: normal !important;
  /* tamanho responsivo (ajuste os limites conforme desejar) */
  font-size: clamp(28px, 5vw, 60px) !important;
  line-height: 1.1 !important;
}

/* Mobile: deixa o h2 do PRIMEIRO slide um pouco maior */
@media (max-width: 767.98px){
  ce-slideshow [data-position="0"] h2 {
    font-size: 2.40rem !important; /* ~25.6px: só um pouco maior que 1.35rem */
    line-height: 1.2 !important;
  }
}


/* SUBTÍTULO e DESCRIÇÃO = Montserrat Medium */
ce-slideshow .text-subheading,
ce-slideshow .rte,
ce-slideshow .rte p,
ce-slideshow .rte span {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 500 !important;
  font-size: clamp(14px, 1.6vw, 20px) !important; /* ajuste se quiser maior/menor */
  line-height: 1.5 !important;
}

/* Botões do slide (opcional, para harmonizar com Montserrat) */
ce-slideshow .button {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 500 !important;
}

/* Quebras específicas por breakpoint (opcional) */
@media (min-width: 768px){
  ce-slideshow h2 { font-size: clamp(36px, 4vw, 64px) !important; }
  ce-slideshow .rte, 
  ce-slideshow .text-subheading { font-size: clamp(16px, 1.4vw, 22px) !important; }
}

/* Se o tema aplicar estilos inline muito fortes, aumente a especificidade: */
.color-scheme-{{ section.settings.color_scheme }} ce-slideshow h2 { 
  font-family: "Montserrat", sans-serif !important; /* ✅ Fonte Montserrat */ 
  font-weight: 900 !important; /* ✅ Black */ 
  font-style: normal !important; 
}
.color-scheme-{{ section.settings.color_scheme }} ce-slideshow .text-subheading,
.color-scheme-{{ section.settings.color_scheme }} ce-slideshow .rte {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 500 !important;
}

/* === Personalização do botão do slideshow === */
ce-slideshow .button--primary {
  background-color: #315B47 !important;   /* Cor de fundo */
  color: #FFFFFF !important;              /* ✅ Cor do texto */
  font-family: "Montserrat", sans-serif !important;
  font-weight: 700 !important;            /* Bold */
  border: none !important;
  border-radius: 40px !important;
  padding: 14px 36px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  transition: all 0.3s ease !important;
}

ce-slideshow .button--primary:hover {
  background-color: #315B47 !important;   /* tom mais escuro ao passar o mouse */
  color: #FFFFFF !important;              /* ✅ mantém a cor do texto */
}

/* === Títulos do slideshow === */
ce-slideshow h2 {
  font-family: "Montserrat", sans-serif !important; /* ✅ Fonte Montserrat */
  font-weight: 900 !important;                      /* ✅ Black */
  font-style: normal !important;
  font-size: clamp(36px, 6vw, 80px) !important;     /* ✅ Responsivo */
  /* - 36px = tamanho mínimo em telas menores (mobile/tablet pequeno)
     - 6vw  = tamanho fluido conforme a largura da tela
     - 80px = tamanho máximo em telas grandes (desktop) */
  line-height: 1.1 !important;
  letter-spacing: -0.5px !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
}



/* === Descrição e subtítulo do slideshow === */
ce-slideshow .text-subheading,
ce-slideshow .rte,
ce-slideshow .rte p,
ce-slideshow .rte span {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 500 !important;
  font-size: clamp(14px, 1.6vw, 20px) !important;
  line-height: 1.5 !important;
}

/* === Títulos do rodapé === */
footer h4.break-words,
.site-footer h4.break-words,
.shopify-section-footer h4.break-words {
  color: #FFD525 !important; /* ✅ Amarelo da paleta */
}

/* Força a cor dos títulos do rodapé (vence o <style> inline) */
#shopify-section-sections--26915534438749__footer h4 {
  color: #FFD525 !important;
}

/* Força título e subtítulo em branco só no mobile dentro do slideshow */
@media (max-width: 767.98px){
  ce-slideshow [data-slideshow-mouse-target] h2,
  ce-slideshow [data-slideshow-mouse-target] h4.text-subheading{
    color: #fff !important;
  }
}



@media (max-width: 767.98px){
  /* Subheading (Montserrat) acima do título — 3x menor no mobile, agora em bold */
  ce-slideshow h4.text-subheading.text-center.break-words,
  .shopify-section [id^="slideshow--"] h4.text-subheading.text-center.break-words,
  .shopify-section .slideshow h4.text-subheading.text-center.break-words,
  h4.text-subheading.text-center.break-words {
    font-size: 0.75rem !important;     /* ~12px */
    line-height: 1.2 !important;
    letter-spacing: 0.12em !important;
    font-weight: 700 !important;       /* BOLD */
  }
}

/* MENU MOBILE: fundo branco + sombra leve (fechado e aberto) */
summary.button.button--primary[aria-controls="header__mobile-navigation"],
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"] {
  /* se o tema usa variáveis, sobrescreve aqui no próprio elemento */
  --color-link: 255 255 255;   /* fundo do .button--primary */
  --color-link-alt: 17 17 17;  /* cor do texto/overlay */

  /* força o branco contra qualquer regra anterior */
  background: #fff !important;
  background-color: #fff !important;
  background-image: none !important;

  color: rgb(var(--color-link-alt)) !important;

  /* visual */
  border: 1px solid rgba(0,0,0,.10) !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.12) !important;
  overflow: hidden; /* impede ::before de “vazar” os cantos */
  transition: box-shadow .2s ease, transform .05s ease;
}

/* tira qualquer película/gradiente que o tema põe por cima */
summary.button.button--primary[aria-controls="header__mobile-navigation"]::before,
summary.button.button--primary[aria-controls="header__mobile-navigation"]::after,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]::before,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]::after {
  background: transparent !important;      /* sem amarelo */
  background-image: none !important;
}

/* hover/active/focus */
summary.button.button--primary[aria-controls="header__mobile-navigation"]:hover,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:hover {
  box-shadow: 0 10px 24px rgba(0,0,0,.16) !important;
}

summary.button.button--primary[aria-controls="header__mobile-navigation"]:active,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:active {
  transform: translateY(1px);
}

summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus-visible,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus-visible {
  outline: none;
  box-shadow:
    0 6px 16px rgba(0,0,0,.12) !important,
    0 0 0 3px rgba(0,0,0,.20) !important;
}

/* MENU MOBILE — fundo branco, sem contorno amarelo e sombra um pouco mais forte */
summary.button.button--primary[aria-controls="header__mobile-navigation"],
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"] {
  /* não defina position aqui; preserve a classe .fixed do HTML */
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  /* sombra levemente mais forte que antes */
  box-shadow: 0 8px 18px rgba(0,0,0,.14) !important;
  overflow: hidden !important;
  color: #111 !important;

  /* zera qualquer contorno/borda do tema */
  outline: none !important;
  outline-color: transparent !important;
  -webkit-tap-highlight-color: transparent;
}

/* Overlay branco por cima de qualquer fundo do tema */
summary.button.button--primary[aria-controls="header__mobile-navigation"]::after,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: #fff !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Empurra a película do tema pra trás e neutraliza */
summary.button.button--primary[aria-controls="header__mobile-navigation"]::before,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]::before {
  z-index: -1 !important;
  background: transparent !important;
  background-image: none !important;
}

/* Conteúdo acima do overlay */
summary.button.button--primary[aria-controls="header__mobile-navigation"] > *,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"] > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Hover/active: sombra um pouquinho mais forte */
summary.button.button--primary[aria-controls="header__mobile-navigation"]:hover,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:hover {
  box-shadow: 0 12px 28px rgba(0,0,0,.18) !important;
}
summary.button.button--primary[aria-controls="header__mobile-navigation"]:active,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:active {
  transform: translateY(1px);
}

/* Focus visível sem amarelo (substitui o do tema) */
summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus-visible,
details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus-visible {
  outline: none !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.18) !important,   /* mantém a sombra forte no foco */
    0 0 0 3px rgba(0,0,0,.20) !important;     /* anel de foco neutro (sem amarelo) */
}

summary.button.button--primary[aria-controls="header__mobile-navigation"] {
  border-color: rgba(0,0,0,.10) !important; /* garante que não herde amarelo */
}

/* MENU MOBILE — branco, sombra + sem “contorno” amarelo */
header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""],
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""] {
  /* não altere position; preserve .fixed */
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,.10) !important;

  /* sombra levemente mais forte */
  box-shadow: 0 10px 22px rgba(0,0,0,.16) !important;

  /* zera qualquer contorno/anel de foco amarelo */
  outline: none !important;
  outline-color: transparent !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.16) !important; /* reafirma a sombra acima */
  -webkit-tap-highlight-color: transparent;

  /* cor do texto/ícones */
  color: #111 !important;

  /* impede vazamento de pseudo-elements */
  overflow: hidden !important;
}

/* Overlay BRANCO por cima de qualquer fundo do tema (independe da ordem) */
header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]::after,
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: #fff !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Se o tema usar película/gradiente no ::before, empurre pra trás e neutralize */
header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]::before,
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]::before {
  z-index: -1 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Conteúdo acima do overlay branco */
header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""] > *,
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""] > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Hover/active/focus: mantém sombra um pouco mais forte e sem amarelo */
header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:hover,
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,.20) !important;
}

header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:active,
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:active {
  transform: translateY(1px);
}

header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:focus,
header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:focus-visible,
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:focus,
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""]:focus-visible {
  outline: none !important;
  /* anel de foco neutro (sem amarelo) + sombra */
  box-shadow:
    0 14px 28px rgba(0,0,0,.20) !important,
    0 0 0 3px rgba(0,0,0,.18) !important;
  border-color: rgba(0,0,0,.10) !important;
}

/* MENU MOBILE — fundo branco direto (sem overlay), sombra e sem anel amarelo */
header summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""],
header details[open] > summary.button.button--primary.fixed.bottom-4.left-4.right-4.flex[aria-controls="header__mobile-navigation"][data-dialog-button-toggle=""] {
  /* preserve .fixed; não defina position aqui */
  /* força o fundo branco contra qualquer tema/variável/gradiente */
  --color-link: 255 255 255 !important;   /* alguns temas usam essa var no background */
  background: #fff !important;
  background-color: #fff !important;
  background-image: none !important;
  background-clip: padding-box !important;

  /* visual */
  color: #111 !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 12px !important;
  outline: 0 !important;
  box-shadow: none !important;             /* eliminamos rings/shadows do tema */
  --tw-shadow: none !important;
  --tw-ring-shadow: 0 0 #0000 !important;
  --tw-ring-offset-shadow: 0 0 #0000 !important;
  filter: drop-shadow(0 12px 26px rgba(0,0,0,.18)) !important; /* sombra externa */
  overflow: hidden !important;             /* garante os cantos */
  -webkit-tap-highlight-color: transparent;
  transition: filter .2s ease, transform .05s ease;
}

/* Neutraliza a película do tema sem mexer em z-index (evita bug de clique) */
header summary.button.button--primary[aria-controls="header__mobile-navigation"]::before,
header details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]::before {
  background: transparent !important;
  background-image: none !important;
  /* importante: não mude o z-index aqui */
  pointer-events: none !important; /* garante que não capture o toque */
}

/* Conteúdo normal (sem z-index extra) */
header summary.button.button--primary[aria-controls="header__mobile-navigation"] > *,
header details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"] > * {
  position: relative; /* sem z-index pra não criar novos contextos */
}

/* Hover/active/focus: só a sombra mais forte, sem anel */
header summary.button.button--primary[aria-controls="header__mobile-navigation"]:hover,
header details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:hover {
  filter: drop-shadow(0 16px 30px rgba(0,0,0,.20)) !important;
}
header summary.button.button--primary[aria-controls="header__mobile-navigation"]:active,
header details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:active {
  transform: translateY(1px);
}
header summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus,
header summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus-visible,
header details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus,
header details[open] > summary.button.button--primary[aria-controls="header__mobile-navigation"]:focus-visible {
  outline: 0 !important;
  filter: drop-shadow(0 16px 30px rgba(0,0,0,.20)) !important;
}

[data-cart-free-shipping-progress-bar],
[data-cart-free-shipping-message] {
  display: none !important;
}


/* Estilo dos "divisores" desabilitados nos <select> */
.gpo-select select option[disabled][data-divider] {
  font-weight: 600;
  color: #444;        /* ajuste conforme a paleta */
  background: #f3f3f3;/* leve contraste */
}

/* Anti-hide do Header */
.shopify-section-header,
#site-header,
.header-wrapper,
.header { display:block !important; visibility:visible !important; opacity:1 !important; transform:none !important; }


/* Anti-hide Header */
.shopify-section-header,
#site-header,
.header-wrapper,
.header{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  transform:none !important;
}

/* Força visibilidade do header em todos os temas */
.shopify-section-header,
#site-header,
.header-wrapper,
.header{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  transform:none !important;
}

/* Controle claro de desktop x mobile sem utilidades md:* */
.cdb-header-desktop{ display:none !important; }
.cdb-header-mobile{ display:flex !important; }

@media (min-width: 768px){
  .cdb-header-desktop{ display:grid !important; }
  .cdb-header-mobile{ display:none !important; }
}

/* Header – estilo Attena-like */
.cdb-header-desktop{ min-height:78px; padding:12px 0; }
.cdb-logo{ display:block; height:40px; width:auto; }          /* ajuste fino conforme desejar */

.cdb-main-link,
.cdb-small-link{
  font-size:16px;               /* letras maiores e uniformes */
  line-height:1;
  color: #12233b;               /* tom escuro similar Attena */
  text-decoration:none;
  padding:10px 6px;             /* “respiro” vertical */
  font-weight:500;
}
.cdb-main-link:hover,
.cdb-small-link:hover{ opacity:.8; }

.cdb-divider{
  display:inline-block;
  width:1px; height:22px;
  background:rgba(0,0,0,.15);
  margin:0 4px;
}

.cdb-icon{
  display:inline-flex; align-items:center; justify-content:center;
  padding:4px; text-decoration:none;
}
.cdb-icon img{ height:22px; width:auto; display:block; }
.cdb-icon:hover{ opacity:.8; }


/* ==== HEADER – proporções finais (substitui o bloco anterior) ==== */

/* Linha do header + padding topo/baixo */
.cdb-header-desktop{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  padding:20px 0 !important;      /* + espaço vertical */
  min-height:80px;
}

/* Esquerda: logo + menu principal */
.cdb-left{
  display:flex; align-items:center;
  gap:28px;
  flex:1 1 auto;
  min-width:0;
}

/* Logo (+25px) */
.cdb-logo-wrap{display:flex; align-items:center; line-height:0; min-width:0;}
.cdb-logo{
  height:75px !important;         /* era ~50px */
  width:auto !important;
  max-height:none !important;
  display:block;
}
@media (min-width:1280px){
  .cdb-logo{ height:78px !important; }
}

/* Menu principal (um pouco mais compacto) */
.cdb-main{ min-width:0; overflow:visible; }
.cdb-main ul{
  display:flex; flex-wrap:nowrap;
  gap:20px !important;            /* era 28/32 */
  margin:0; padding:0; list-style:none;
  white-space:nowrap;
}
.cdb-main-link{
  font-size:15px !important;      /* menor que antes */
  line-height:1.1 !important;
  font-weight:500;
  padding:8px 4px !important;
}

/* Direita: menu secundário + divisor + ícones */
.cdb-right{
  display:flex; align-items:center;
  gap:22px; flex:0 0 auto;
  margin-left:28px; white-space:nowrap;
}

/* Menu secundário (mantém tamanho atual) */
.cdb-small-menu{ white-space:nowrap; align-self:center; }
.cdb-small-menu ul{ display:flex; gap:18px; margin:0; padding:0; list-style:none; }
.cdb-small-link{
  font-size:17px; line-height:1.1; font-weight:500; padding:8px 0;
}

/* ===== Ajuste final – ícones realmente maiores ===== */

/* Mantém o divisor igual */
.cdb-divider{
  width:1px;
  height:28px !important;
  background:rgba(0,0,0,.14);
  display:inline-block;
  margin:0 8px;
}

/* Ícones finais (search / user / cart) */
.cdb-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;                    /* mais espaçamento lateral */
  line-height:0;
}

/* Força tamanho grande ignorando qualquer regra global */
.cdb-header-desktop .cdb-icon img{
  height:42px !important;            /* antes 28px — aumenta visivelmente */
  width:auto !important;
  max-height:none !important;
  transform:none !important;
  scale:1 !important;
  display:block !important;
  vertical-align:middle !important;
}

/* ==== Forçar tamanho grande dos ícones (search / user / cart) ==== */
#site-header .cdb-header-desktop .cdb-right .cdb-icon{
  line-height: 0 !important;
  transform: none !important;
}

#site-header .cdb-header-desktop .cdb-right .cdb-icon > img,
.cdb-header-desktop .cdb-right .cdb-icon > img {
  height: 22px !important;        /* ajuste aqui: 44–48px se quiser maior */
  min-height: 22px !important;
  width: auto !important;
  max-height: none !important;
  max-width: none !important;
  object-fit: contain !important;
  display: block !important;
  transform: none !important;
  scale: 1 !important;
}

/* garante que nenhum botão/tema aplique font-size/line-height sobre a imagem */
#site-header .cdb-header-desktop .cdb-right .cdb-icon *,
#site-header .cdb-header-desktop .cdb-right .cdb-icon img {
  font-size: 0 !important;
  line-height: 0 !important;
}

/* ==== Cart Drawer: lateral à direita no desktop ==== */
@media (min-width: 1024px){
  /* garante layout de painel lateral */
  #cart-drawer,
  cart-drawer.drawer {
    position: fixed;
    inset: 0;                 /* ocupa a viewport para permitir backdrop */
    z-index: 9999;            /* acima do header */
    pointer-events: none;     /* só o inner recebe clique */
  }

  /* painel em si (lado direito) */
  #cart-drawer .drawer__inner,
  cart-drawer .drawer__inner {
    width: 420px;             /* ajuste conforme desejar (380–480px) */
    max-width: 92vw;
    height: 100vh;
    margin-left: auto;        /* encosta à direita */
    transform: translateX(100%);
    transition: transform .35s ease;
    pointer-events: auto;
    border-left: 1px solid rgba(0,0,0,.08);
    background: var(--color-background, #fff);
  }

  /* estados "aberto" – cobrimos variações de temas */
  .drawer.is-open .drawer__inner,
  #cart-drawer.is-open .drawer__inner,
  #cart-drawer[open] .drawer__inner,
  cart-drawer[open] .drawer__inner,
  body.drawer-open #cart-drawer .drawer__inner,
  html.js-drawer-open #cart-drawer .drawer__inner {
    transform: translateX(0);
  }

  /* backdrop */
  #cart-drawer .drawer__overlay,
  cart-drawer .drawer__overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    transition: opacity .25s ease;
    opacity: 1;
    pointer-events: auto;
  }
}

/* mobile mantém comportamento nativo (tela inteira) */

/* Cart drawer: largura maior no desktop */
@media (min-width: 990px){
  #cart-drawer .drawer__inner,
  cart-drawer .drawer__inner,
  ce-cart-drawer [data-cart-drawer-panel],
  .drawer[data-drawer="cart"] .drawer__inner{
    width: min(560px, 100vw) !important; /* antes ~420px; ajuste se quiser 520/600 */
  }
}

/* === FORÇA O DRAWER A FECHAR AO CLICAR NO X (sem JS) === */

/* estado normal do carrinho (visível) */
ce-cart-drawer[is-open="true"] [data-cart-drawer-panel],
#cart-drawer[is-open="true"] .drawer__inner {
  transform: translateX(0) !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: transform .3s ease !important;
}

/* quando o botão X muda o aria-expanded para false */
[data-cart-drawer-button-close][aria-expanded="false"] ~ [data-cart-drawer-panel],
[data-cart-drawer-button-close][aria-expanded="false"] ~ .drawer__inner {
  transform: translateX(100%) !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.drawer__overlay,
[data-cart-drawer-overlay],
.cdb-cart-overlay {
  transition: opacity .2s ease !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* GPO – manter layout original e impedir texto duplicado acima do select */
.gpo-group .gpo-selected-values,
.gpo-group .gpo-element.has-success .gpo-selected-values,
.gpo-group .gpo-selected-values.has-value {
  /* Some o conteúdo mas SEM alterar o layout do restante */
  height: 0 !important;        /* não ocupa altura */
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  visibility: hidden !important; /* esconde o texto */
}

/* Alguns apps empurram o select quando há sucesso/valor selecionado */
.gpo-group .gpo-element.has-success .gpo-select {
  margin-top: 0 !important;
}

/* ====== MOBILE HEADER (<= 767px) ====== */
@media (max-width: 767px){
  /* ... tudo que mandei ... */
}

/* Esconde o header desktop no mobile e mostra no ≥768px */
.cdb-header-desktop { display: none !important; }

@media (min-width: 768px) {
  .cdb-header-desktop { display: flex !important; }
}

/* (opcional) Garante que o header mobile não apareça no desktop */
@media (min-width: 768px) {
  .cdb-header-mobile { display: none !important; }
}

/* ANNOUNCEMENT BAR – MOBILE: 42px em cima (30 + 12) e 30px embaixo
   Tornamos o elemento do FUNDO o único dono do padding. */
@media (max-width: 767px) {
  /* 1) O elemento que tem o fundo (um destes selectores no seu tema) recebe o padding */
  #shopify-section-announcement-bar,
  #shopify-section-announcement-bar .announcement-bar,
  [data-announcement-bar] {
    padding-top: 42px !important;   /* 30px + 12px */
    padding-bottom: 30px !important;
    min-height: auto !important;
    /* Se o tema usar variável de altura, destrava: */
    --announcement-bar-height: auto !important;
  }

  /* 2) Zerar espaçamentos do WRAPPER da lista para não somar */
  #announcement-bar__announcement-list {
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    grid-template-rows: none !important;
    background: inherit; /* garante que a cor de fundo acompanhe, se o tema a aplica aqui */
  }

  /* 3) Zerar utilitários do ITEM interno (onde está o texto) */
  #announcement-bar__announcement-list > div,
  #announcement-bar__announcement-list .min-h-12 {
    min-height: 0 !important;
  }
  #announcement-bar__announcement-list .py-2 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* 4) Remover possíveis margins do parágrafo para o cálculo ficar exato */
  #announcement-bar__announcement-list p {
    margin: 0 !important;
  }
}

/* Ajuste fino: desce o texto 5px dentro da barra no mobile */
@media (max-width: 767px) {
  #announcement-bar__announcement-list p {
    margin-top: 7px !important;
  }
}

/* ==== HERO / SLIDESHOW – AJUSTES MOBILE ==== */
/* Troque o seletor abaixo se o ID do bloco mudar após duplicar a seção */
#shopify-section-template--26915541778781__slideshow_UJTN9T {
  /* nada aqui; só para agrupar os seletores abaixo */
}

@media (max-width: 767px) {
  /* 1) Altura do slide + imagem 100% (sem espaço branco) */
  #shopify-section-template--26915541778781__slideshow_UJTN9T [data-slideshow-list] > .flex-none .aspect-ratio {
    height: 70vh !important;              /* ocupa bem a tela */
    max-height: 82vh !important;
  }
  #shopify-section-template--26915541778781__slideshow_UJTN9T img.md\:hidden {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: 50% 50% !important;
    display: block !important;
    opacity: 1 !important;
  }

/* 2) Container de texto CENTRALIZADO vertical e horizontalmente */
#shopify-section-template--26915541778781__slideshow_UJTN9T [data-slideshow-list] > .flex-none > div:last-child {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important; /* centraliza no meio exato */
  width: 100% !important;
  padding: 0 24px !important;
  margin: 0 !important;
  text-align: center !important;
  z-index: 30 !important;
}

/* 2.1) Centraliza o botão dentro do container no mobile */
#shopify-section-template--26915541778781__slideshow_UJTN9T .button--primary {
  display: inline-block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}


  /* 3) Tipografia e cores no mobile (garante contraste) */
  #shopify-section-template--26915541778781__slideshow_UJTN9T h2 {
    color: #ffffff !important;
    font-family: "Gopher", var(--font-heading, inherit);
    font-weight: 700;
    line-height: 1.05;
    font-size: clamp(28px, 8vw, 40px) !important;
    margin: 0 0 6px 0 !important;
  }
  #shopify-section-template--26915541778781__slideshow_UJTN9T .text-subheading {
    color: #efe3ce !important;
    letter-spacing: 1.2px;
    font-size: clamp(13px, 3.6vw, 16px);
    margin-bottom: 10px !important;
  }

  /* 4) Botão mais alto e visível */
  #shopify-section-template--26915541778781__slideshow_UJTN9T .button--primary {
    margin-top: 8px !important;
    padding: 14px 22px !important;
  }

  /* 5) Barra de progresso não “puxa” altura no mobile */
  #shopify-section-template--26915541778781__slideshow_UJTN9T [data-slideshow-progress-bar] {
    height: 2px !important;
    bottom: 0 !important;
  }
}

/* Força CAIXA ALTA e padding vertical no botão "Ver tudo" */
.box-content .text-center a.button.button--secondary {
  text-transform: uppercase !important;

  /* cobre temas que usam variáveis */
  --button-padding-block: 15px !important;
  --button-padding-y: 15px !important;
  --button-padding-top: 15px !important;
  --button-padding-bottom: 15px !important;

  /* cobre logical properties e shorthand tradicionais */
  padding-block: 15px !important;
  padding-top: 15px !important;
  padding-bottom: 15px !important;

  /* desfaz travas comuns de altura */
  height: auto !important;
  min-height: unset !important;

  /* garante que o conteúdo centralize verticalmente */
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1.2 !important;
}

/* Fallback/força final para o botão "Ver tudo" */
a.button.button--secondary.cdb-padfix {
  /* força padding vertical */
  padding-block: 15px !important;
  padding-top: 15px !important;
  padding-bottom: 15px !important;

  /* remove travas de altura do tema */
  min-height: unset !important;
  height: auto !important;

  /* centraliza vertical do texto dentro do botão */
  display: inline-flex !important;
  align-items: center !important;

  /* caixa alta garantida */
  text-transform: uppercase !important;

  /* evita “esticada” por line-height do tema */
  line-height: 1.2 !important;
}

/* Remove o quadrado de fundo e a borda dos ícones do cabeçalho mobile */
@media (max-width: 767px) {
  .cdb-header-mobile .button,
  .cdb-header-mobile .button--secondary,
  .cdb-burger.button,
  .cdb-mobile-actions .cdb-icon {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
  }

  /* garante que os SVGs mantenham alinhamento e espaçamento harmônico */
  .cdb-header-mobile svg {
    width: 27px;
    height: 27px;
    stroke-width: 1.8;
  }

  /* mantém click area confortável, sem quadrado visual */
  .cdb-header-mobile .button,
  .cdb-header-mobile .cdb-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
  }
}

/* Espaçamento entre os ícones do cabeçalho mobile */
@media (max-width: 767px) {
  .cdb-header-mobile a[href="/search"] {
    margin-right: 8px !important;
  }
}

 @media (max-width: 767px) {
  /* Centraliza a logo e mantém o espaçamento inferior */
  .cdb-mobile-logo {
    position: absolute !important;
    left: 50%;
    transform: translateX(-50%);
  }

  /* Adiciona altura e padding para preservar o espaço do cabeçalho */
  .cdb-header-mobile {
    position: relative !important;
    padding-bottom: 35px !important; /* ajuste fino do espaçamento */
    padding-top: 12px !important;    /* mantém equilíbrio visual */
  }
}

/* === CUSTOMIZAÇÃO ANNOUNCEMENT BAR === */
#shopify-section-announcement-bar p {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400;
  font-size: 0.7rem !important; /* ~30% menor */
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0;
}

#shopify-section-announcement-bar p strong {
  font-weight: 700 !important; /* Montserrat Bold */
}

/* Oculta o <br> no desktop, mostra no mobile */
.mobile-break {
  display: none;
}

@media (max-width: 767px) {
  .mobile-break {
    display: block;
  }
}

<style>
  /* === CUSTOM ANNOUNCEMENT BAR (Liquid edit) === */
  #shopify-section-announcement-bar .announcement-text {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 400;
    font-size: 0.7rem !important; /* ~30% menor */
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
    line-height: 1.35 !important;
  }
  #shopify-section-announcement-bar .announcement-text strong {
    font-weight: 700 !important; /* Montserrat Bold */
  }

  /* Reduz a altura mínima das linhas do GRID (era 3rem via minmax) */
  #shopify-section-announcement-bar #announcement-bar__announcement-list {
    grid-template-rows: repeat(var(--rows), minmax(1.8rem, 1fr)) !important;
  }

  /* Item visível: altura e paddings menores para tirar o espaço de baixo */
  #shopify-section-announcement-bar #announcement-bar__announcement-list > .flex.items-center.justify-center {
    min-height: 1.8rem !important;
    padding-top: 0.25rem !important;   /* mantém centrado */
    padding-bottom: 0.10rem !important; /* reduz “barriga” inferior */
  }

  /* Espelha o ajuste no bloco invisível usado pelo componente */
  #shopify-section-announcement-bar .flex.invisible.overflow-hidden .flex.items-center.justify-center {
    min-height: 1.8rem !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.10rem !important;
  }
</style>

/* === Dropdown de idioma (header) ============================ */

/* container alinhado com o menu secundario */
.cdb-lang-container {
  position: relative;
  margin-left: 0.75rem;
}

/* form básico */
.cdb-lang-form {
  margin: 0;
}

/* wrapper do disclosure */
.cdb-lang-form .disclosure {
  position: relative;
}

/* botão "DE / EN / PT" + setinha */
.cdb-lang-button {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  cursor: pointer;

  font: inherit;
  color: inherit;              /* mesma cor do menu secundario */
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* nenhuma decoração feia no hover/focus */
.cdb-lang-button:hover,
.cdb-lang-button:focus {
  outline: none;
  text-decoration: none;
}

/* ícone de seta */
.cdb-lang-button .icon-caret,
.cdb-lang-button .icon {
  width: 14px;
  height: 14px;
}

/* lista drop-down */
.cdb-lang-list {
  position: absolute;
  right: 0;
  top: 100%;
  margin-top: 8px;

  min-width: 170px;
  padding: 8px 0;

  list-style: none;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.15);
  z-index: 40;
}

/* links dentro da lista */
.cdb-lang-option {
  display: block;
  padding: 8px 16px;
  font-size: 0.9rem;
  text-decoration: none;
  color: #111827; /* texto escurinho dentro do dropdown */
}

/* hover dos itens */
.cdb-lang-option:hover,
.cdb-lang-option:focus {
  background-color: rgba(15, 23, 42, 0.04);
  text-decoration: none;
}

/* estado "ativo" (idioma atual, se quiser destacar) */
.cdb-lang-option[aria-current="true"] {
  font-weight: 500;
}

/* só para garantir que no mobile (drawer) nada quebre,
   se voce usar o mesmo componente depois */
@media (max-width: 767px) {
  .cdb-mobile-drawer .cdb-lang-list {
    position: static;
    margin-top: 4px;
    box-shadow: none;
    border-radius: 6px;
  }

  .cdb-mobile-drawer .cdb-lang-option {
    padding: 6px 12px;
  }
}

/* === CUSTOM ANNOUNCEMENT BAR – alinhamento perfeito === */

#shopify-section-announcement-bar .announcement-text {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400;
  font-size: 0.7rem !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0;
  line-height: 1.35 !important;
}

#shopify-section-announcement-bar .announcement-text strong {
  font-weight: 700 !important;
}

/* Alinhamento vertical real */
#shopify-section-announcement-bar ce-announcement-bar .flex.items-center.justify-center {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important; /* altura ideal, pode ajustar para 40 ou 48 */
  padding: 0 !important;       /* remove empurrão visual inferior */
}

/* Corrige o bloco "invisível" que o componente usa para animação */
#shopify-section-announcement-bar ce-announcement-bar .flex.invisible .flex.items-center {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 0 !important;
}

/* Evita que o grid empurre o texto para baixo */
#shopify-section-announcement-bar #announcement-bar__announcement-list {
  grid-template-rows: repeat(var(--rows), minmax(42px, 1fr)) !important;
}

/* Footer: opções do dropdown sempre pretas */
#footer__localization-language-code option {
  color: #111 !important;
  background: #fff !important;
}

/* ================================
   SELETOR DE IDIOMA - MOBILE (DRAWER)
   Caixa estilo rodapé
   ================================ */
@media (max-width: 767px) {

  /* wrapper dentro do menu mobile */
  #mobile-menu .cdb-lang-wrapper {
    position: relative;
    display: inline-block;
    width: 180px;              /* ajuste se quiser mais largo ou 100% */
  }

  #mobile-menu .cdb-lang-select {
    display: block;
    width: 100%;
    padding: 8px 36px 8px 14px;
    border-radius: 9999px;     /* formato de pílula, igual “botão” */
    border: 1px solid rgba(0,0,0,.18);
    background-color: #ffffff;
    color: #111827 !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2;
    text-transform: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
  }

  /* setinha igual ao rodapé */
  #mobile-menu .cdb-lang-wrapper::after {
    content: "";
    position: absolute;
    right: 12px;
    top: 50%;
    width: 10px;
    height: 6px;
    transform: translateY(-50%);
    pointer-events: none;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 10 5' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 0 5 5 5-5H8.5L5 3.5 1.5 0H0Z' fill='%23000000'/%3E%3C/svg%3E");
  }

  /* sem sublinhado no hover/focus */
  #mobile-menu .cdb-lang-select:hover,
  #mobile-menu .cdb-lang-select:focus {
    text-decoration: none !important;
    outline: none !important;
  }
}

/* Espaçamento uniforme entre itens do mobile drawer */
.cdb-mobile-drawer .mt-4 {
  margin-top: 1rem; /* mesmo espaçamento entre os itens do menu */
}

/* Manter estilo do dropdown mobile igual ao rodapé */
.cdb-lang-select--mobile {
  background-color: #fff !important;
  border: 1px solid rgba(0,0,0,.16) !important;
  border-radius: 9999px !important; /* deixa arredondado igual ao footer */
  padding: 10px 14px !important;
  font-size: 0.95rem !important;
  color: #111 !important;
  width: 100%;
  appearance: none;
}

/* === Centralizar título, subtítulo e botão SOMENTE no mobile === */
@media (max-width: 767px) {
  .cdb-hero-mobile-center {
    display: flex;
    flex-direction: column;
    justify-content: center;   /* centraliza vertical */
    align-items: center;       /* centraliza horizontal */
    text-align: center;        /* garante centralização do texto */
    height: 100%;              /* ocupa toda a área do slide */
    width: 100%;
  }

  .cdb-hero-mobile-center h2,
  .cdb-hero-mobile-center h4 {
    text-align: center !important;
    width: 100%;
  }

  .cdb-hero-mobile-center .button {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* === Centralização total do hero no mobile === */
@media (max-width: 767px) {
  .cdb-hero-mobile-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;   /* centraliza verticalmente */
    align-items: center;       /* centraliza horizontalmente */
    text-align: center !important;
    min-height: 55vh;          /* garante que apareça no mobile */
  }

  .cdb-hero-mobile-wrapper h2,
  .cdb-hero-mobile-wrapper h4,
  .cdb-hero-mobile-wrapper .rte,
  .cdb-hero-mobile-wrapper a.button {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* === Centralização total do texto do slideshow no mobile === */
@media (max-width: 767px) {
  .cdb-hero-overlay {
    position: absolute;
    inset: 0;                      /* ocupa toda a área do slide */
    display: flex;
    flex-direction: column;
    justify-content: center;       /* centraliza verticalmente */
    align-items: center;           /* centraliza horizontalmente */
    text-align: center;
    padding: 0 1.5rem;
    z-index: 40;                   /* acima da imagem */
  }

  .cdb-hero-overlay .mb-7,
  .cdb-hero-overlay h2,
  .cdb-hero-overlay h4,
  .cdb-hero-overlay .rte,
  .cdb-hero-overlay a.button {
    text-align: center !important;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Oculta o texto de marca d’água do AvisPlus */
.avp-watermark-footer-title,
.avp-watermark-footer,
.avp-watermark-footer * {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* Linha da porção: select + botão na MESMA linha */
.avpoptions-container__v2 .avp-option.ap-options__select-container .ap-options__select {
  display: flex !important;       /* força linha */
  flex-wrap: nowrap;
  align-items: center;            /* centraliza verticalmente */
  gap: 12px;
  width: 100%;
}

/* O select ocupa o máximo de espaço, o botão fica “encostado” à direita */
.avpoptions-container__v2 .avp-option.ap-options__select-container .ap-options__select .avp-select {
  flex: 1 1 auto;
}

/* Botão + */
.avpoptions-container__v2 .oficina-add-portion-btn {
  border: none;
  padding: 0;
  background: transparent;
  cursor: pointer;
  width: 45px;
  height: 45px;
  flex: 0 0 auto;                /* não estica */
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.avpoptions-container__v2 .oficina-add-portion-btn img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 999px;
}

/* Reduz a largura do dropdown, mesmo quando o botão ainda não está lá */
.avpoptions-container__v2 .ap-options__select .avp-select {
  max-width: calc(100% - 60px); /* deixa espaço reservado para o botão */
}

/* Quando o botão ainda não existe no DOM, mantemos o espaço reservado */
.avpoptions-container__v2 .ap-options__select {
  position: relative;
  padding-right: 60px; /* reserva o espaço visualmente */
}

<style>
  /* Oculta o aviso padrão somente na página de carrinho */
  body.template-cart .mincart-notice {
    display: none !important;
  }
</style>

/* Garante que o botão acompanhe a largura do dropdown + botão "+" */
.oficina-addtocart-wrapper .button--primary {
  width: 100% !important;
  display: block;
}

/* ====== LINHA DA PORÇAO: SELECT + [- 50 +] + BOTAO VERDE ====== */

/* Linha toda em flex */
.avp-option.ap-options__select-container > .ap-options__select {
  display: flex;
  align-items: center;
  column-gap: 0.75rem;          /* Espaço pequeno e uniforme entre os grupos */
}

/* SELECT – um pouco mais largo para caber o texto + ícone */
.avp-option.ap-options__select-container > .ap-options__select .avp-select {
  order: 1;
  flex: 0 0 280px;              /* aumenta um pouco; se ainda cortar, sobe pra 290/300 */
}

/* Wrapper do seletor de quantidade [- 50 +] */
.avp-option.ap-options__select-container > .ap-options__select .oficina-portion-qty-wrapper {
  order: 2;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;                 /* espaço pequeno entre - / número / + */
  margin: 0;                    /* zera margens que possam vir de outro lugar */
}

/* Botões - e + do seletor de quantidade */
.avp-option.ap-options__select-container > .ap-options__select .oficina-portion-qty-btn {
  margin: 0;
  padding: 0.4rem 0.85rem;      /* um pouco menor para ficar mais compacto */
}

/* Número (50, 100...) */
.avp-option.ap-options__select-container > .ap-options__select .oficina-portion-qty-input {
  width: 3rem;
  text-align: center;
  padding: 0.35rem 0.25rem;
}

/* Botão verde de adicionar PORÇÃO – sempre no final à direita */
.avp-option.ap-options__select-container > .ap-options__select .oficina-add-portion-btn {
  order: 3;
  margin-left: 0.75rem;
  padding: 0;
  border: none;
  background: transparent;
}

/* Quadrado cinza claro ao redor do número */
.oficina-portion-qty-input {
  width: 48px !important;
  height: 48px !important;
  border: 2px solid #2d5540; /* mesma cor dos outros quadrados */
  border-radius: 4px;
  background-color: #f7f7f7; /* cinza claro */
  font-size: 18px;
  font-weight: 500;
  text-align: center;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.oficina-portion-qty-input::-webkit-inner-spin-button,
.oficina-portion-qty-input::-webkit-outer-spin-button {
  display: none;
}

/* 1) Aumentar um pouco a largura do dropdown para não cortar o texto */
.avp-option.ap-options__select-container .avp-select select {
  min-width: 260px;
}

/* 2) Deixar os controles de quantidade mais compactos */
.oficina-portion-qty-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem !important;   /* diminui o espaço entre -, número e + */
  margin-left: 0.75rem;     /* distância depois do dropdown */
}

/* 3) Quadrado cinza claro ao redor do número da quantidade */
.avp-option.ap-options__select-container
  .oficina-portion-qty-wrapper
  .oficina-portion-qty-input {
  width: 48px !important;
  height: 48px !important;
  box-sizing: border-box;
  border: 1px solid #c7c7c7 !important;  /* mesma cor dos outros quadrados */
  border-radius: 0 !important;
  background-color:rgb(255, 255, 255) !important;  /* cinza claro */
  padding: 0 !important;
  margin: 0 !important;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
}

/* remover as setinhas do input number */
.oficina-portion-qty-input::-webkit-inner-spin-button,
.oficina-portion-qty-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Mantém a largura do dropdown sempre igual */
.avp-option.ap-options__select-container .avp-select {
  flex: 0 0 260px;   /* ajuste o 260px se quiser um pouco maior/menor */
  max-width: 260px;
}

.avp-option.ap-options__select-container select.avp-productdescfont {
  width: 100%;
}

.oficina-remove-portion-btn {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-left: 8px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.oficina-remove-portion-btn img {
  width: 20px !important;
  height: 20px !important;
  pointer-events: none;
  opacity: 0.75;
}

.oficina-remove-portion-btn:hover img {
  opacity: 1;
}

.oficina-remove-portion-btn {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-left: 8px !important;
  cursor: pointer !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  font-size: 18px;
  line-height: 1;
  color: #999999;
}

.oficina-remove-portion-btn:hover {
  color: #666666;
}


.oficina-remove-portion-btn img {
  width: 28px !important;
  height: 28px !important;
  opacity: 0.7;
  pointer-events: none;
}

.oficina-remove-portion-btn:hover img {
  opacity: 1;
}

.oficina-remove-portion-btn {
  padding: 0;
  margin-left: 0.25rem;
  border: none;
  background: transparent;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.oficina-remove-portion-btn img {
  width: 16px;
  height: 16px;
  display: block;
  opacity: 0.6;
}

.oficina-remove-portion-btn:hover img {
  opacity: 1;
}

/* OFICINA – ordem dos elementos da linha de porcao */
.avp-options-container__v2 .avp-option .ap-options__select {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Select sempre primeiro, ocupando o espaço todo */
.avp-options-container__v2 .avp-option .avp-select {
  order: 1;
  flex: 1 1 auto;
}

/* Contador de quantidade (- 50 + quadrado) vem depois */
.avp-options-container__v2 .avp-option .oficina-portion-qty-wrapper {
  order: 2;
}

/* Botao "+" redondo que adiciona nova porcao */
.avp-options-container__v2 .avp-option .oficina-add-portion-btn {
  order: 3;
}

/* Botao "X" sempre por ultimo na linha */
.avp-options-container__v2 .avp-option .oficina-remove-portion-btn {
  order: 4;
  margin-left: 0 !important; /* tira o espacamento antigo */
}

/* Aproxima o botao verde redondo (+) do seletor de quantidade */
.avpoptions-container__v2 .ap-options__select{
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 10px; /* ajuste fino aqui (ex: 6px, 8px, 10px) */
}

/* Tira espaçamento extra do wrapper da quantidade (se houver) */
.avpoptions-container__v2 .oficina-portion-qty-wrapper{
  margin-right: 0 !important;
}

/* Controle fino do botao verde (+) */
.avpoptions-container__v2 .oficina-add-portion-btn{
  margin-left: 0 !important;   /* o gap acima controla a distancia */
  padding: 0 !important;
  line-height: 0;
}

/* Garante que a imagem do botao nao crie “folga” */
.avpoptions-container__v2 .oficina-add-portion-btn img{
  display: block;
}

.avis-message-validate {
  visibility: hidden;
  position: relative;
  display: block;
  margin-top: 8px; /* cria espaço acima da mensagem */
}

.avis-message-validate::after {
  content: "Por favor, selecione uma opção antes de adicionar este item ao carrinho.";
  visibility: visible;
  position: relative;
  display: block;
  margin-top: 6px; /* ajuste fino do espaçamento */
  color: #c00000; /* mantém o vermelho de alerta */
}

/* === AVISPLUS (Porcoes) - corrigir overflow no mobile === */
@media (max-width: 768px) {

  /* garante que nada vaze para fora do card */
  .color-scheme-primary-1.bg-background.border.border-body-text\/10{
    overflow: visible;
  }

  /* container principal do app sempre dentro */
  .shopify-product-form .avpoptions-container__v2{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* cada bloco de porcao dentro da largura */
  .shopify-product-form .avp-option.ap-options__select-container{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* linha do select + quantidade: flex “responsivo” */
  .shopify-product-form .ap-options__select{
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* select encolhe corretamente (sem estourar) */
  .shopify-product-form .ap-options__select .avp-select{
    flex: 1 1 auto !important;
    min-width: 0 !important; /* ESSENCIAL para não vazar */
  }
  .shopify-product-form .ap-options__select .avp-select select{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* bloco de quantidade não “empurra” o layout */
  .shopify-product-form .oficina-portion-qty-wrapper{
    flex: 0 0 auto !important;
    max-width: 100% !important;
  }
}

/* === AVISPLUS (Porcoes) - mobile: quebrar linha para caber === */
@media (max-width: 768px) {

  /* quebra a linha: select em cima, quantidade embaixo */
  .shopify-product-form .ap-options__select{
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }

  /* dropdown ocupa 100% */
  .shopify-product-form .ap-options__select .avp-select{
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  /* quantidade vai pra baixo e cabe dentro */
  .shopify-product-form .ap-options__select .oficina-portion-qty-wrapper{
    flex: 0 0 100% !important;
    width: 100% !important;
    justify-content: flex-end !important; /* pode trocar por flex-start */
    margin-top: 10px !important;
  }

  /* deixa os quadrados menores no mobile (pra ficar proporcional) */
  .shopify-product-form .oficina-portion-qty-btn{
    padding: 0.45rem !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }

  .shopify-product-form .oficina-portion-qty-input{
    width: 56px !important;
    padding: 0.45rem 0.4rem !important;
  }
}

@media (max-width: 768px) {

  /* Linha do select continua 100% */
  .shopify-product-form .ap-options__select{
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }

  .shopify-product-form .ap-options__select .avp-select{
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  /* Linha de baixo: qty + botao redondo juntos */
  .shopify-product-form .ap-options__select .oficina-portion-qty-wrapper{
    flex: 1 1 auto !important;
    width: auto !important;
    margin-top: 8px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  /* O botao redondo (adicionar porcao) fica NA MESMA LINHA, colado no final */
  .shopify-product-form .ap-options__select .oficina-add-portion-btn{
    order: 99 !important;
    margin-left: 8px !important;
    margin-top: 0 !important;

    flex: 0 0 auto !important;
    align-self: center !important;
  }

  /* remove qualquer margem estranha em volta do grupo */
  .shopify-product-form .ap-options__select .oficina-portion-qty-wrapper,
  .shopify-product-form .ap-options__select .oficina-add-portion-btn{
    max-width: 100% !important;
  }
}
/* ====== AVISPLUS / OFICINA - garantir tudo dentro do card (mobile/tablet/desktop) ====== */
.avpoptions-container__v2,
.avpoptions-container__v2 * {
  box-sizing: border-box;
}

.avpoptions-container__v2 {
  max-width: 100%;
}

.avp-option.ap-options__select-container {
  max-width: 100%;
}

/* A linha que contém: dropdown + (- 20 + X) + botão redondo (+) */
.avp-option.ap-options__select-container .ap-options__select {
  display: flex !important;
  align-items: center;
  gap: 10px;                 /* aproxima os elementos */
  flex-wrap: wrap;           /* permite quebrar linha sem sair pra fora */
  max-width: 100%;
}

/* Dropdown (select) ocupa o espaço disponível e pode quebrar linha */
.avp-option.ap-options__select-container .avp-select {
  flex: 1 1 260px;           /* cresce, mas aceita encolher e quebrar */
  min-width: 0;              /* importante para nao estourar */
  max-width: 100%;
}

/* Bloco de quantidade (- 20 + X) nao estoura */
.oficina-portion-qty-wrapper {
  flex: 0 0 auto;
  gap: 8px !important;       /* reduz espaços grandes entre botoes */
  margin-top: 0 !important;  /* evita “pular” e criar vao */
}

/* Botao redondo + (adicionar novo dropdown): sempre dentro e perto do X */
.oficina-add-portion-btn {
  flex: 0 0 auto;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  max-width: 100%;
}

/* Se o tema estiver aplicando margens ou alinhamentos estranhos no img */
.oficina-add-portion-btn img {
  display: block;
}

/* Em telas bem largas, tenta manter em uma linha (mas sem estourar) */
@media (min-width: 990px) {
  .avp-option.ap-options__select-container .ap-options__select {
    flex-wrap: nowrap;
  }
}

/* === PATCH MINIMO - recuperar botao + redondo e evitar corte === */

/* Nao cortar elementos dentro do card (isso estava "matando" o + quando encosta na borda) */
.color-scheme-primary-1.bg-background.border.border-body-text\/10{
  overflow: visible !important;
}

/* Garantir que o botao + do app nunca fique escondido por CSS do tema */
.shopify-product-form .oficina-add-portion-btn{
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;

  /* evita que algum CSS do tema posicione pra fora */
  position: static !important;
  transform: none !important;

  margin: 0 0 0 8px !important; /* aproxima do X */
  flex: 0 0 auto !important;
  align-self: center !important;
}

.shopify-product-form .oficina-add-portion-btn img{
  display: block !important;
}

/* Segurança: nada do app pode passar da largura do card */
.shopify-product-form .avpoptions-container__v2,
.shopify-product-form .avp-option.ap-options__select-container{
  max-width: 100% !important;
}

/* === FIX DEFINITIVO: botão + verde nunca sai do card (desktop/tablet também) === */
@media (min-width: 769px) {

  /* permite quebrar se precisar (em vez de vazar pra fora) */
  .shopify-product-form .avp-option.ap-options__select-container .ap-options__select{
    flex-wrap: wrap !important;     /* <<< ISSO resolve o vazamento */
    width: 100% !important;
    max-width: 100% !important;
  }

  /* select pode encolher de verdade */
  .shopify-product-form .avp-option.ap-options__select-container .avp-select{
    flex: 1 1 320px !important;
    min-width: 0 !important;
  }

  /* empurra o bloco de quantidade pro final da linha */
  .shopify-product-form .oficina-portion-qty-wrapper{
    margin-left: auto !important;
    flex: 0 0 auto !important;
  }

  /* botão verde fica colado no X e sempre dentro */
  .shopify-product-form .oficina-add-portion-btn{
    flex: 0 0 auto !important;
    margin-left: 8px !important;
  }
}

/* === FIX: diminuir dropdown e manter tudo na mesma linha (desktop/tablet) === */
@media (min-width: 769px){

  /* tudo em UMA linha */
  .shopify-product-form .avp-option.ap-options__select-container .ap-options__select{
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 10px !important;
  }

  /* dropdown encolhe pra caber os botões */
  .shopify-product-form .avp-option.ap-options__select-container .avp-select{
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: clamp(220px, 38vw, 420px) !important; /* <<< diminui o select */
  }

  /* select ocupa 100% do bloco reduzido */
  .shopify-product-form .avp-option.ap-options__select-container .avp-select select{
    width: 100% !important;
  }

  /* grupo (- 20 + X) não pode encolher */
  .shopify-product-form .oficina-portion-qty-wrapper{
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  /* botão verde não pode encolher e fica colado no X */
  .shopify-product-form .oficina-add-portion-btn{
    flex: 0 0 auto !important;
    margin-left: 6px !important;
  }
}

/* === AJUSTE FINO: aproximar botoes X e + verde (desktop e mobile) === */

/* Botao + verde redondo (adicionar nova porcao) */
.shopify-product-form .oficina-add-portion-btn{
  margin-left: -5px !important;
}

/* Remove setinhas do input number (Firefox + Chrome/Safari/Edge) */
.oficina-portion-qty-input[type="number"] {
  -moz-appearance: textfield; /* Firefox */
  appearance: textfield;
}

.oficina-portion-qty-input[type="number"]::-webkit-outer-spin-button,
.oficina-portion-qty-input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}