/*! @version pwa-studio: 0.0.1, @magento/venia-ui: ^10.2.0, @magento/upward-security-headers: ~1.0.10, @magento/upward-js: ^5.3.2, @magento/pwa-theme-venia: ~1.3.0, @magento/pwa-buildpack: ^11.4.2, @magento/peregrine: ^13.1.1, @magento/pagebuilder: ^8.2.0, @magento/eslint-config: ^1.5.3, @magento/babel-preset-peregrine: ~1.2.1, @apollo/client: ^3.7.0 */
/*! tailwindcss v2.2.19 | MIT License | https://tailwindcss.com *//*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */

/*
Document
========
*/

/**
Use a better box model (opinionated).
*/

*,
::before,
::after {
	box-sizing: border-box;
}

/**
Use a more readable tab size (opinionated).
*/

html {
	-moz-tab-size: 4;
	tab-size: 4;
}

/**
1. Correct the line height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
*/

html {
	line-height: 1.15; /* 1 */
	-webkit-text-size-adjust: 100%; /* 2 */
}

/*
Sections
========
*/

/**
Remove the margin in all browsers.
*/

body {
	margin: 0;
}

/**
Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
*/

body {
	font-family:
		system-ui,
		-apple-system, /* Firefox supports this but not yet `system-ui` */
		'Segoe UI',
		Roboto,
		Helvetica,
		Arial,
		sans-serif,
		'Apple Color Emoji',
		'Segoe UI Emoji';
}

/*
Grouping content
================
*/

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

hr {
	height: 0; /* 1 */
	color: inherit; /* 2 */
}

/*
Text-level semantics
====================
*/

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

abbr[title] {
	text-decoration: underline dotted;
}

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

b,
strong {
	font-weight: bolder;
}

/**
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
2. Correct the odd 'em' font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
	font-family:
		ui-monospace,
		SFMono-Regular,
		Consolas,
		'Liberation Mono',
		Menlo,
		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;
}

/*
Tabular data
============
*/

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

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

/*
Forms
=====
*/

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

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

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

button,
select { /* 1 */
	text-transform: none;
}

/**
Correct the inability to style clickable types in iOS and Safari.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
	-webkit-appearance: button;
}

/**
Remove the inner border and padding in Firefox.
*/

::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
Restore the focus styles unset by the previous rule.
*/

:-moz-focusring {
	outline: 1px dotted ButtonText;
}

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

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

/**
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
*/

legend {
	padding: 0;
}

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

/*
Interactive
===========
*/

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

summary {
	display: list-item;
}/**
 * Manually forked from SUIT CSS Base: https://github.com/suitcss/base
 * A thin layer on top of normalize.css that provides a starting point more
 * suitable for web applications.
 */

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

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

button {
  background-color: transparent;
  background-image: none;
}

fieldset {
  margin: 0;
  padding: 0;
}

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

/**
 * Tailwind custom reset styles
 */

/**
 * 1. Use the user's configured `sans` font-family (with Tailwind's default
 *    sans-serif font stack as a fallback) as a sane default.
 * 2. Use Tailwind's default "normal" line-height so the user isn't forced
 *    to override it to ensure consistency even when using the default theme.
 */

html {
  font-family: Muli, sans-serif; /* 1 */
  line-height: 1.5; /* 2 */
}


/**
 * Inherit font-family and line-height from `html` so users can set them as
 * a class directly on the `html` element.
 */

body {
  font-family: inherit;
  line-height: inherit;
}

/**
 * 1. Prevent padding and border from affecting element width.
 *
 *    We used to set this in the html element and inherit from
 *    the parent element for everything else. This caused issues
 *    in shadow-dom-enhanced elements like <details> where the content
 *    is wrapped by a div with box-sizing set to `content-box`.
 *
 *    https://github.com/mozdevs/cssremedy/issues/4
 *
 *
 * 2. Allow adding a border to an element by just adding a border-width.
 *
 *    By default, the way the browser specifies that an element should have no
 *    border is by setting it's border-style to `none` in the user-agent
 *    stylesheet.
 *
 *    In order to easily add borders to elements by just setting the `border-width`
 *    property, we change the default border-style for all elements to `solid`, and
 *    use border-width to hide them instead. This way our `border` utilities only
 *    need to set the `border-width` property instead of the entire `border`
 *    shorthand, making our border utilities much more straightforward to compose.
 *
 *    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 */
}

/*
 * Ensure horizontal rules are visible by default
 */

hr {
  border-top-width: 1px;
}

/**
 * Undo the `border-style: none` reset that Normalize applies to images so that
 * our `border-{width}` utilities have the expected effect.
 *
 * The Normalize reset is unnecessary for us since we default the border-width
 * to 0 on all elements.
 *
 * https://github.com/tailwindcss/tailwindcss/issues/362
 */

img {
  border-style: solid;
}

textarea {
  resize: vertical;
}

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

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

/**
 * Override legacy focus reset from Normalize with modern Firefox focus styles.
 *
 * This is actually an improvement over the new defaults in Firefox in our testing,
 * as it triggers the better focus styles even for links, which still use a dotted
 * outline in Firefox by default.
 */
 
