/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/@wordpress/scripts/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/@wordpress/scripts/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/@wordpress/scripts/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./css/style.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/**
 * Tools that *must not* produce any CSS output.
 */
/**
 * Tools that *must not* produce any CSS output.
 *
 * This stylesheet should contain:
 * - SCSS mixins
 * - SCSS functions
 * - SCSS variables (but not CSS custom properties as they are outputted)
 */
/*
 * rem()
 * Converts px values to rem, starting from the base font-size.
 *
 * When to use which?
 * Should this value scale up as the user increases their browser’s
 * default font size?
 * If the value should increase then rem is usually the way to go.
 * Otherwise it’s px.
 *
 * @see: https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/
 *
 * Usage:
 * property: rem(32)
 */
/*
 * Strips unneeded units from being passed in, like "px".
 */
/*
 * asset()
 * Returns path to file inside of the assets folder.
 * Should not include trailing slash
 *
 * Usage:
 * background-image: asset( "svg/icons/facebook.svg" );
 * src: asset("font/open-sans.woff2") format("woff2");
 */
/*
 * ELEVATIONS
 */
/*
 * query($breakpoint, $mode)
 *
 * Generates the query value according to breakpoints defined in pixels.
 * Preferred usage is mobile-first:
 * Common examples:
 * @media (query($tablet)) {
 *
 * A mobile-only media query:
 * @media (query($tablet, max) {
 *
 * This also supports undefined breakpoints like:
 * @media (query(600px)) {
 * compiles to: @media (screen and (min-width: 600px)) {
 * or
 * @media (query(600px, max)) {
 * compiles to: @media (screen and (max-width: 599px)) {
 */
/*
 * Container
 *
 * To be used for centering the content.
 */
/*
 * BREAKPOINTS MIXINS
 *
 * Syntactic sugar for breakpoints.
 *
 * Usage:
 * @include break-desktop {
 */
/*
 * Remove scrollbar.
 * To be used on overflowing elements controlled with button controls or swipes.
 */
/*
 * EDITOR MIXINS
 *
 * Outputting styles specific to the editor, or non-editor.
 *
 * Usage:
 * @include block-editor-only {
 * @include non-block-editor {
 */
/*
 * EASING FUNCTIONS
 * Contains common easing functions.
 * Preview at: https://codepen.io/mehigh/full/qBYpVYp
*/
/*
 * TRANSITION FUNCTIONS
 * Helps maintain transition types per type of movement.
 *
 * Examples:
 * .some-element-which-moves-and-changes-text-color {
 *   transition: $transition-color, $transition-transform;
 * .some-element-which-scales {
 *   transition: $transition-scale;
 */
.tpgb-plus-button .button-link-wrap {
  transition: background-color 300ms, color 300ms, border-color 300ms;
}

/**
 * Typography mixins
 *
 * This file is an unique place that controls the typography variables.
 * Then the mixins or the classes will be used on the right location,
 * to create the UI.
 */
/**
 * Display
 *
 * @see https://www.figma.com/file/pGs84lEn8C3LAmqKw3U2DW/Express-Kit?node-id=4089-32361&t=Euj1bG5mv3gqOxsh-4
 */
/**
 * Headlines.
 */
/**
 * Headings
 * Differ from "Headlines"
 * in that they are used for editorial content.
 */
/*
 * Standard typography (including p) inherited.
 * See --p--font-size & --p--line-height variables
 */
/**
 * Detail.
 */
/**
 * Body Copy.
 */
/**
 * Blockquote.
 *
 * This mixin is used inside /css/src/blocks/_core-quote.scss
 */
/**
 * Form Inputs.
 *
 * This mixin is used inside /css/src/elements/_form.scss
 */
/**
 * Form Label.
 *
 * This mixin is used inside /css/src/elements/_form.scss
 */
/**
 * Buttons.
 *
 * This mixin is used inside /css/src/elements/_buttons.scss
 */
/**
 * Code
 */
/**
 * Elements
 * Tiny, reusable components
 */
html {
  box-sizing: border-box;
  scroll-behavior: smooth;
}

* {
  box-sizing: border-box;
}

.hide {
  display: none !important;
}

.text-shadow {
  text-shadow: 2px 2px 3px #000;
}

.negative-overlay {
  position: relative;
  z-index: 10;
}

.hover .wc-block-grid__product-image {
  transition: transform 300ms;
}
.hover .wc-block-grid__product-image:hover {
  transform: translateY(-8px);
}

.tabs.wc-tabs {
  display: none;
}

.woocommerce-tabs {
  margin: 0;
  padding: 0;
}
.woocommerce-tabs ul.wc-tabs {
  margin-bottom: 20px;
}

.woocommerce-Tabs-panel--description > h2:first-child {
  display: none;
}

.wc-block-add-to-cart-form .quantity .qty {
  width: 60px;
}

.woocommerce .quantity .qty {
  padding: 7px;
  width: 4em;
}
.woocommerce div.product form.cart {
  margin-bottom: 7px;
}
.woocommerce div.product form.cart div.quantity {
  margin-left: 0;
}
.woocommerce div.product div.images .flex-control-thumbs {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

.woocommerce-checkout #payment {
  border-top: 1px solid;
}

.wc-block-cart-items {
  border-collapse: collapse;
}

.wc-block-cart-items__row {
  border-bottom: 1px solid;
}

.select2-results__option {
  color: var(--color--ink);
}

.wc-block-product {
  justify-content: space-between;
  display: flex;
  flex-direction: column;
}

.wc-block-components-product-image img {
  border: 1px solid var(--color--white);
}

.woocommerce-Button {
  transition: background-color 300ms;
}
.woocommerce-Button:hover {
  background-color: var(--color--accent-hover);
}

.wc-block-components-notice-banner.is-info {
  border-color: var(--color--accent);
}
.wc-block-components-notice-banner.is-info > svg {
  background-color: var(--color--ink);
}

.wc-block-components-notice-banner a {
  color: var(--color--accent);
}

.p-FieldLabel {
  color: var(--color--ink);
}

.wc-block-product-categories__button {
  background: var(--color--accent);
  height: 20px;
  padding: 0;
  top: 8px;
  border: none;
  color: var(--color--white);
}

@media (max-width: 820px) {
  .hide-on-mobile {
    display: none !important;
  }
  .negative-overlay {
    margin-top: -10px !important;
  }
  .no-gap {
    gap: 0;
  }
  .wp-block-loginout a {
    color: var(--color--ink);
  }
}
@media (min-width: 821px) {
  .hide-on-desktop {
    display: none !important;
  }
}
@media (max-width: 768px) {
  :root {
    --wp--preset--spacing--20: 15px;
    --wp--preset--spacing--30: 20px;
  }
  .mobile-no-margin {
    padding-right: 0 !important;
  }
}
/*
 * IAP brand tokens.
 *
 * Source of truth for colors, fonts, and radii (paired with the theme.json
 * preset palette — keep the two in sync). Brand reference lives in
 * wp-content/Design/brand-kit_*.md + design JPGs.
 *
 * NOTE: the brand-kit md documents the DARK Lovable prototype; the build
 * target is LIGHT mode (per the design JPGs). Mapping from the kit:
 *   #0D9688 primary accent   → "teal" / token "accent" / theme.json accent-1
 *   #16B6A6 accent hover     → "teal-hover" / token "accent-hover" / accent-5
 *   #0A0A0A ink (text)       → "ink" / theme.json contrast
 *   #F5F6F5 section band     → "neutral-700" + "off-white" / accent-3
 *   #6B7280 secondary text   → "neutral-300" / accent-2
 *   #989EA9 subdued text     → "neutral-400"
 *   #EF4444 destructive      → "red" / "red-500"
 *   #0A7DEF / #79D9AF        → "blue" / "green" — LOGO-ONLY, not for UI accents
 */