:-moz-focusring {
	outline: auto;
}

table {
  border-collapse: collapse;
}

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

/**
 * Reset form element properties that are easy to forget to
 * style explicitly so you don't inadvertently introduce
 * styles that deviate from your design system. These styles
 * supplement a partial reset that is already applied by
 * normalize.css.
 */

button,
input,
optgroup,
select,
textarea {
  padding: 0;
  line-height: inherit;
  color: inherit;
}

/**
 * Use the configured 'mono' font family for elements that
 * are expected to be rendered with a monospace font, falling
 * back to the system monospace stack if there is no configured
 * 'mono' font family.
 */

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

/**
 * 1. Make replaced elements `display: block` by default as that's
 *    the behavior you want almost all of the time. Inspired by
 *    CSS Remedy, with `svg` added as well.
 *
 *    https://github.com/mozdevs/cssremedy/issues/14
 * 
 * 2. Add `vertical-align: middle` to align replaced elements more
 *    sensibly by default when overriding `display` by adding a
 *    utility like `inline`.
 *
 *    This can trigger a poorly considered linting error in some
 *    tools but is included by design.
 * 
 *    https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210
 */

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

/**
 * Ensure the default browser behavior of the `hidden` attribute.
 */

[hidden] {
  display: none;
}

:root {
	--color-brand-100: 194 200 255;
	--color-brand-400: 61 132 255;
	--color-brand-600: 41 84 255;
	--color-brand-700: 31 57 255;
	--color-brand-800: 23 43 196;
	--color-brand-base: 61 132 255;
	--color-brand-dark: 41 84 255;
	--color-brand-darkest: 23 43 196;
	--color-brand-light: 194 200 255;
}
/* @tailwind utilities; */
.hover_underline:hover {
	text-decoration: underline;
}
.focus_underline:focus {
	text-decoration: underline;
}
@media (min-width: 640px) {

	.sm_hidden {
		display: none;
	}
}
@media (min-width: 960px) {

	.lg_flex {
		display: flex;
	}
}

:root{--toastify-color-light:#fff;--toastify-color-dark:#121212;--toastify-color-info:#3498db;--toastify-color-success:#07bc0c;--toastify-color-warning:#f1c40f;--toastify-color-error:#e74c3c;--toastify-color-transparent:hsla(0,0%,100%,.7);--toastify-icon-color-info:var(--toastify-color-info);--toastify-icon-color-success:var(--toastify-color-success);--toastify-icon-color-warning:var(--toastify-color-warning);--toastify-icon-color-error:var(--toastify-color-error);--toastify-toast-width:320px;--toastify-toast-background:#fff;--toastify-toast-min-height:64px;--toastify-toast-max-height:800px;--toastify-font-family:sans-serif;--toastify-z-index:9999;--toastify-text-color-light:#757575;--toastify-text-color-dark:#fff;--toastify-text-color-info:#fff;--toastify-text-color-success:#fff;--toastify-text-color-warning:#fff;--toastify-text-color-error:#fff;--toastify-spinner-color:#616161;--toastify-spinner-color-empty-area:#e0e0e0;--toastify-color-progress-light:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55);--toastify-color-progress-dark:#bb86fc;--toastify-color-progress-info:var(--toastify-color-info);--toastify-color-progress-success:var(--toastify-color-success);--toastify-color-progress-warning:var(--toastify-color-warning);--toastify-color-progress-error:var(--toastify-color-error)}.Toastify__toast-container{z-index:var(--toastify-z-index);-webkit-transform:translateZ(var(--toastify-z-index));position:fixed;padding:4px;width:var(--toastify-toast-width);box-sizing:border-box;color:#fff}.Toastify__toast-container--top-left{top:1em;left:1em}.Toastify__toast-container--top-center{top:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--top-right{top:1em;right:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (max-width:480px){.Toastify__toast-container{width:100vw;padding:0;left:0;margin:0}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:0;transform:translateX(0)}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:0;transform:translateX(0)}.Toastify__toast-container--rtl{right:0;left:auto}}.Toastify__toast{position:relative;min-height:var(--toastify-toast-min-height);box-sizing:border-box;margin-bottom:1rem;padding:8px;border-radius:4px;box-shadow:0 1px 10px 0 rgba(0,0,0,.1),0 2px 15px 0 rgba(0,0,0,.05);display:flex;justify-content:space-between;max-height:var(--toastify-toast-max-height);overflow:hidden;font-family:var(--toastify-font-family);cursor:pointer;direction:ltr}.Toastify__toast--rtl{direction:rtl}.Toastify__toast-body{margin:auto 0;flex:1 1 auto;padding:6px;display:flex;align-items:center}.Toastify__toast-body>div:last-child{flex:1}.Toastify__toast-icon{margin-inline-end:10px;width:20px;flex-shrink:0;display:flex}.Toastify--animate{animation-fill-mode:both;animation-duration:.7s}.Toastify--animate-icon{animation-fill-mode:both;animation-duration:.3s}@media only screen and (max-width:480px){.Toastify__toast{margin-bottom:0;border-radius:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--colored.Toastify__toast--default,.Toastify__toast-theme--light{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{color:var(--toastify-text-color-info);background:var(--toastify-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{color:var(--toastify-text-color-success);background:var(--toastify-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{color:var(--toastify-text-color-warning);background:var(--toastify-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{color:var(--toastify-text-color-error);background:var(--toastify-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning{background:var(--toastify-color-transparent)}.Toastify__close-button{color:#fff;background:transparent;outline:none;border:none;padding:0;cursor:pointer;opacity:.7;transition:.3s ease;align-self:flex-start}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentColor;height:16px;width:14px}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{position:absolute;bottom:0;left:0;width:100%;height:5px;z-index:var(--toastify-z-index);opacity:.7;transform-origin:left}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{right:0;left:auto;transform-origin:right}.Toastify__spinner{width:20px;height:20px;box-sizing:border-box;border:2px solid;border-radius:100%;border-color:var(--toastify-spinner-color-empty-area);border-right-color:var(--toastify-spinner-color);animation:Toastify__spin .65s linear infinite}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{transform:perspective(400px) rotateX(90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{transform:perspective(400px) rotateX(-20deg);opacity:1}to{transform:perspective(400px) rotateX(90deg);opacity:0}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(110%,0,0)}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(-110%,0,0)}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,500px,0)}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,-500px,0)}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown}@keyframes Toastify__spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
/* global tokens */
:root {
    /* animation */
    --venia-global-anim-bounce: cubic-bezier(0.5, 1.8, 0.9, 0.8);
    --venia-global-anim-in: cubic-bezier(0, 0, 0.2, 1);
    --venia-global-anim-out: cubic-bezier(0.4, 0, 1, 1);
    --venia-global-anim-standard: cubic-bezier(0.4, 0, 0.2, 1);

    /* color */
    --venia-global-color-blue-100: 194 200 255;
    --venia-global-color-blue-400: 61 132 255;
    --venia-global-color-blue-500: 51 109 255;
    --venia-global-color-blue-600: 41 84 255;
    --venia-global-color-blue-700: 31 57 255;
    --venia-global-color-blue-800: 23 43 196;
    --venia-global-color-gray-50: 255 255 255;
    --venia-global-color-gray-75: 250 250 250;
    --venia-global-color-gray-100: 244 245 245;
    --venia-global-color-gray-200: 234 235 235;
    --venia-global-color-gray-300: 223 225 226;
    --venia-global-color-gray-400: 181 184 186;
    --venia-global-color-gray-500: 149 154 157;
    --venia-global-color-gray-600: 118 123 127;
    --venia-global-color-gray-700: 84 93 99;
    --venia-global-color-gray-800: 51 63 71;
    --venia-global-color-gray-900: 23 32 38;
    --venia-global-color-gray: var(--venia-global-color-gray-100);
    --venia-global-color-gray-dark: var(--venia-global-color-gray-300);
    --venia-global-color-gray-darker: var(--venia-global-color-gray-600);
    --venia-global-color-green-400: 51 171 132;
    --venia-global-color-green-500: 45 157 120;
    --venia-global-color-green-600: 38 142 108;
    --venia-global-color-green-700: 18 128 92;
    --venia-global-color-orange: 241 99 33;
    --venia-global-color-red-400: 236 91 98;
    --venia-global-color-red-500: 227 72 80;
    --venia-global-color-red-600: 215 55 63;
    --venia-global-color-red-700: 201 37 45;
    --venia-global-color-red-800: 161 30 36;
    --venia-global-color-teal: var(--venia-global-color-blue-400);
    --venia-global-color-teal-dark: var(--venia-global-color-blue-600);
    --venia-global-color-teal-light: var(--venia-global-color-gray-100);

    /* color by semantics */
    --venia-global-color-background: var(--venia-global-color-gray-50);
    --venia-global-color-border: var(--venia-global-color-gray-300);
    --venia-global-color-error: var(--venia-global-color-red-700);
    --venia-global-color-text: var(--venia-global-color-gray-900);
    --venia-global-color-text-alt: var(--venia-global-color-gray-darker);
    --venia-global-color-text-hint: var(--venia-global-color-gray-500);
    --venia-global-color-warning-dark: var(--venia-global-color-red-700);
    --venia-global-color-warning-light: var(--venia-global-color-gray-100);

    /* font family */
    --venia-global-fontFamily-sansSerif: "Muli", sans-serif;
    --venia-global-fontFamily-serif: "Source Serif Pro", serif; 
    --venia-global-fontFamily-inter: "Inter", sans-serif;

    /* font size */
    --venia-global-fontSize-50: 0.6875rem; /* 11px */
    --venia-global-fontSize-75: 0.75rem; /* 12px */
    --venia-global-fontSize-100: 0.875rem; /* 14px */
    --venia-global-fontSize-200: 1rem; /* 16px */
    --venia-global-fontSize-300: 1.125rem; /* 18px */
    --venia-global-fontSize-400: 1.25rem; /* 20px */
    --venia-global-fontSize-500: 1.375rem; /* 22px */
    --venia-global-fontSize-600: 1.5rem; /* 24px */
    --venia-global-fontSize-700: 1.75rem; /* 28px */
    --venia-global-fontSize-800: 2rem; /* 32px */
    --venia-global-fontSize-900: 2.25rem; /* 36px */
    --venia-global-fontSize-1000: 2.5rem; /* 40px */
    --venia-global-fontSize-1100: 3rem; /* 48px */
    --venia-global-fontSize-1200: 3.5rem; /* 56px */

    /* font weight */
    --venia-global-fontWeight-normal: 400;
    --venia-global-fontWeight-semibold: 600;
    --venia-global-fontWeight-bold: 700;

    /* line height */
    --venia-global-lineHeight-100: 1;
    --venia-global-lineHeight-200: 1.25;
    --venia-global-lineHeight-300: 1.5;
    --venia-global-lineHeight-400: 1.75;
    --venia-global-lineHeight-500: 2;

    /* dimensions */
    --venia-global-maxWidth: 1440px;
    --venia-global-header-minHeight: 5rem;
}

@media (max-width: 960px) {
    :root {
        --venia-global-header-minHeight: 3.5rem;
    }
}

/* alias tokens */
:root {
    /* colors */
    --venia-brand-color-1-100: var(--venia-global-color-blue-100);
    --venia-brand-color-1-400: var(--venia-global-color-blue-400);
    --venia-brand-color-1-500: var(--venia-global-color-blue-500);
    --venia-brand-color-1-600: var(--venia-global-color-blue-600);
    --venia-brand-color-1-700: var(--venia-global-color-blue-700);
    --venia-brand-color-1-800: var(--venia-global-color-blue-800);

    /* typography */
    /* heading */
    --venia-global-typography-heading-XL-fontSize: var(
        --venia-global-fontSize-600
    );
    --venia-global-typography-heading-L-fontSize: var(
        --venia-global-fontSize-400
    );
    --venia-global-typography-heading-M-fontSize: var(
        --venia-global-fontSize-300
    );
    --venia-global-typography-heading-S-fontSize: var(
        --venia-global-fontSize-200
    );
    --venia-global-typography-heading-XS-fontSize: var(
        --venia-global-fontSize-100
    );
    --venia-global-typography-heading-lineHeight: calc(
        var(--venia-global-lineHeight-200) * 1em
    );

    /* body */
    --venia-typography-body-XXXL-fontSize: var(--venia-global-fontSize-600);
    --venia-typography-body-XXL-fontSize: var(--venia-global-fontSize-500);
    --venia-typography-body-XL-fontSize: var(--venia-global-fontSize-400);
    --venia-typography-body-L-fontSize: var(--venia-global-fontSize-300);
    --venia-typography-body-M-fontSize: var(--venia-global-fontSize-200);
    --venia-typography-body-S-fontSize: var(--venia-global-fontSize-100);
    --venia-typography-body-XS-fontSize: var(--venia-global-fontSize-50);
    --venia-typography-body-lineHeight: calc(
        var(--venia-global-lineHeight-300) * 1em
    );

    /* detail */
    --venia-typography-detail-XL-fontSize: var(--venia-global-fontSize-200);
    --venia-typography-detail-L-fontSize: var(--venia-global-fontSize-100);
    --venia-typography-detail-M-fontSize: var(--venia-global-fontSize-75);
    --venia-typography-detail-S-fontSize: var(--venia-global-fontSize-50);
    --venia-typography-detail-lineHeight: calc(
        var(--venia-global-lineHeight-200) * 1em
    );
}

* {
    box-sizing: border-box;
}

html {
    background-color: rgb(var(--venia-global-color-gray-50));
    font-size: 100%;
    font-weight: var(--venia-global-fontWeight-normal);
    line-height: var(--venia-global-lineHeight-300);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--venia-global-fontFamily-inter);
}