:root {
  /*
   * COLORS
   * Contains variables referenced from theme.json.
   */
  --color--black: #000;
  --color--ink: #0a0a0a;
  --color--neutral-100: #0a0a0a;
  --color--neutral-200: #1f1f1f;
  --color--neutral-300: #6b7280;
  --color--neutral-400: #989ea9;
  --color--neutral-500: #d1d5db;
  --color--neutral-600: #e5e7eb;
  --color--neutral-700: #f5f6f5;
  --color--neutral-white: #fff;
  --color--white: #fff;
  --color--off-white: #f5f6f5;
  --color--blue: #0a7def;
  --color--green: #79d9af;
  --color--teal: #0d9688;
  --color--teal-hover: #16b6a6;
  --color--teal-dark: #0b7a6f;
  --color--teal-tint: #e7f5f3;
  --color--red: #ef4444;
  --color--red-100: #991b1b;
  --color--red-300: #b91c1c;
  --color--red-500: #ef4444;
  --color--red-700: #f87171;
  --color--red-900: #fee2e2;
  --color--green-100: #105023;
  --color--green-300: #288141;
  --color--green-500: #42be65;
  --color--green-700: #ccf5d7;
  --color--green-900: #e5faeb;
  --color--orange-500: #f59e0b;
  --color--base: var(--color--white);
  --color--accent: var(--color--teal);
  --color--accent-hover: var(--color--teal-hover);
  --color--accent-darker: var(--color--teal-dark);
  --color--primary: var(--color--ink);
  --color--darkest: var(--color--neutral-100);
  --color--darker: var(--color--neutral-200);
  --color--dark: var(--color--neutral-300);
  --color--medium: var(--color--neutral-500);
  --color--light: var(--color--neutral-700);
  --color--error: var(--color--red-500);
  --color--warning: var(--color--orange-500);
  --color--success: var(--color--green-500);
  --color--info: var(--color--blue);
  --color--background-alt: var(--color--neutral-700);
  /*
   * RADII
   * Brand: 6px base scale, ~4px buttons.
   */
  --radius--base: 6px;
  --radius--button: 4px;
  --radius--pill: 999px;
  /*
   * TYPOGRAPHY
   * Contains variables referenced from theme.json.
   */
  --font-family--sans: "Inter", sans-serif;
  --font-family--serif: 'Inter', sans-serif;
  --font-family--display: 'Space Grotesk', sans-serif;
  --font-family--primary: var(--font-family--sans);
  --font-family--secondary: var(--font-family--display);
  --font-family--body: var(--font-family--sans);
  --font-family--heading: var(--font-family--display);
  --font-family--headline: var(--font-family--display);
  --font-family--blockquote: var(--font-family--serif);
  --font-family--detail--sans: var(--font-family--sans);
  --font-family--detail--serif: var(--font-family--serif);
  --font-family--ui: var(--font-family--sans);
  --font-family--button: var(--font-family--primary);
  --font-size--xs: 0.75rem;
  --font-size--s: 0.875rem;
  --font-size--m: 1rem;
  --font-size--l: 1.125rem;
  --font-size--xl: 1.5rem;
  --font-size--2xl: 2rem;
  --font-size--3xl: 2.25rem;
  --font-size--4xl: 3rem;
  --font-size--5xl: 4rem;
  --font-weight--regular: 400;
  --font-weight--medium: 500;
  --font-weight--semibold: 600;
  --font-weight--bold: 700;
  --font-weight--extrabold: 800;
  --font-weight--black: 900;
  /*
   * Fluid font-sizes
   * font-size:
   *   clamp(var(--font-size--3xl),
   *   1vw + 1rem,
   *   var(--font-size--4xl));
   *
   * Calculate a Fluid Typography Scale
   * https://royalfig.github.io/fluid-typography-calculator/
   * In this case, the Max Viewport is set to 800px
   * (the value of --layout--content-size)
   * Min Viewport: 320px
   * Max Viewport: --layout--content-size (800px)
   */
  --f-font-size--xs: var(--font-size--xs);
  --f-font-size--s: clamp(var(--font-size--xs), 0.6667rem + 0.4167vw, var(--font-size--s));
  --f-font-size--m: clamp(var(--font-size--s), 0.7917rem + 0.4167vw, var(--font-size--m));
  --f-font-size--l: clamp(var(--font-size--m), 0.9166rem + 0.4167vw, var(--font-size--l));
  --f-font-size--xl: clamp(var(--font-size--l), 0.875rem + 1.25vw, var(--font-size--xl));
  --f-font-size--2xl: clamp(var(--font-size--xl), 1.1667rem + 1.6667vw, var(--font-size--2xl));
  --f-font-size--3xl: clamp(var(--font-size--2xl), 1.8333rem + 0.8334vw, var(--font-size--3xl));
  --f-font-size--4xl: clamp(var(--font-size--3xl), 1.75rem + 2.5vw, var(--font-size--4xl));
  --f-font-size--5xl: clamp(var(--font-size--4xl), 2.3333rem + 3.3333vw, var(--font-size--5xl));
}

body {
  font-family: var(--font-family--body);
  font-size: var(--f-font-size--m);
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: -0.2px;
  color: var(--wp--preset--color--contrast);
  background-color: var(--wp--preset--color--base);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-family--heading);
  line-height: 1.125;
  letter-spacing: -0.1px;
}

h1 {
  font-size: var(--wp--preset--font-size--xx-large);
}

h2 {
  font-size: var(--wp--preset--font-size--x-large);
}

h3 {
  font-size: var(--wp--preset--font-size--large);
}

h4 {
  font-size: var(--wp--preset--font-size--medium);
}

h5 {
  font-size: var(--wp--preset--font-size--small);
  letter-spacing: 0.5px;
}

h6 {
  font-size: var(--wp--preset--font-size--small);
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

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

/**
 * Reset styles.
 *
 * Minimal reset of style.
 * Some good practice are already in the inline CSS of each Gutenberg blocks.
 *
 * More about reset files:
 * https://piccalil.li/blog/a-modern-css-reset/
 * https://www.joshwcomeau.com/css/custom-css-reset/
 * https://github.com/twbs/bootstrap/blob/main/scss/_reboot.scss
 */
/**
 * Use box-sizing for every element.
 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/**
 * Site scroll padding in relation to admin bar.
 * Always visible scrollbar to lower CLS https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-gutter
 */
html {
  scroll-padding-top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--header-sticky--height, 0));
  scrollbar-gutter: stable;
  margin: 0;
}
html:focus-within {
  scroll-behavior: smooth;
}
@media (min-width: 960px) {
  html {
    --scrollbar--width: 0;
    max-width: calc(100vw - var(--scrollbar--width));
  }
}

@media (max-width: 599px) {
  #wpadminbar {
    position: fixed;
  }
}
/**
 * Set core body defaults.
 */
body {
  min-block-size: 100vh;
  text-rendering: optimizeSpeed;
  /* stylelint-disable-line value-keyword-case */
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  margin: 0;
  --wp--style--block-gap: 1.2rem;
}

/**
 * Make images easier to work with.
 */
/**
 * Remove built-in form typography styles.
 */
input,
button,
textarea,
select {
  font: inherit;
}

figure {
  margin-inline: 0;
  margin-block-start: 0;
}

/**
 * Remove all animations, transitions for people that prefer not to see them.
 * This is a global setting,
 * but it would be better to use it on a per-element basis.
 * https://web.dev/prefers-reduced-motion/#remove-motion-on-the-web
 *
 * These animations/@keyframes must be loaded from lazy.scss.
 * Comment the lines below if an approach on per-element basis is used.
 */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html:focus-within {
    scroll-behavior: auto;
  }
}
ul,
ol {
  margin: 0;
  padding: 0;
}

/**
 * Break words to fit paragraphs in container.
 */
p {
  word-wrap: break-word;
}

.text-black {
  color: #000;
}

.bg-black {
  background-color: #000;
}

.border-black {
  border-color: #000;
}

.text-ink {
  color: #0a0a0a;
}

.bg-ink {
  background-color: #0a0a0a;
}

.border-ink {
  border-color: #0a0a0a;
}

.text-neutral-100 {
  color: #0a0a0a;
}

.bg-neutral-100 {
  background-color: #0a0a0a;
}

.border-neutral-100 {
  border-color: #0a0a0a;
}

.text-neutral-200 {
  color: #1f1f1f;
}

.bg-neutral-200 {
  background-color: #1f1f1f;
}

.border-neutral-200 {
  border-color: #1f1f1f;
}