/*
 * Lock the window's scroll position while an overlay is active.
 * Has no effect in iOS Safari.
 * https://bugs.webkit.org/show_bug.cgi?id=153852
 *
 * :global(html[data-scroll-lock='true'] body) {
 *   overflow: hidden ;
 * }
 */

body,
button,
input,
select,
textarea {
    color: rgb(var(--venia-global-color-text));
    font-family: var(--venia-global-fontFamily-inter);
}

body {
    background-color: rgb(var(--venia-global-color-gray-50));
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: var(--venia-global-fontSize-200);
    font-weight: var(--venia-global-fontWeight-normal);
    margin: 0;
}

h1 {
    font-size: var(--venia-global-fontSize-600);
}

h2 {
    font-size: var(--venia-global-fontSize-400);
}

a {
    color: currentColor;
    text-decoration: none;
}

p {
    margin: 0;
}

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

dd,
dt {
    margin: 0;
}

button {
    background: none;
    border: 0;
    cursor: pointer;
    font-size: 100%;
    padding: 0;
    touch-action: manipulation;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-appearance: none;
}

.icon-root-cnm {
    touch-action: manipulation;
}

.icon-icon-P1l {
    fill: var(--fill, none);
    stroke: var(--stroke, rgb(var(--venia-global-color-text)));
}

.icon-icon_desktop-C0k {
}

.indicator-root-xtL {
    height: calc(100% - 6rem);
}