.text-neutral-300 {
  color: #6b7280;
}

.bg-neutral-300 {
  background-color: #6b7280;
}

.border-neutral-300 {
  border-color: #6b7280;
}

.text-neutral-400 {
  color: #989ea9;
}

.bg-neutral-400 {
  background-color: #989ea9;
}

.border-neutral-400 {
  border-color: #989ea9;
}

.text-neutral-500 {
  color: #d1d5db;
}

.bg-neutral-500 {
  background-color: #d1d5db;
}

.border-neutral-500 {
  border-color: #d1d5db;
}

.text-neutral-600 {
  color: #e5e7eb;
}

.bg-neutral-600 {
  background-color: #e5e7eb;
}

.border-neutral-600 {
  border-color: #e5e7eb;
}

.text-neutral-700 {
  color: #f5f6f5;
}

.bg-neutral-700 {
  background-color: #f5f6f5;
}

.border-neutral-700 {
  border-color: #f5f6f5;
}

.text-neutral-white {
  color: #fff;
}

.bg-neutral-white {
  background-color: #fff;
}

.border-neutral-white {
  border-color: #fff;
}

.text-white {
  color: #fff;
}

.bg-white {
  background-color: #fff;
}

.border-white {
  border-color: #fff;
}

.text-off-white {
  color: #f5f6f5;
}

.bg-off-white {
  background-color: #f5f6f5;
}

.border-off-white {
  border-color: #f5f6f5;
}

.text-blue {
  color: #0a7def;
}

.bg-blue {
  background-color: #0a7def;
}

.border-blue {
  border-color: #0a7def;
}

.text-green {
  color: #79d9af;
}

.bg-green {
  background-color: #79d9af;
}

.border-green {
  border-color: #79d9af;
}

.text-teal {
  color: #0d9688;
}

.bg-teal {
  background-color: #0d9688;
}

.border-teal {
  border-color: #0d9688;
}

.text-teal-hover {
  color: #16b6a6;
}

.bg-teal-hover {
  background-color: #16b6a6;
}

.border-teal-hover {
  border-color: #16b6a6;
}

.text-teal-dark {
  color: #0b7a6f;
}

.bg-teal-dark {
  background-color: #0b7a6f;
}

.border-teal-dark {
  border-color: #0b7a6f;
}

.text-teal-tint {
  color: #e7f5f3;
}

.bg-teal-tint {
  background-color: #e7f5f3;
}

.border-teal-tint {
  border-color: #e7f5f3;
}

.text-red {
  color: #ef4444;
}

.bg-red {
  background-color: #ef4444;
}

.border-red {
  border-color: #ef4444;
}

.text-red-100 {
  color: #991b1b;
}

.bg-red-100 {
  background-color: #991b1b;
}

.border-red-100 {
  border-color: #991b1b;
}

.text-red-300 {
  color: #b91c1c;
}

.bg-red-300 {
  background-color: #b91c1c;
}

.border-red-300 {
  border-color: #b91c1c;
}

.text-red-500 {
  color: #ef4444;
}

.bg-red-500 {
  background-color: #ef4444;
}

.border-red-500 {
  border-color: #ef4444;
}

.text-red-700 {
  color: #f87171;
}

.bg-red-700 {
  background-color: #f87171;
}

.border-red-700 {
  border-color: #f87171;
}

.text-red-900 {
  color: #fee2e2;
}

.bg-red-900 {
  background-color: #fee2e2;
}

.border-red-900 {
  border-color: #fee2e2;
}

.text-green-100 {
  color: #105023;
}

.bg-green-100 {
  background-color: #105023;
}

.border-green-100 {
  border-color: #105023;
}

.text-green-300 {
  color: #288141;
}

.bg-green-300 {
  background-color: #288141;
}

.border-green-300 {
  border-color: #288141;
}

.text-green-500 {
  color: #42be65;
}

.bg-green-500 {
  background-color: #42be65;
}

.border-green-500 {
  border-color: #42be65;
}

.text-green-700 {
  color: #ccf5d7;
}

.bg-green-700 {
  background-color: #ccf5d7;
}

.border-green-700 {
  border-color: #ccf5d7;
}

.text-green-900 {
  color: #e5faeb;
}

.bg-green-900 {
  background-color: #e5faeb;
}

.border-green-900 {
  border-color: #e5faeb;
}

.text-orange-500 {
  color: #f59e0b;
}

.bg-orange-500 {
  background-color: #f59e0b;
}

.border-orange-500 {
  border-color: #f59e0b;
}

.text-base {
  color: var(--color--base) !important;
}

.bg-base {
  background-color: var(--color--base);
}

.border-base {
  border-color: var(--color--base);
}

.text-accent {
  color: var(--color--accent) !important;
}

.bg-accent {
  background-color: var(--color--accent);
}

.border-accent {
  border-color: var(--color--accent);
}

.text-accent-hover {
  color: var(--color--accent-hover) !important;
}

.bg-accent-hover {
  background-color: var(--color--accent-hover);
}

.border-accent-hover {
  border-color: var(--color--accent-hover);
}

.text-accent-darker {
  color: var(--color--accent-darker) !important;
}

.bg-accent-darker {
  background-color: var(--color--accent-darker);
}

.border-accent-darker {
  border-color: var(--color--accent-darker);
}

.text-primary {
  color: var(--color--primary) !important;
}

.bg-primary {
  background-color: var(--color--primary);
}

.border-primary {
  border-color: var(--color--primary);
}

.text-darkest {
  color: var(--color--darkest) !important;
}

.bg-darkest {
  background-color: var(--color--darkest);
}

.border-darkest {
  border-color: var(--color--darkest);
}

.text-darker {
  color: var(--color--darker) !important;
}

.bg-darker {
  background-color: var(--color--darker);
}

.border-darker {
  border-color: var(--color--darker);
}

.text-dark {
  color: var(--color--dark) !important;
}

.bg-dark {
  background-color: var(--color--dark);
}

.border-dark {
  border-color: var(--color--dark);
}

.text-medium {
  color: var(--color--medium) !important;
}

.bg-medium {
  background-color: var(--color--medium);
}

.border-medium {
  border-color: var(--color--medium);
}

.text-light {
  color: var(--color--light) !important;
}

.bg-light {
  background-color: var(--color--light);
}

.border-light {
  border-color: var(--color--light);
}

.text-error {
  color: var(--color--error) !important;
}

.bg-error {
  background-color: var(--color--error);
}

.border-error {
  border-color: var(--color--error);
}

.text-warning {
  color: var(--color--warning) !important;
}

.bg-warning {
  background-color: var(--color--warning);
}

.border-warning {
  border-color: var(--color--warning);
}

.text-success {
  color: var(--color--success) !important;
}

.bg-success {
  background-color: var(--color--success);
}

.border-success {
  border-color: var(--color--success);
}

.text-info {
  color: var(--color--info) !important;
}

.bg-info {
  background-color: var(--color--info);
}

.border-info {
  border-color: var(--color--info);
}

.text-background-alt {
  color: var(--color--background-alt) !important;
}

.bg-background-alt {
  background-color: var(--color--background-alt);
}

.border-background-alt {
  border-color: var(--color--background-alt);
}

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

.text-s {
  font-size: 0.875rem;
}

.text-m {
  font-size: 1rem;
}

.text-l {
  font-size: 1.125rem;
}

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

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

.text-3xl {
  font-size: 2.25rem;
}

.text-4xl {
  font-size: 3rem;
}

.text-5xl {
  font-size: 4rem;
}

.p-2xl {
  padding: 3rem;
}
@media (min-width: 768px) {
  .p-2xl {
    padding: 4rem;
  }
}

.pt-2xl {
  padding-top: 3rem;
}
@media (min-width: 768px) {
  .pt-2xl {
    padding-top: 4rem;
  }
}

.pr-2xl {
  padding-right: 3rem;
}
@media (min-width: 768px) {
  .pr-2xl {
    padding-right: 4rem;
  }
}

.pb-2xl {
  padding-bottom: 3rem;
}
@media (min-width: 768px) {
  .pb-2xl {
    padding-bottom: 4rem;
  }
}