.indicator-global-W6p {
}

.indicator-message-jbb {
    letter-spacing: 0.25em;
}

.indicator-indicator-4ge {
    animation-direction: alternate;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: indicator-pulse-PNk;
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes indicator-pulse-PNk {
    0% {
        filter: grayscale(1);
        transform: scale(0.75) rotate(-540deg);
    }
    100% {
        filter: grayscale(0);
        transform: scale(1) rotate(0deg);
    }
}

.category-root-89q {
}

.category-title-J65 {
}

.category-pagination-W3D {
}

.category-placeholder-eiC {
}

.category-categoryTitle-hxg {
}

.category-heading-cBC {
}

.category-categoryContent-yd9 {
}

.category-categoryInfo-WW8 {
    flex-basis: 100%;
}

.category-headerButtons-ZNv {
    flex-basis: 100%;
}

.category-contentWrapper-2W7 {
}

.category-sidebar-HXv {
}

.breadcrumbs-root-wm7 {
    /* Permanent height to prevent pop-in. */
    /* Show ellipses when overflowing. */
}

.breadcrumbs-text-tTO {
}

.breadcrumbs-divider-oYN {
}

.breadcrumbs-link-FR- {
}

.breadcrumbs-currentCategory-T3w {
}

.button-root-MFn {
    padding-top: calc(0.5rem + 1px); /* TODO @TW: review */
    padding-bottom: calc(0.5rem - 1px); /* TODO @TW: review */
    min-height: 2.5rem;
    transition-duration: 256ms;
    transition-property: background-color, border-color, color;
    transition-timing-function: var(--venia-global-anim-standard);
}

.button-root-MFn:active {
    transition-duration: 128ms;
}

/**
 * Some browsers retain the :hover state after a click, this ensures if a button becomes disabled after
 * being clicked it will be visually disabled.
 */
.button-root-MFn:hover:disabled {
    /* TODO @TW: cannot compose. This may not be possible with two variants. */
    pointer-events: none;
}

.button-root_lowPriority-Qoh {
}

.button-root_normalPriority-1E0 {
}

.button-root_highPriority-UpE {
}

.button-root_lowPriorityNegative-uax,
.button-root_normalPriorityNegative-x-d {
}

.button-root_highPriorityNegative-gwK {
}

.button-content-TD8 {
}

.checkbox-root-hF1 {
    --stroke: var(--venia-global-color-gray-600);
    grid-template-areas: 'input label';
    grid-template-columns: min-content 1fr;
}

.checkbox-input-WEy {
    grid-area: input;

    /* TODO @TW: review, replaces input:disabled. Check if working. */
}

.checkbox-icon-eiW {
    grid-area: input;
}

.checkbox-icon-eiW svg {
    stroke: rgb(var(--stroke));
}

.checkbox-label-wHh {
    grid-area: label;
}

/* When the input is disabled, update the cursor on the sibling label element. */
/* TODO @TW: cannot compose */
.checkbox-input-WEy:disabled ~ .checkbox-label-wHh {
    cursor: default;
}

.checkbox-input-WEy:checked:enabled + .checkbox-icon-eiW {
    --stroke: var(--venia-brand-color-1-700);
}

/* TODO @TW: cannot compose, needs "checked" variant enabled. Cannot combine variants. */
.checkbox-input-WEy:active:enabled,
.checkbox-input-WEy:focus:enabled {
    /* composes: active_shadow-radioActive from global; */
    /* composes: focus_shadow-radioFocus from global; */
    box-shadow: -3px 3px rgb(var(--venia-brand-color-1-100));
    outline: none;
}

.checkbox-input_shimmer-yEr {
}

.radio-root-Mbw {
    grid-template-areas: 'input label';
    grid-template-columns: min-content 1fr;
}

.radio-input-Mgy {
    grid-area: input;
}

.radio-icon-QeD {
    grid-area: input;
}

/* TODO @TW: cannot compose */
.radio-icon-QeD svg {
    /* composes: stroke-gray-600 from global; */
    stroke: rgb(var(--venia-global-color-gray-600));
}

.radio-label-n0x {
    grid-area: label;
}

/* TODO @TW: cannot compose */
.radio-input-Mgy:checked + .radio-icon-QeD svg {
    /* composes: stroke-brand-base from global; */
    stroke: rgb(var(--venia-brand-color-1-700));
}

.radio-input_shimmer-1vi {
}

.field-root-fSe {
}

.field-label-zVe {
    min-height: 2.125rem;
}

.field-input-2Mu {
    padding: calc(0.375rem - 1px) calc(0.625rem - 1px); /* TODO @TW: review */
}

.field-input-2Mu:disabled {
    background: rgb(var(--venia-global-color-gray-100));
    border-color: rgb(var(--venia-global-color-gray-400));
    color: rgb(var(--venia-global-color-gray-darker));
}

.field-optional-EDv {
}

.textArea-input-Rk3 {
}

.textArea-input_shimmer-SJm {
    font-size: 1rem;
}

.textInput-input-PzO {
}

.textInput-input_error-2j1 {
}

.textInput-input_shimmer-BRC {
    font-size: 1rem;
    padding: calc(0.375rem - 1px) calc(0.625rem - 1px);
}

.shimmer-root-N6z {
}

/* TODO @TW: cannot compose */
.shimmer-root-N6z::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: var(
        --venia-global-maxWidth
    ); /* TODO @TW: review. this should use TW theme value "maxWidth.site" */
    height: 100%;
    background-image: linear-gradient(
        to right,
        rgb(var(--venia-global-color-gray-50) / 0%) 0%,
        rgb(var(--venia-global-color-gray-50)) 40%,
        rgb(var(--venia-global-color-gray-50) / 0%) 80%,
        rgb(var(--venia-global-color-gray-50) / 0%) 100%
    );
    /* composes: bg-no-repeat from global; */
    background-repeat: none;
    background-size: var(--venia-global-maxWidth) 100%;
    -webkit-animation-name: shimmer-shimmerAnimation-rGT;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-fill-mode: forwards;
    will-change: transform;
}

.shimmer-root_rectangle-Hcb {

    min-height: 1rem;
}

.shimmer-root_button-AUG {
}

.shimmer-root_checkbox-Reu {
}

.shimmer-root_radio-y1q {
}

.shimmer-root_textArea-H8r {

    min-height: 6.75rem;
}

.shimmer-root_textInput-X-e {
}

.filterSidebar-root-x-X {
    grid-template-rows: 1fr 7rem;
}

.filterSidebar-body-MjM {
}

.filterSidebar-header-DOQ {
}

.filterSidebar-headerTitle-AWJ {
}

.filterSidebar-action-K4d {
}

/* TODO @TW: cannot compose */
.filterSidebar-action-K4d button {
    /* composes: text-sm from global; */
    font-size: 0.875rem;
    /* composes: no-underline from global; */
    text-decoration: none;
}

.filterSidebar-blocks-6oz {
}

/* TODO @TW: cannot compose */
.filterSidebar-blocks-6oz > li:last-child {
    /* composes: border-b-2 from global; */
    /* composes: border-solid from global; */
    /* composes: border-subtle from global; */
    border-bottom: 2px solid rgb(var(--venia-global-color-border));
}

.filterModalOpenButton-filterButton-qRo {
}

.filterModalOpenButton-shimmer-filterButtonShimmer-k51 {
}

.productSort-root-F2c {
}

.productSort-menu-JBm {
}

.productSort-menuItem-AxK {
}

.productSort-sortButton-lQQ {
    /* TODO @TW: review (C2). This is fragile to extend. */
}

.productSort-desktopText-mG- {
}

.productSort-sortText-5AR {
}

.productSort-desktopIconWrapper-evU {

    transform: translateX(10px);
}

.productSort-desktopIcon-3Aw {
}

.productSort-mobileText-fbc {
}

.productSort-shimmer-root-VWk {
}

.productSort-shimmer-sortButtonShimmer-aTy {
}

.sortedByContainer-root-BWM {
}

.sortedByContainer-sortText-LvT {
}

.gallery-root-BDi {
    grid-template-areas:
        'actions'
        'items';
}