.pl-2xl {
  padding-left: 3rem;
}
@media (min-width: 768px) {
  .pl-2xl {
    padding-left: 4rem;
  }
}

.p-xl {
  padding: 2.25rem;
}
@media (min-width: 768px) {
  .p-xl {
    padding: 3rem;
  }
}

.pt-xl {
  padding-top: 2.25rem;
}
@media (min-width: 768px) {
  .pt-xl {
    padding-top: 3rem;
  }
}

.pr-xl {
  padding-right: 2.25rem;
}
@media (min-width: 768px) {
  .pr-xl {
    padding-right: 3rem;
  }
}

.pb-xl {
  padding-bottom: 2.25rem;
}
@media (min-width: 768px) {
  .pb-xl {
    padding-bottom: 3rem;
  }
}

.pl-xl {
  padding-left: 2.25rem;
}
@media (min-width: 768px) {
  .pl-xl {
    padding-left: 3rem;
  }
}

.p-lg {
  padding: 1.5rem;
}
@media (min-width: 768px) {
  .p-lg {
    padding: 2.25rem;
  }
}

.pt-lg {
  padding-top: 1.5rem;
}
@media (min-width: 768px) {
  .pt-lg {
    padding-top: 2.25rem;
  }
}

.pr-lg {
  padding-right: 1.5rem;
}
@media (min-width: 768px) {
  .pr-lg {
    padding-right: 2.25rem;
  }
}

.pb-lg {
  padding-bottom: 1.5rem;
}
@media (min-width: 768px) {
  .pb-lg {
    padding-bottom: 2.25rem;
  }
}

.pl-lg {
  padding-left: 1.5rem;
}
@media (min-width: 768px) {
  .pl-lg {
    padding-left: 2.25rem;
  }
}

.p-md {
  padding: 1rem;
}
@media (min-width: 768px) {
  .p-md {
    padding: 1.5rem;
  }
}

.pt-md {
  padding-top: 1rem;
}
@media (min-width: 768px) {
  .pt-md {
    padding-top: 1.5rem;
  }
}

.pr-md {
  padding-right: 1rem;
}
@media (min-width: 768px) {
  .pr-md {
    padding-right: 1.5rem;
  }
}

.pb-md {
  padding-bottom: 1rem;
}
@media (min-width: 768px) {
  .pb-md {
    padding-bottom: 1.5rem;
  }
}

.pl-md {
  padding-left: 1rem;
}
@media (min-width: 768px) {
  .pl-md {
    padding-left: 1.5rem;
  }
}

.p-sm {
  padding: 0.5rem;
}
@media (min-width: 768px) {
  .p-sm {
    padding: 0.75rem;
  }
}

.pt-sm {
  padding-top: 0.5rem;
}
@media (min-width: 768px) {
  .pt-sm {
    padding-top: 0.75rem;
  }
}

.pr-sm {
  padding-right: 0.5rem;
}
@media (min-width: 768px) {
  .pr-sm {
    padding-right: 0.75rem;
  }
}

.pb-sm {
  padding-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .pb-sm {
    padding-bottom: 0.75rem;
  }
}

.pl-sm {
  padding-left: 0.5rem;
}
@media (min-width: 768px) {
  .pl-sm {
    padding-left: 0.75rem;
  }
}

.p-xs {
  padding: 0.25rem;
}
@media (min-width: 768px) {
  .p-xs {
    padding: 0.5rem;
  }
}

.pt-xs {
  padding-top: 0.25rem;
}
@media (min-width: 768px) {
  .pt-xs {
    padding-top: 0.5rem;
  }
}

.pr-xs {
  padding-right: 0.25rem;
}
@media (min-width: 768px) {
  .pr-xs {
    padding-right: 0.5rem;
  }
}

.pb-xs {
  padding-bottom: 0.25rem;
}
@media (min-width: 768px) {
  .pb-xs {
    padding-bottom: 0.5rem;
  }
}

.pl-xs {
  padding-left: 0.25rem;
}
@media (min-width: 768px) {
  .pl-xs {
    padding-left: 0.5rem;
  }
}

.p-none {
  padding: 0;
}
@media (min-width: 768px) {
  .p-none {
    padding: 0;
  }
}

.pt-none {
  padding-top: 0;
}
@media (min-width: 768px) {
  .pt-none {
    padding-top: 0;
  }
}

.pr-none {
  padding-right: 0;
}
@media (min-width: 768px) {
  .pr-none {
    padding-right: 0;
  }
}

.pb-none {
  padding-bottom: 0;
}
@media (min-width: 768px) {
  .pb-none {
    padding-bottom: 0;
  }
}

.pl-none {
  padding-left: 0;
}
@media (min-width: 768px) {
  .pl-none {
    padding-left: 0;
  }
}

.m-2xl {
  margin: 3rem;
}
@media (min-width: 768px) {
  .m-2xl {
    margin: 4rem;
  }
}

.mt-2xl {
  margin-top: 3rem;
}
@media (min-width: 768px) {
  .mt-2xl {
    margin-top: 4rem;
  }
}

.mr-2xl {
  margin-right: 3rem;
}
@media (min-width: 768px) {
  .mr-2xl {
    margin-right: 4rem;
  }
}

.mb-2xl {
  margin-bottom: 3rem;
}
@media (min-width: 768px) {
  .mb-2xl {
    margin-bottom: 4rem;
  }
}

.ml-2xl {
  margin-left: 3rem;
}
@media (min-width: 768px) {
  .ml-2xl {
    margin-left: 4rem;
  }
}

.m-xl {
  margin: 2.25rem;
}
@media (min-width: 768px) {
  .m-xl {
    margin: 3rem;
  }
}

.mt-xl {
  margin-top: 2.25rem;
}
@media (min-width: 768px) {
  .mt-xl {
    margin-top: 3rem;
  }
}

.mr-xl {
  margin-right: 2.25rem;
}
@media (min-width: 768px) {
  .mr-xl {
    margin-right: 3rem;
  }
}

.mb-xl {
  margin-bottom: 2.25rem;
}
@media (min-width: 768px) {
  .mb-xl {
    margin-bottom: 3rem;
  }
}

.ml-xl {
  margin-left: 2.25rem;
}
@media (min-width: 768px) {
  .ml-xl {
    margin-left: 3rem;
  }
}

.m-lg {
  margin: 1.5rem;
}
@media (min-width: 768px) {
  .m-lg {
    margin: 2.25rem;
  }
}

.mt-lg {
  margin-top: 1.5rem;
}
@media (min-width: 768px) {
  .mt-lg {
    margin-top: 2.25rem;
  }
}

.mr-lg {
  margin-right: 1.5rem;
}
@media (min-width: 768px) {
  .mr-lg {
    margin-right: 2.25rem;
  }
}

.mb-lg {
  margin-bottom: 1.5rem;
}
@media (min-width: 768px) {
  .mb-lg {
    margin-bottom: 2.25rem;
  }
}

.ml-lg {
  margin-left: 1.5rem;
}
@media (min-width: 768px) {
  .ml-lg {
    margin-left: 2.25rem;
  }
}

.m-md {
  margin: 1rem;
}
@media (min-width: 768px) {
  .m-md {
    margin: 1.5rem;
  }
}

.mt-md {
  margin-top: 1rem;
}
@media (min-width: 768px) {
  .mt-md {
    margin-top: 1.5rem;
  }
}

.mr-md {
  margin-right: 1rem;
}
@media (min-width: 768px) {
  .mr-md {
    margin-right: 1.5rem;
  }
}

.mb-md {
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .mb-md {
    margin-bottom: 1.5rem;
  }
}

.ml-md {
  margin-left: 1rem;
}
@media (min-width: 768px) {
  .ml-md {
    margin-left: 1.5rem;
  }
}

.m-sm {
  margin: 0.5rem;
}
@media (min-width: 768px) {
  .m-sm {
    margin: 0.75rem;
  }
}

.mt-sm {
  margin-top: 0.5rem;
}
@media (min-width: 768px) {
  .mt-sm {
    margin-top: 0.75rem;
  }
}

.mr-sm {
  margin-right: 0.5rem;
}
@media (min-width: 768px) {
  .mr-sm {
    margin-right: 0.75rem;
  }
}

.mb-sm {
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .mb-sm {
    margin-bottom: 0.75rem;
  }
}

.ml-sm {
  margin-left: 0.5rem;
}
@media (min-width: 768px) {
  .ml-sm {
    margin-left: 0.75rem;
  }
}

.m-xs {
  margin: 0.25rem;
}
@media (min-width: 768px) {
  .m-xs {
    margin: 0.5rem;
  }
}

.mt-xs {
  margin-top: 0.25rem;
}
@media (min-width: 768px) {
  .mt-xs {
    margin-top: 0.5rem;
  }
}

.mr-xs {
  margin-right: 0.25rem;
}
@media (min-width: 768px) {
  .mr-xs {
    margin-right: 0.5rem;
  }
}

.mb-xs {
  margin-bottom: 0.25rem;
}
@media (min-width: 768px) {
  .mb-xs {
    margin-bottom: 0.5rem;
  }
}

.ml-xs {
  margin-left: 0.25rem;
}
@media (min-width: 768px) {
  .ml-xs {
    margin-left: 0.5rem;
  }
}

.m-none {
  margin: 0;
}
@media (min-width: 768px) {
  .m-none {
    margin: 0;
  }
}

.mt-none {
  margin-top: 0;
}
@media (min-width: 768px) {
  .mt-none {
    margin-top: 0;
  }
}

.mr-none {
  margin-right: 0;
}
@media (min-width: 768px) {
  .mr-none {
    margin-right: 0;
  }
}

.mb-none {
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .mb-none {
    margin-bottom: 0;
  }
}

.ml-none {
  margin-left: 0;
}
@media (min-width: 768px) {
  .ml-none {
    margin-left: 0;
  }
}

.gap-2xl {
  gap: 3rem;
}
@media (min-width: 768px) {
  .gap-2xl {
    gap: 4rem;
  }
}

.gapt-2xl {
  gap-top: 3rem;
}
@media (min-width: 768px) {
  .gapt-2xl {
    gap-top: 4rem;
  }
}

.gapr-2xl {
  gap-right: 3rem;
}
@media (min-width: 768px) {
  .gapr-2xl {
    gap-right: 4rem;
  }
}

.gapb-2xl {
  gap-bottom: 3rem;
}
@media (min-width: 768px) {
  .gapb-2xl {
    gap-bottom: 4rem;
  }
}

.gapl-2xl {
  gap-left: 3rem;
}
@media (min-width: 768px) {
  .gapl-2xl {
    gap-left: 4rem;
  }
}

.gap-xl {
  gap: 2.25rem;
}
@media (min-width: 768px) {
  .gap-xl {
    gap: 3rem;
  }
}

.gapt-xl {
  gap-top: 2.25rem;
}
@media (min-width: 768px) {
  .gapt-xl {
    gap-top: 3rem;
  }
}

.gapr-xl {
  gap-right: 2.25rem;
}
@media (min-width: 768px) {
  .gapr-xl {
    gap-right: 3rem;
  }
}

.gapb-xl {
  gap-bottom: 2.25rem;
}
@media (min-width: 768px) {
  .gapb-xl {
    gap-bottom: 3rem;
  }
}

.gapl-xl {
  gap-left: 2.25rem;
}
@media (min-width: 768px) {
  .gapl-xl {
    gap-left: 3rem;
  }
}

.gap-lg {
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .gap-lg {
    gap: 2.25rem;
  }
}

.gapt-lg {
  gap-top: 1.5rem;
}
@media (min-width: 768px) {
  .gapt-lg {
    gap-top: 2.25rem;
  }
}

.gapr-lg {
  gap-right: 1.5rem;
}
@media (min-width: 768px) {
  .gapr-lg {
    gap-right: 2.25rem;
  }
}

.gapb-lg {
  gap-bottom: 1.5rem;
}
@media (min-width: 768px) {
  .gapb-lg {
    gap-bottom: 2.25rem;
  }
}

.gapl-lg {
  gap-left: 1.5rem;
}
@media (min-width: 768px) {
  .gapl-lg {
    gap-left: 2.25rem;
  }
}

.gap-md {
  gap: 1rem;
}
@media (min-width: 768px) {
  .gap-md {
    gap: 1.5rem;
  }
}

.gapt-md {
  gap-top: 1rem;
}
@media (min-width: 768px) {
  .gapt-md {
    gap-top: 1.5rem;
  }
}

.gapr-md {
  gap-right: 1rem;
}
@media (min-width: 768px) {
  .gapr-md {
    gap-right: 1.5rem;
  }
}

.gapb-md {
  gap-bottom: 1rem;
}
@media (min-width: 768px) {
  .gapb-md {
    gap-bottom: 1.5rem;
  }
}

.gapl-md {
  gap-left: 1rem;
}
@media (min-width: 768px) {
  .gapl-md {
    gap-left: 1.5rem;
  }
}

.gap-sm {
  gap: 0.5rem;
}
@media (min-width: 768px) {
  .gap-sm {
    gap: 0.75rem;
  }
}

.gapt-sm {
  gap-top: 0.5rem;
}
@media (min-width: 768px) {
  .gapt-sm {
    gap-top: 0.75rem;
  }
}

.gapr-sm {
  gap-right: 0.5rem;
}
@media (min-width: 768px) {
  .gapr-sm {
    gap-right: 0.75rem;
  }
}

.gapb-sm {
  gap-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .gapb-sm {
    gap-bottom: 0.75rem;
  }
}

.gapl-sm {
  gap-left: 0.5rem;
}
@media (min-width: 768px) {
  .gapl-sm {
    gap-left: 0.75rem;
  }
}

.gap-xs {
  gap: 0.25rem;
}
@media (min-width: 768px) {
  .gap-xs {
    gap: 0.5rem;
  }
}

.gapt-xs {
  gap-top: 0.25rem;
}
@media (min-width: 768px) {
  .gapt-xs {
    gap-top: 0.5rem;
  }
}

.gapr-xs {
  gap-right: 0.25rem;
}
@media (min-width: 768px) {
  .gapr-xs {
    gap-right: 0.5rem;
  }
}

.gapb-xs {
  gap-bottom: 0.25rem;
}
@media (min-width: 768px) {
  .gapb-xs {
    gap-bottom: 0.5rem;
  }
}

.gapl-xs {
  gap-left: 0.25rem;
}
@media (min-width: 768px) {
  .gapl-xs {
    gap-left: 0.5rem;
  }
}

.gap-none {
  gap: 0;
}
@media (min-width: 768px) {
  .gap-none {
    gap: 0;
  }
}

.gapt-none {
  gap-top: 0;
}
@media (min-width: 768px) {
  .gapt-none {
    gap-top: 0;
  }
}

.gapr-none {
  gap-right: 0;
}
@media (min-width: 768px) {
  .gapr-none {
    gap-right: 0;
  }
}

.gapb-none {
  gap-bottom: 0;
}
@media (min-width: 768px) {
  .gapb-none {
    gap-bottom: 0;
  }
}

.gapl-none {
  gap-left: 0;
}
@media (min-width: 768px) {
  .gapl-none {
    gap-left: 0;
  }
}

.rounded-full {
  border-radius: 50%;
}