.gallery-items-mt3 {
    grid-area: items;
    grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 639px) {
    .gallery-items-mt3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

.image-root-ZSi {
    /*
     * For customization, we provide an empty root.
     * These styles will be applied to the image container.
     */
}

.image-container-dLP {
}

.image-image-f-I {
    /*
     * For customization, we provide an empty image class.
     * These styles will be applied directly to the image itself.
     */
}

.image-loaded-GZ- {

    /* TODO @TW: review (B6) */
    /* composes: visible from global; */
    visibility: visible;
}

.image-notLoaded-thf {

    /* TODO @TW: review (B6) */
    /* composes: invisible from global; */
    visibility: hidden;
}

.image-placeholder-XTV {
}

.image-placeholder_layoutOnly-KCq {
}

.item-root-DV2 {
}

.item-images-zZO {
    grid-template-areas: 'main';
    position: relative;
}

.item-imageContainer-DzC {
    grid-area: main;
}

.item-image-U-P {
    transition: opacity 512ms ease-out;
}

.item-imageLoaded-3ZL {
}

.item-imageNotLoaded-WQY {
}

.item-imagePlaceholder-kqH {
}

.item-actionsContainer-9pP {
    grid-template-columns: auto auto;
}

/* TODO @TW: cannot compose */
.item-actionsContainer-9pP:empty {
    display: none;
}

.item-name-S9z {
}

.item-name-S9z,
.item-price-5Og {
    min-height: 1rem;
}

.item-unavailableContainer-kQZ {
}

.errorView-root-w4d {
    background: var(--backroundImageUrl);
    /* two column grid because the "hangers" are on the right side of the page */
    /* TODO @TW: review */
    grid-template: 'content .';
}

.errorView-content-LDK {
    grid-area: content;
}

.errorView-header-g2J {
}

.errorView-message-HMD {
    /* add a little space so the button is centered below the message */
}

.errorView-actionsContainer-wkA {
}

@media (max-width: 639px) {
    .errorView-root-w4d {
        background-image: var(--mobileBackgroundImageUrl);
        /* two row grid because the "hangers" are on the top of the page */
        grid-template-rows: 1fr 1fr;
        grid-template-areas:
            '.'
            'content';
    }
}

/*
 * Target all rows.
 */
.venia-home-row-1,
.venia-home-row-2,
.venia-home-row-3 {
    --brightBlue: 233 100% 056%;
    color: hsl(205 024% 012%);
    max-width: 1440px !important;
}

/*
 * Target all buttons.
 */
.venia-home-row-1 a {
    align-items: center;
    background-color: transparent;
    border: 2px solid hsl(var(--brightBlue));
    border-radius: 1.25rem;
    color: hsl(var(--brightBlue));
    display: inline-flex;
    font-size: 14px !important;
    font-weight: 700 !important;
    height: 2.5rem;
    justify-content: center;
    letter-spacing: 0.25px;
    margin-right: 0.75rem;
    margin-top: 0.75rem;
    min-width: 12rem;
    text-decoration: none !important;
    text-transform: uppercase;
}
.venia-home-row-1 a:active,
.venia-home-row-1 a:focus {
    box-shadow: -6px 6px hsl(var(--brightBlue) / 0.3);
    outline: none;
}

/*
 * Target the wrapper within the first row.
 */
.venia-home-row-1 > div {
    background: none !important;
    display: grid !important;
    grid-template-columns: 100%;
    padding: 0 !important;
    row-gap: 2rem;
}

/*
 * Target all column groups after the slider.
 */
.venia-home-slider ~ div {
    display: grid !important;
    gap: 0;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    grid-template-columns: repeat(3, 1fr);
    padding: 0 1rem;
    z-index: 1;
}

@media (max-width: 959px) {
    .venia-home-slider ~ div {
        grid-auto-flow: row;
        grid-template-columns: 100%;
        text-align: center;
    }
}

/*
 * Target the callout containers below the slider.
 */
.venia-home-slider + div {
    gap: 2rem;
    margin-top: -2rem;
}

/*
 * Target the slider.
 */
.venia-home-slider .slick-slider {
    min-height: 628px !important;
    margin-left: -1rem;
    max-width: 1440px;
    width: 100vw;
}

/*
 * Target the slider track.
 */
.venia-home-slider .slick-slider .slick-track {
    display: grid;
    grid-auto-flow: column;
}
.venia-home-slider .slick-slider .slick-track::before,
.venia-home-slider .slick-slider .slick-track::after {
    content: none;
}

/*
 * Target each slide.
 */
.venia-home-slider .slick-slider .slick-slide {
    float: none;
    line-height: 1.5;
    text-align: left;
}

/*
 * Target the banner wrapper within a slide.
 */
.venia-home-slider .slick-slide > div > div > div {
    align-items: center;
    background-position: right top !important;
    background-size: cover !important;
    display: grid !important;
    grid-auto-flow: column;
    grid-template-columns: 50% 50%;
    justify-items: center;
    padding: 0 0 6rem !important;
}

@media (max-width: 1280px) {
    .venia-home-slider .slick-slider {
        min-height: 548px !important;
    }

    .venia-home-slider .slick-slide > div > div > div {
        min-height: 580px !important;
    }
}

@media (max-width: 959px) {
    .venia-home-slider .slick-slide > div > div > div {
        align-content: end;
        background-position: right center !important;
        color: white;
        grid-template-columns: auto;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        text-align: center;
    }

    .venia-home-slider .slick-slide > div > div > div::before {
        background-image: linear-gradient(
            180deg,
            transparent,
            rgba(0 0 0 / 0.2),
            rgba(0 0 0 / 0.6)
        );
        content: '';
        display: block;
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }
}

.venia-home-slider .slick-slide > div > div > div > div {
    margin: 0 !important;
    padding: 0 !important;
}

/*
 * Target the content of a slide.
 */
.venia-home-slider .slick-slide h2 {
    font-family: 'Source Serif Pro';
    font-size: 40px !important;
    font-weight: 600 !important;
}

.venia-home-slider .slick-slide a {
    background-color: hsl(var(--brightBlue));
    color: white;
}

/*
 * Target the slide selection controls.
 */
.venia-home-slider .slick-slider .slick-dots {
    align-items: center;
    display: grid !important;
    grid-auto-flow: column;
    height: 4rem;
    justify-content: center;
    margin-top: -6rem;
    padding: 0 0 2rem;
}

/*
 * Target each item within the slide selection controls.
 */
.venia-home-slider .slick-slider .slick-dots li {
    height: auto;
    margin: 0;
    width: auto;
}

/*
 * Target each button within the slide selection controls.
 */
.venia-home-slider .slick-slider .slick-dots li > button {
    background-clip: content-box !important;
    border-color: transparent;
    border-radius: 50%;
    border-style: solid;
    border-width: 0.875rem;
    height: 2.5rem !important;
    margin: 0;
    transition: none;
    width: 2.5rem !important;
}

/*
 * Target all callouts below the slider.
 */
.venia-home-callout {
    align-content: end !important;
    background-size: cover !important;
    display: grid !important;
    height: 280px !important;
    justify-content: end !important;
    margin: 0 !important;
    min-height: 280px !important;
    padding: 0 !important;
    width: 100% !important;
}

@media (max-width: 959px) {
    .venia-home-callout {
        justify-self: center;
        max-width: 640px;
    }
}

/*
 * Target the text box within a callout.
 */
.venia-home-callout-text {
    align-content: center;
    background-color: rgb(27 37 44) !important;
    border-bottom: 0.5rem solid hsl(233 100% 056%) !important;
    display: grid;
    gap: 0.25rem;
    height: 6.5rem !important;
    line-height: 1.5 !important;
    padding: 0 1.5rem !important;
    text-align: left !important;
    transform: translate3d(1rem, 0.5rem, 0);
    width: 16rem;
}

@media (max-width: 959px) {
    .venia-home-callout-text {
        transform: translate3d(0, 0.5rem, 0);
    }
}

.venia-home-callout-text > h2 {
    font-family: 'Source Serif Pro';
    font-size: 24px !important;
    font-weight: 600 !important;
    margin: 0;
}

.venia-home-callout-text > p,
.venia-home-callout-text > p > span {
    font-size: 0.875rem !important;
    margin: 0;
}

/*
 * Target the content side of a type-A banner.
 */
.venia-home-banner-a-content {
    align-content: center !important;
    align-self: center !important;
    display: grid !important;
    grid-column: 1 / span 3;
    justify-content: center !important;
    margin: 0 !important;
    padding: 5rem 2rem !important;
    text-align: left;
    width: 100% !important;
}

@media (max-width: 959px) {
    .venia-home-banner-a-content {
        grid-column: 1 / span 1;
        padding-top: 0 !important;
        text-align: center;
    }
}

.venia-home-banner-a-content > div {
    max-width: 480px !important;
}

.venia-home-banner-a-content > div h2 {
    font-family: 'Source Serif Pro';
    font-size: 40px !important;
    font-weight: 600;
    margin-bottom: 2rem !important;
}

.venia-home-banner-a-content > div h3 {
    font-size: 18px !important;
    font-weight: 600;
    margin: 0 0 1rem !important;
}

.venia-home-banner-a-image {
    align-self: center !important;
    background-position: center center !important;
    background-size: cover !important;
    grid-column: 4 / span 2;
    margin: 0 !important;
    min-height: 360px !important;
    padding: 0 !important;
    width: 100% !important;
}

@media (max-width: 959px) {
    .venia-home-banner-a-image {
        background-position: center bottom !important;
        grid-column: 1 / span 1;
        grid-row: 1 / span 1;
        margin-top: 4rem !important;
    }
}

/*
 * Target the content of a type-B banner.
 */
.venia-home-banner-b-image {
    background-position: center center !important;
    background-size: cover !important;
    grid-column: 1 / span 3;
    min-height: 368px !important;
    width: 100% !important;
}

@media (max-width: 959px) {
    .venia-home-banner-b-image {
        grid-column: 1 / span 1;
    }
}

.venia-home-banner-b-content {
    grid-column: 4 / span 2;
    padding: 5rem !important;
    text-align: left;
    width: 100% !important;
}

@media (max-width: 959px) {
    .venia-home-banner-b-content {
        grid-column: 1 / span 1;
        margin: 0 1rem !important;
        text-align: center;
        width: auto !important;
    }
}

.venia-home-banner-b-content > div h2 {
    font-family: 'Source Serif Pro';
    font-size: 40px !important;
    font-weight: 600;
}

.venia-home-banner-b-content > div a {
    background-color: transparent;
    border-color: white;
    color: white;
}

/*
 * Target the second row.
 */
.venia-home-row-2 h2 {
    font-family: 'Source Serif Pro';
    font-size: 40px !important;
    font-weight: 600;
}

.venia-home-products .slick-slider .slick-dots {
    align-items: center;
    display: grid !important;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    height: auto;
    justify-content: center;
    padding: 0;
}

.venia-home-products .slick-slider .slick-dots li {
    height: auto;
    margin: 0;
    width: auto;
}

.venia-home-products .slick-slider .slick-dots li > button {
    background-clip: content-box !important;
    border-color: transparent;
    border-radius: 0;
    border-style: solid;
    border-width: 1rem 0;
    filter: none !important;
    height: 2.5rem !important;
    margin: 0;
    transition: none;
    width: 100% !important;
}

.venia-home-products .slick-slider .slick-dots .slick-active > button {
    background-color: hsl(205 004% 048%) !important;
}

.venia-home-banner-text > div {
    flex-direction: unset !important;
    justify-content: normal !important;
}

@media (max-width: 960px) {
    .venia-home-banner-text > div {
        flex-direction: column !important;
        justify-content: center !important;
    }
}

.main-root-YLm {
}

.main-root_masked-YlY {
}

.main-page-hXb {
    min-height: 30rem;
}

.main-page_masked-X6Z {
}

/* @media (min-height: 640px) {
    .page {
        min-height: 48rem;
    }
}

@media (min-height: 768px) {
    .page {
        min-height: 60rem;
    }
}

@media (min-height: 960px) {
    .page {
        min-height: 72rem;
    }
} */