.visually-hidden:not(:focus):not(:active) {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

html :where(.has-border-color) {
  border-style: solid;
}

html :where([style*=border-top-color]) {
  border-top-style: solid;
}

html :where([style*=border-right-color]) {
  border-right-style: solid;
}

html :where([style*=border-bottom-color]) {
  border-bottom-style: solid;
}

html :where([style*=border-left-color]) {
  border-left-style: solid;
}

html :where([style*=border-width]) {
  border-style: solid;
}

html :where([style*=border-top-width]) {
  border-top-style: solid;
}

html :where([style*=border-right-width]) {
  border-right-style: solid;
}

html :where([style*=border-bottom-width]) {
  border-bottom-style: solid;
}

html :where([style*=border-left-width]) {
  border-left-style: solid;
}

.schema-faq-section {
  margin-bottom: 0;
  border-bottom: 1px solid var(--color--neutral-600);
}

.schema-faq-question {
  cursor: pointer;
  padding: 15px 0;
  font-weight: bold;
  font-size: 1.2em;
  color: inherit;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
.schema-faq-question::after {
  content: "▼";
  color: var(--color--accent);
  font-size: 12px;
  transition: transform 0.3s ease;
}

.schema-faq-question.active::after {
  transform: rotate(180deg);
}

.schema-faq-answer {
  max-height: 0;
  overflow: hidden;
  margin: 0;
  padding: 0;
  font-size: 1em;
  color: inherit;
  transition: max-height 0.3s ease, padding 0.3s ease;
}

.schema-faq-answer.active {
  max-height: 100%;
  padding: 0 0 15px 0;
}

.newsletter-form form {
  margin-bottom: 11px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 20px;
}
.newsletter-form form .wpforms-field {
  padding: 0;
}
.newsletter-form .wpforms-field-container {
  max-width: 300px;
  width: 100%;
  margin-right: 20px;
}
.newsletter-form .email-address {
  width: 180%;
}
.newsletter-form .email-address input {
  max-width: 320px;
  width: 200%;
}
.newsletter-form div.wpforms-container-full button[type=submit] {
  margin-right: 0;
}
.newsletter-form .wpforms-submit-container {
  margin-top: 0 !important;
}

.woocommerce div.product form.cart div.quantity .qty {
  width: 80px;
}
.woocommerce div.product p.stock {
  font-size: 1rem;
}
.woocommerce span.onsale {
  background: var(--color--accent) !important;
}

.woocommerce-product-gallery .flex-viewport {
  margin-bottom: 10px;
}
.woocommerce-product-gallery ol {
  display: flex;
  gap: 10px;
  flex-wrap: nowrap;
}

square-placement {
  text-align: center;
}

.wp-block-woocommerce-product-meta + .posted_in {
  display: none;
}

.wp-element-button.single_add_to_cart_button {
  background: var(--color--accent);
  border-radius: var(--radius--button, 4px);
  font-weight: bold;
  transition: background-color 300ms;
  cursor: pointer;
}
.wp-element-button.single_add_to_cart_button:hover {
  background: var(--color--accent-hover);
}

.mpos-avail-test {
  text-align: left !important;
}

.wp-block-woocommerce-cart-cross-sells-block > div {
  display: flex;
}

.mobile-columns {
  display: flex;
}

.is-product-collection-layout-carousel {
  padding-bottom: 12px;
}

.woocommerce table.variations tr td select {
  padding: 4px 3em 4px 1.4em;
}

.price-tax-both {
  display: flex;
  flex-direction: column;
  gap: 0.1em;
}
.price-tax-both__inc {
  font-weight: 600;
}
.price-tax-both__ex {
  font-size: 0.85em;
  opacity: 0.75;
}
.price-tax-both__label {
  font-weight: 400;
}

/**
 * Self-hosted web fonts.
 *
 * To self-host Google Fonts, use https://google-webfonts-helper.herokuapp.com/fonts
 * To subset Fonts, use https://transfonter.org/
 */
@font-face {
  font-display: optional;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 600;
  src: url("../../assets/font/Inter-VariableFont_opszwght.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 300 700;
  src: url("../../assets/font/SpaceGrotesk-VariableFont_wght.woff2") format("woff2");
}
/**
* Elements that could interact with the block editor.
*/
/**
 * Utility
 * Single class, single job.
 */
/*
 * Text alignment standard editor classes
 * Used by Align toolbar component.
 */
.has-text-align-center {
  text-align: center;
}

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

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

/*
 * Flex alignment standard editor classes
 * Used by Change Items Justification toolbar component.
 * Compatible with the .flex utility.
 */
.is-content-justification-left {
  justify-content: flex-start;
}
.is-content-justification-left.is-vertical {
  align-items: flex-start;
  justify-content: inherit;
}

.is-content-justification-center {
  justify-content: center;
}
.is-content-justification-center.is-vertical {
  align-items: center;
  justify-content: inherit;
}

.is-content-justification-right {
  justify-content: flex-end;
}
.is-content-justification-right.is-vertical {
  align-items: flex-end;
  justify-content: inherit;
}

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

/*
 * Vertical Alignment standard editor classes
 * Used by Change Vertical Alignment toolbar component
 * Compatible with the .grid utility.
 */
.are-vertically-aligned-top {
  align-items: self-start;
}

.are-vertically-aligned-center {
  align-items: center;
}

.are-vertically-aligned-bottom {
  align-items: self-end;
}

/**
 * Layout with CSS grid.
 * Use on templates without a sidebar.
 * Adds support for wide & full alignment elements.
 *
 * https://xwp.atlassian.net/wiki/spaces/KB/pages/2751496193/Layout#Full-bleed-layout
 * https://ryanmulligan.dev/blog/layout-breakouts/
 *
 * <div class="block-container">
 * 	<div class="alignwide">alignwide</div>
 *	<div class="alignfull">alignfull</div>
 * </div><!-- .block-container -->
 */
.block-container {
  --gap: var(--layout--grid--gutter);
  --block-container--gap: var(--layout--block-gap);
  --alignfull: 1fr;
  --alignwide-width: calc((var(--layout--wide-size) - var(--layout--content-size)) / 2);
  --alignwide: minmax(0, var(--alignwide-width));
  --content: min(var(--layout--content-size), 100%);
  display: grid;
  grid-template-columns: [alignfull-start] var(--alignfull) [alignwide-start] var(--alignwide) [content-start] var(--content) [content-end] var(--alignwide) [alignwide-end] var(--alignfull) [alignfull-end];
}

.block-container > * {
  grid-column: content;
  margin-block-start: 0;
}

.block-container > .alignwide {
  grid-column: alignwide;
}

.block-container > .alignfull {
  grid-column: alignfull;
}

.block-container > .alignleft {
  margin-inline: auto;
}
@media (min-width: 960px) {
  .block-container > .alignleft {
    grid-column: alignfull;
    margin-inline-start: var(--block-container--gap);
    justify-self: start;
  }
}

.block-container > .alignright {
  margin-inline: auto;
}
@media (min-width: 960px) {
  .block-container > .alignright {
    grid-column: alignfull;
    margin-inline-end: var(--block-container--gap);
    justify-self: end;
  }
}

.block-container > .aligncenter {
  margin-inline: auto;
}

/*
 * :where lowers the specificity of the wrapped selectors to 0.
 * https://developer.mozilla.org/en-US/docs/Web/CSS/:where
*/
.block-container > *:where(div, article, form, section) {
  margin-block-end: var(--block-container--gap);
}

.block-container > *:last-child:not(:first-child) {
  margin-block-end: var(--block-container--gap);
}

/**
 * Common container.
 * Centers the content, and sets the content width.
 */
.container {
  --gap: var(--f-spacing--container-gap);
  --width: calc(var(--layout--content-size) + 2 * var(--gap));
  inline-size: var(--width);
  max-inline-size: 100%;
  padding-inline: var(--gap);
  margin-inline: auto;
  background-color: var(--color--neutral-white);
}
@media (max-width: 1385px) {
  .container {
    margin-inline: var(--layout--wallpaper--gutter);
    inline-size: auto;
  }
}

.container-has-sidebar {
  display: flex;
  flex-flow: column;
  gap: var(--layout--grid--gutter);
}
@media (min-width: 960px) {
  .container-has-sidebar {
    flex-flow: row;
    gap: var(--f-spacing--s);
    justify-content: space-between;
  }
}
.container-has-sidebar.has-divider::after {
  content: "";
  display: block;
  border-inline-end: 1px solid var(--color--medium);
  order: 2;
}
.container-has-sidebar .is-sidebar {
  order: 3;
}
@media (min-width: 960px) {
  .container-has-sidebar .is-sidebar {
    width: 20rem;
    max-width: 20rem;
  }
}

html::after {
  display: none;
  content: "mobile";
}
@media (min-width: 768px) {
  html::after {
    content: "tablet";
  }
}
@media (min-width: 960px) {
  html::after {
    content: "desktop";
  }
}
@media (min-width: 1280px) {
  html::after {
    content: "desktop-large";
  }
}

/*
 * Flex layout
 *
 * Override gap in specific contexts, or via helper classes.
 * .flex--small {
 *   --gap: var(--spacing--small);
 * }
 */
.flex {
  display: flex;
  gap: var(--flex-gap, var(--layout--block-gap));
}
.flex.is-vertical {
  flex-direction: column;
}

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

/**
 * Grid layout
 *
 * More about the common use cases of CSS Grid minmax():
 * https://ishadeed.com/article/css-grid-minmax/
 *
 * Add the class grid to a HTML element
 * <section class="grid">…</section>
 * <section class="grid grid--articles">…</section>
 *
 * Override gap in specific contexts, or via helper classes.
 * .grid--small {
 *   --grid-gap: var(--spacing--small);
 * }
 * .grid--articles {
 *   --grid-min: 21.875rem;
 * }
 * .grid--one-third-two-thirds {
 *   --template-columns: 33.33% 1fr;
 * }
 */
.grid {
  display: grid;
  grid-gap: var(--grid-gap, var(--layout--block-gap));
  grid-template-columns: var(--template-columns, repeat(auto-fit, minmax(var(--grid-min, 15.625rem), 1fr)));
}

@media (max-width: 959px) {
  .hide-mobile {
    display: none !important;
  }
}
@media (min-width: 960px) {
  .hide-desktop {
    display: none !important;
  }
}
.hide {
  display: none !important;
}

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.skip-link:focus {
  background-color: #eee;
  clip: auto !important;
  clip-path: none;
  color: var(--color--foreground);
  display: block;
  font-size: var(--font-size--normal);
  height: auto;
  inset-inline-start: 5px;
  inset-block-start: 5px;
  line-height: normal;
  padding: var(--spacing--sm);
  text-decoration-line: none;
  width: auto;
  z-index: 100000;
}

/*
 * Common spacing.
 */
/*
 * SPACING INSET
 * Padding for text insets and card components.
 * Visualised in blocks divisible by 4.
 */
/*
 * Squished INSET
 * Padding for buttons, text insets, notifications and such.
 * Visualised in blocks divisible by 4.
 */
/**
 * Stack layout
 *
 * More about the common usecases:
 * https://every-layout.dev/layouts/stack/
 *
 * Override gap in specific contexts, or via helper classes.
 * .stack--small {
 *   --stack-gap: var(--spacing--small);
 * }
 */
.stack {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.stack > * {
  margin-block: 0;
}

.stack > * + * {
  margin-block-start: var(--stack-gap, var(--layout--block-gap));
}

/**
 * Components — global element & block styles
 * Migrated from theme.json styles section.
 */
.wp-element-button,
.wp-block-button__link {
  background-color: var(--wp--preset--color--accent-1);
  color: var(--wp--preset--color--base);
  padding: 1rem 2.25rem;
  font-size: var(--wp--preset--font-size--medium);
  border-radius: var(--radius--button, 4px);
}
.wp-element-button:hover,
.wp-block-button__link:hover {
  background-color: var(--wp--preset--color--accent-5);
  color: var(--wp--preset--color--base);
  border-color: transparent;
}
.wp-element-button:focus,
.wp-block-button__link:focus {
  outline-color: var(--wp--preset--color--accent-1);
  outline-offset: 2px;
}

.wp-block-button.is-style-outline .wp-block-button__link {
  border-color: currentColor;
  border-width: 1px;
  padding: calc(1rem - 1px) calc(2.25rem - 1px);
}
.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):hover {
  background-color: color-mix(in srgb, var(--wp--preset--color--contrast) 5%, transparent);
}

.wp-block-buttons {
  gap: 16px;
}

a:where(:not(.wp-element-button)) {
  color: currentColor;
}
a:where(:not(.wp-element-button)):hover {
  text-decoration: none;
}

.wp-element-caption,
.wp-block-audio figcaption,
.wp-block-embed figcaption,
.wp-block-gallery figcaption,
.wp-block-image figcaption,
.wp-block-table figcaption,
.wp-block-video figcaption {
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.4;
}

.wp-block-columns {
  gap: var(--wp--preset--spacing--50);
}

.wp-block-list {
  margin-left: 1.2rem;
}
.wp-block-list li {
  margin-top: 0.5rem;
}

.wp-block-navigation {
  font-size: var(--wp--preset--font-size--medium);
}
.wp-block-navigation a:where(:not(.wp-element-button)) {
  text-decoration: none;
}
.wp-block-navigation a:where(:not(.wp-element-button)):hover {
  text-decoration: underline;
}

.wp-block-post-date {
  color: var(--wp--preset--color--accent-4);
  font-size: var(--wp--preset--font-size--small);
}
.wp-block-post-date a:where(:not(.wp-element-button)) {
  color: var(--wp--preset--color--accent-4);
  text-decoration: none;
}
.wp-block-post-date a:where(:not(.wp-element-button)):hover {
  text-decoration: underline;
}

.wp-block-post-navigation-link {
  font-size: var(--wp--preset--font-size--medium);
}

.wp-block-post-terms {
  font-size: var(--wp--preset--font-size--small);
  font-weight: 600;
}
.wp-block-post-terms a {
  white-space: nowrap;
}

.wp-block-post-title a:where(:not(.wp-element-button)) {
  text-decoration: none;
}
.wp-block-post-title a:where(:not(.wp-element-button)):hover {
  text-decoration: underline;
}

.wp-block-query-pagination {
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
}

.wp-block-search {
  font-size: var(--wp--preset--font-size--medium);
  line-height: 1.6;
}
.wp-block-search .wp-block-search__input {
  border-radius: 3.125rem;
  padding-left: 1.5625rem;
  padding-right: 1.5625rem;
  border-color: var(--wp--preset--color--accent-6);
}
.wp-block-search .wp-element-button,
.wp-block-search .wp-block-search__button {
  border-radius: 3.125rem;
  margin-left: 1.125rem;
}
.wp-block-search .wp-element-button:hover,
.wp-block-search .wp-block-search__button:hover {
  border-color: transparent;
}

.wp-block-separator {
  border-color: currentColor;
  border-style: solid;
  border-width: 0 0 1px 0;
  color: var(--wp--preset--color--accent-6);
}
.wp-block-separator.is-style-wide:not(.alignfull) {
  max-width: var(--wp--style--global--wide-size) !important;
}

.wp-block-site-tagline {
  font-size: var(--wp--preset--font-size--medium);
}

.wp-block-site-title {
  font-weight: 700;
  letter-spacing: -0.5px;
}
.wp-block-site-title a:where(:not(.wp-element-button)) {
  text-decoration: none;
}
.wp-block-site-title a:where(:not(.wp-element-button)):hover {
  text-decoration: underline;
}

.wp-block-term-description {
  font-size: var(--wp--preset--font-size--medium);
}

/**
* Components — frontend only
*/
.wp-block-site-logo {
  box-sizing: border-box;
  line-height: 0;
}
.wp-block-site-logo a {
  display: inline-block;
  line-height: 0;
}
.wp-block-site-logo img {
  height: auto;
  max-width: 100%;
}
.wp-block-site-logo a,
.wp-block-site-logo img {
  border-radius: inherit;
}

.wp-block-navigation .wp-block-navigation-item__label {
  overflow-wrap: break-word;
}
.wp-block-navigation .wp-block-navigation__submenu-container.has-background {
  padding: 0;
}

.tw-icon-large button:where(.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open) svg,
.tw-icon-medium button:where(.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open) svg {
  width: 32px;
  height: 32px;
}

.wp-block-navigation.tw-icon-large button:is(.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close) {
  font-size: 1.5rem;
}

@media (min-width: 600px) and (max-width: 767px) {
  .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex;
  }
  .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: none;
  }
}
@media (min-width: 1024px) {
  .tw-icon-large button:where(.wp-block-navigation__responsive-container-close,
  .wp-block-navigation__responsive-container-open) svg {
    width: 40px;
    height: 40px;
  }
}
:root :where(.wp-block-search .wp-block-search__input) {
  border-radius: 3.125rem;
  padding-left: 1.5625rem;
  padding-right: 1.5625rem;
  border-color: var(--wp--preset--color--accent-6);
}

:root :where(.wp-block-search .wp-element-button, .wp-block-search .wp-block-button__link) {
  border-radius: 3.125rem;
  margin-left: 1.125rem;
}

.category-navbar {
  overflow: hidden;
}
.category-navbar .wp-block-navigation__container {
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.category-navbar .wp-block-navigation__container::-webkit-scrollbar {
  display: none;
}
.category-navbar .wp-block-navigation-item__label {
  white-space: nowrap;
}

@media (width < 768px) {
  .tw-sm-hidden {
    display: none !important;
  }
}
@media (width >= 768px) and (width < 1024px) {
  .tw-md-hidden {
    display: none !important;
  }
}
@media (width >= 1024px) {
  .tw-lg-hidden {
    display: none !important;
  }
}
/**
 * Blocks.
 */
.wp-block-mavero-button.is-style-destructive .wp-block-mavero-button__link,
.wp-block-button.is-style-destructive .wp-block-button__link, .wp-block-mavero-button.is-style-ghost .wp-block-mavero-button__link,
.wp-block-button.is-style-ghost .wp-block-button__link, .wp-block-mavero-button.is-style-tertiary .wp-block-mavero-button__link,
.wp-block-button.is-style-tertiary .wp-block-button__link, .wp-block-mavero-button.is-style-secondary .wp-block-mavero-button__link,
.wp-block-button.is-style-secondary .wp-block-button__link, .wp-block-mavero-button.is-style-primary .wp-block-mavero-button__link,
.wp-block-button.is-style-primary .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  font-family: var(--wp--preset--font-family--body, "Inter", sans-serif);
  font-weight: 500;
  line-height: 1.5;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.wp-block-mavero-button.is-style-destructive .wp-block-mavero-button__link:active,
.wp-block-button.is-style-destructive .wp-block-button__link:active, .wp-block-mavero-button.is-style-ghost .wp-block-mavero-button__link:active,
.wp-block-button.is-style-ghost .wp-block-button__link:active, .wp-block-mavero-button.is-style-tertiary .wp-block-mavero-button__link:active,
.wp-block-button.is-style-tertiary .wp-block-button__link:active, .wp-block-mavero-button.is-style-secondary .wp-block-mavero-button__link:active,
.wp-block-button.is-style-secondary .wp-block-button__link:active, .wp-block-mavero-button.is-style-primary .wp-block-mavero-button__link:active,
.wp-block-button.is-style-primary .wp-block-button__link:active {
  transform: scale(0.98);
}

.wp-block-mavero-button.is-size-xs .wp-block-mavero-button__link,
.wp-block-button.is-size-xs .wp-block-button__link {
  padding: 6px 12px;
  font-size: 0.75rem;
}

.wp-block-mavero-button.is-size-s .wp-block-mavero-button__link,
.wp-block-button.is-size-s .wp-block-button__link {
  padding: 8px 16px;
  font-size: 0.875rem;
}

.wp-block-mavero-button.is-size-m .wp-block-mavero-button__link,
.wp-block-button.is-size-m .wp-block-button__link {
  padding: 12px 24px;
  font-size: 1rem;
}

.wp-block-mavero-button.is-size-l .wp-block-mavero-button__link,
.wp-block-button.is-size-l .wp-block-button__link {
  padding: 16px 32px;
  font-size: 1.125rem;
}

@media (width < 768px) {
  .wp-block-mavero-button.has-full-width-on-mobile {
    width: 100%;
  }
  .wp-block-mavero-button.has-full-width-on-mobile .wp-block-mavero-button__link {
    width: 100%;
    justify-content: center;
  }
}
.wp-block-mavero-button.is-style-primary .wp-block-mavero-button__link,
.wp-block-button.is-style-primary .wp-block-button__link {
  background-color: var(--wp--preset--color--accent-1);
  color: var(--wp--preset--color--base);
  border: none;
  border-radius: var(--radius--button, 4px);
  padding: 12px 24px;
}
.wp-block-mavero-button.is-style-primary .wp-block-mavero-button__link:hover, .wp-block-mavero-button.is-style-primary .wp-block-mavero-button__link:focus-visible,
.wp-block-button.is-style-primary .wp-block-button__link:hover,
.wp-block-button.is-style-primary .wp-block-button__link:focus-visible {
  background-color: var(--wp--preset--color--accent-5);
  color: var(--wp--preset--color--base);
}

.wp-block-mavero-button.is-style-secondary .wp-block-mavero-button__link,
.wp-block-button.is-style-secondary .wp-block-button__link {
  background-color: var(--wp--preset--color--base);
  color: var(--wp--preset--color--contrast);
  border: 1px solid var(--color--neutral-500);
  border-radius: var(--radius--button, 4px);
  padding: 12px 24px;
}
.wp-block-mavero-button.is-style-secondary .wp-block-mavero-button__link:hover, .wp-block-mavero-button.is-style-secondary .wp-block-mavero-button__link:focus-visible,
.wp-block-button.is-style-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-secondary .wp-block-button__link:focus-visible {
  background-color: var(--color--neutral-700);
  color: var(--wp--preset--color--contrast);
  border-color: var(--wp--preset--color--contrast);
}

.wp-block-mavero-button.is-style-tertiary .wp-block-mavero-button__link,
.wp-block-button.is-style-tertiary .wp-block-button__link {
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
  border: none;
  border-radius: var(--radius--button, 4px);
  padding: 12px 24px;
}
.wp-block-mavero-button.is-style-tertiary .wp-block-mavero-button__link:hover, .wp-block-mavero-button.is-style-tertiary .wp-block-mavero-button__link:focus-visible,
.wp-block-button.is-style-tertiary .wp-block-button__link:hover,
.wp-block-button.is-style-tertiary .wp-block-button__link:focus-visible {
  background-color: var(--color--neutral-200);
  color: var(--wp--preset--color--base);
}

.wp-block-mavero-button.is-style-ghost .wp-block-mavero-button__link,
.wp-block-button.is-style-ghost .wp-block-button__link {
  background-color: transparent;
  color: var(--wp--preset--color--contrast);
  border: 1px solid var(--wp--preset--color--contrast);
  border-radius: var(--radius--button, 4px);
  padding: 12px 24px;
}
.wp-block-mavero-button.is-style-ghost .wp-block-mavero-button__link:hover, .wp-block-mavero-button.is-style-ghost .wp-block-mavero-button__link:focus-visible,
.wp-block-button.is-style-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-ghost .wp-block-button__link:focus-visible {
  background-color: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
}

.wp-block-mavero-button.is-style-destructive .wp-block-mavero-button__link,
.wp-block-button.is-style-destructive .wp-block-button__link {
  background-color: transparent;
  color: var(--color--red-500);
  border: 2px solid var(--color--red-500);
  border-radius: var(--radius--button, 4px);
  padding: 12px 24px;
}
.wp-block-mavero-button.is-style-destructive .wp-block-mavero-button__link:hover, .wp-block-mavero-button.is-style-destructive .wp-block-mavero-button__link:focus-visible,
.wp-block-button.is-style-destructive .wp-block-button__link:hover,
.wp-block-button.is-style-destructive .wp-block-button__link:focus-visible {
  background-color: var(--color--red-500);
  color: var(--wp--preset--color--base);
}

.wp-block-list.is-style-numbered {
  --list-number-size: 2rem;
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
.wp-block-list.is-style-numbered > li {
  position: relative;
  margin-top: 1.5rem;
  padding-left: calc(var(--list-number-size) * 2);
  font-family: var(--wp--preset--font-family--body);
}
.wp-block-list.is-style-numbered > li::before {
  content: counter(list-item, decimal-leading-zero);
  position: absolute;
  top: 0;
  left: 0;
  font-family: var(--wp--preset--font-family--display);
  font-size: var(--list-number-size);
  font-weight: 500;
  line-height: 1.1;
  color: var(--wp--preset--color--accent-1);
  font-variant-numeric: tabular-nums;
}
.wp-block-list.is-style-numbered > li:first-child {
  margin-top: 0;
}

@media (width < 768px) {
  .wp-block-list.is-style-numbered {
    --list-number-size: 1.5rem;
  }
}
/**
* Layouts
*/

/*# sourceMappingURL=style.css.map*/