/** Shopify CDN: Minification failed

Line 436:23 Expected identifier but found whitespace
Line 436:25 Unexpected "{"
Line 436:37 Expected ":"
Line 436:42 Expected ":"
Line 437:23 Expected identifier but found whitespace
Line 437:25 Unexpected "{"
Line 437:37 Expected ":"
Line 437:42 Expected ":"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:custom-section (INDEX:10) */
.custom-section {
    position: relative;
    overflow: hidden;
    width: 100%;
  }
  .custom-section__background {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
  }
  .custom-section__background img {
    position: absolute;
    width: 100%;
    height: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .custom-section__content {
    display: grid;
    grid-template-columns: var(--content-grid);
  }
  .custom-section__content > * {
    grid-column: 2;
  }
/* END_SECTION:custom-section */

/* START_SECTION:header (INDEX:12) */
/*
   ============================================================
   HEADERLESS LAYOUT ARCHITECTURE & FLOATING HUD SYSTEM
   ============================================================
*/

  /* Zero Section Container Height */#shopify-section-header,
  .shopify-section-header,
  .shopify-section-group-header-group {
    position: static !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    overflow: visible !important;
    pointer-events: none !important;
    z-index: 9999 !important;
  }

  #shopify-section-header *,
  .shopify-section-header *,
  .shopify-section-group-header-group * {
    pointer-events: auto;
  }

  body {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .p5r-hud-root {
    font-family: 'Inter'
    , system-ui
    , -apple-system
    , sans-serif;
    -webkit-font-smoothing: antialiased;
  }

  /* ─── 1. FLOATING MENU HUD WRAPPER (BOTTOM LEFT) ───────────────────── */
  .p5r-hud-menu-wrap {
    position: fixed;
    z-index: 9999;
    pointer-events: auto;
    will-change: transform;
  }

  .p5r-hud-menu-wrap--bottom-left {
    bottom: calc(var(--hud-menu-off-y, 6px) + env(safe-area-inset-bottom, 0px)) !important;
    left: calc(var(--hud-menu-off-x, 12px) + env(safe-area-inset-left, 0px)) !important;
    top: auto !important;
    right: auto !important;
  }
  .p5r-hud-menu-wrap--bottom-right {
    bottom: calc(var(--hud-menu-off-y, 10px) + env(safe-area-inset-bottom, 0px)) !important;
    right: calc(var(--hud-menu-off-x, 10px) + env(safe-area-inset-right, 0px)) !important;
    top: auto !important;
    left: auto !important;
  }
  .p5r-hud-menu-wrap--top-left {
    top: calc(var(--hud-menu-off-y, 10px) + env(safe-area-inset-top, 0px)) !important;
    left: calc(var(--hud-menu-off-x, 10px) + env(safe-area-inset-left, 0px)) !important;
    bottom: auto !important;
    right: auto !important;
  }
  .p5r-hud-menu-wrap--top-right {
    top: calc(var(--hud-menu-off-y, 10px) + env(safe-area-inset-top, 0px)) !important;
    right: calc(var(--hud-menu-off-x, 10px) + env(safe-area-inset-right, 0px)) !important;
    bottom: auto !important;
    right: auto !important;
  }

  /* ─── FLOATING P5R BACK BUTTON (BOTTOM-RIGHT ON NON-HOME / NON-COLLECTION) ─ */
  .p5r-hud-back-wrap {
    position: fixed;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    right: calc(16px + env(safe-area-inset-right, 0px));
    z-index: 9999;
    pointer-events: auto;
  }

  .p5r-hud-back-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    width: auto;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    filter: drop-shadow(-4px 4px 0px #000000);
    transform: translate3d(0, 0, 0) rotate(0deg);
    transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1)
    , filter 0.2s ease;
    will-change: transform
    , filter;
  }

  .p5r-hud-back-btn:hover,
  .p5r-hud-back-btn:focus-visible {
    transform: scale(1.08) translate3d(-5px, -2px, 0) rotate(-2.5deg);
    filter: drop-shadow(-6px 6px 0px #000000);
    outline: none;
  }

  .p5r-hud-back-btn:active {
    transform: scale(0.95) translate3d(0, 1px, 0) rotate(0deg);
    filter: drop-shadow(-2px 2px 0px #000000);
  }

  .p5r-hud-back-icon {
    display: block;
    height: 100%;
    width: auto;
  }

  .p5r-hud-back-icon svg {
    height: 100%;
    width: auto;
    display: block;
  }

  @media (max-width: 768px) {
    .p5r-hud-back-wrap {
      bottom: calc(10px + env(safe-area-inset-bottom, 0px));
      right: calc(10px + env(safe-area-inset-right, 0px));
    }
    .p5r-hud-back-btn {
      height: 38px;
    }
  }

  /* ─── FLOATING P5R CART BUTTON (SAME STYLING AS BACK BUTTON) ────── */
  .p5r-hud-cart-svg-btn,
  .p5r-hud-menu-svg-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    width: auto;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer;
    filter: drop-shadow(-3px 3px 0px #000000) !important;
    transform: translate3d(0, 0, 0) rotate(0deg) !important;
    transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1)
    , filter 0.2s ease !important;
    will-change: transform
    , filter;
    text-decoration: none;
  }

  .p5r-hud-cart-svg-btn,
  .p5r-hud-menu-svg-btn {
    width: auto;
  }

  /* Cart Button specific base & hover (moves Down-Left) */
  .p5r-hud-cart-svg-btn {
    filter: drop-shadow(-3px 3px 0px #000000) !important;
  }
  .p5r-hud-cart-svg-btn:hover,
  .p5r-hud-cart-svg-btn:focus-visible {
    transform: scale(1.08) translate3d(-5px, 2px, 0) rotate(-2.5deg) !important;
    filter: drop-shadow(-6px 6px 0px #000000) !important;
    outline: none !important;
  }

  /* Menu Button specific base & hover (moves Up-Right) */
  .p5r-hud-menu-svg-btn {
    filter: drop-shadow(3px 3px 0px #000000) !important;
  }
  .p5r-hud-menu-svg-btn:hover,
  .p5r-hud-menu-svg-btn:focus-visible {
    transform: scale(1.08) translate3d(5px, 2px, 0) rotate(2.5deg) !important;
    filter: drop-shadow(6px 6px 0px #000000) !important;
    outline: none !important;
  }

  .p5r-hud-cart-svg-btn:active {
    transform: scale(0.95) translate3d(0, 1px, 0) rotate(0deg);
    filter: drop-shadow(-2px 2px 0px #000000) !important;
  }

  .p5r-hud-menu-svg-btn:active {
    transform: scale(0.95) translate3d(0, 1px, 0) rotate(0deg);
    filter: drop-shadow(2px 2px 0px #000000) !important;
  }

  .p5r-hud-cart-icon-wrap {
    display: block;
    height: 100%;
    width: auto;
  }

  .p5r-hud-cart-icon-wrap svg {
    height: 100%;
    width: auto;
    display: block;
  }

  @media (max-width: 768px) {
    .p5r-hud-cart-svg-btn,
    .p5r-hud-menu-svg-btn {
      height: 42px; /* Set both to exactly the same size on mobile */
    }
  }

  /* ─── 2. FLOATING CART HUD WRAPPER (TOP RIGHT) ─────────────────────── */
  .p5r-hud-cart-wrap {
    position: fixed;
    z-index: 9999;
    pointer-events: auto;
    will-change: transform;
  }

  .p5r-hud-cart-wrap--top-right {
    top: calc(var(--hud-cart-off-y, 10px) + env(safe-area-inset-top, 0px)) !important;
    right: calc(var(--hud-cart-off-x, 10px) + env(safe-area-inset-right, 0px)) !important;
    bottom: auto !important;
    left: auto !important;
  }
  .p5r-hud-cart-wrap--top-left {
    top: calc(var(--hud-cart-off-y, 10px) + env(safe-area-inset-top, 0px)) !important;
    left: calc(var(--hud-cart-off-x, 10px) + env(safe-area-inset-left, 0px)) !important;
    bottom: auto !important;
    right: auto !important;
  }
  .p5r-hud-cart-wrap--bottom-right {
    bottom: calc(var(--hud-cart-off-y, 10px) + env(safe-area-inset-bottom, 0px)) !important;
    right: calc(var(--hud-cart-off-x, 10px) + env(safe-area-inset-right, 0px)) !important;
    top: auto !important;
    left: auto !important;
  }
  .p5r-hud-cart-wrap--bottom-left {
    bottom: calc(var(--hud-cart-off-y, 16px) + env(safe-area-inset-bottom, 0px)) !important;
    left: calc(var(--hud-cart-off-x, 16px) + env(safe-area-inset-left, 0px)) !important;
    top: auto !important;
    right: auto !important;
  }

  .p5r-hud-cart-pod {
    display: inline-flex;
    align-items: center;
    padding: 0;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: none !important;
    border-radius: 0;
    box-shadow: none !important;
    transform: translate3d(0, 0, 0);
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1)
    , filter 0.25s ease;
    will-change: transform;
  }

  .p5r-hud-cart-pod:hover {
    transform: scale(1.08) translate3d(0, -2px, 0);
    border-color: transparent !important;
    box-shadow: none !important;
  }

  .p5r-hud-util-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    color: #FFFFFF;
    text-decoration: none;
    padding: 0.2rem 0.4rem;
    border: none;
    background: transparent;
    cursor: pointer;
    outline: none !important;
    box-shadow: none !important;
    transition: color 0.2s ease
    , transform 0.2s ease
    , filter 0.2s ease;
  }

  .p5r-hud-util-btn:focus,
  .p5r-hud-util-btn:focus-visible,
  .p5r-hud-cart-pod:focus,
  .p5r-hud-cart-pod:focus-visible {
    outline: none !important;
  }

  .p5r-hud-cart-text {
    font-family: 'Bebas Neue'
    , 'Anton'
    , impact
    , sans-serif;
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #FFFFFF;
    line-height: 1;
    margin-right: 0.5rem;
    text-shadow: 2px 2px 0 #000000;
    transition: color 0.2s ease;
  }

  .p5r-hud-util-btn:hover .p5r-hud-cart-text {
    color: var(--hud-accent-red, #D6001C);
  }

  .p5r-hud-icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    filter: drop-shadow(2px 2px 0px #000000);
    transition: transform 0.2s ease
    , filter 0.2s ease;
  }

  .p5r-hud-util-btn:hover .p5r-hud-icon-wrap {
    transform: scale(1.08) rotate(-4deg);
    filter: drop-shadow(3px 3px 0px #000000) drop-shadow(0 0 8px var(--hud-accent-red, #D6001C));
  }

  .p5r-hud-icon {
    width: 24px;
    height: 24px;
    display: block;
  }

  .p5r-hud-icon--cart {
    width: 38px;
    height: 33px;
    display: block;
    filter: drop-shadow(2px 2px 0px #000000);
    transition: color 0.2s ease;
  }

  .p5r-hud-util-btn:hover .p5r-hud-icon--cart {
    color: var(--hud-accent-red, #D6001C);
  }

  .p5r-hud-pod-divider {
    width: 1px;
    height: 16px;
    background-color: rgba(255, 255, 255, 0.2);
    margin: 0 0.35rem;
  }

  .p5r-hud-cart-badge {
    position: absolute;
    top: -4px;
    right: -6px;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.35rem;
    background-color: var(--hud-accent-red, #D6001C);
    color: #FFFFFF;
    font-family: 'Space Mono'
    , 'Inter'
    , monospace
    , sans-serif;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1.35rem;
    text-align: center;
    border-radius: 3px;
    transform: skewX(-8deg);
    box-shadow: 2px 2px 0 #000000;
    pointer-events: none;
    z-index: 10;
    transition: transform 0.2s ease
    , background-color 0.2s ease
    , box-shadow 0.2s ease;
  }

  .p5r-hud-cart-badge.is-empty {
    opacity: 0.75;
  }

  /* ─── 3. RESPONSIVE TABLET & MOBILE SAFE-AREA INSETS ─────────────── */

  @media (max-width: 768px) {
    .p5r-hud-root {
      /* Add breathing room for Cart on mobile so the badge doesn't touch the screen edge */
      --hud-menu-off-x: {{ menu_off_x }}px;
      --hud-menu-off-y: {{ menu_off_y }}px;
      --hud-cart-off-x: calc({{ cart_off_x }}px + 16px);
      --hud-cart-off-y: calc({{ cart_off_y }}px + 8px);
    }
    .p5r-hud-cart-text {
      font-size: 1.05rem;
      margin-right: 0.35rem;
    }

    .p5r-hud-icon--cart {
      width: 32px;
      height: 28px;
    }

    .p5r-hud-cart-badge {
      top: -4px;
      right: -6px;
      min-width: 1.25rem;
      height: 1.25rem;
      line-height: 1.25rem;
      font-size: 0.7rem;
    }
  }
/* END_SECTION:header */

/* START_SECTION:hello-world (INDEX:13) */
.welcome {
    display: grid;
    grid-template-columns: var(--content-grid);
    background-color: #f6f6f7;
    padding: 72px 0;
  }

  .welcome-content {
    grid-column: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    width: 100%;
    padding: 0 24px;
  }

  .welcome-description {
    max-width: 80ch;
    line-height: 1.4;
    margin-top: 1.5rem;
  }

  .icon {
    width: 300px;
  }

  .highlights {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 50px;
  }

  @media (max-width: 1100px) {
    .highlights {
      grid-template-columns: 1fr;
    }
  }

  .highlight {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 24px;
    border-radius: 8px;
    background-color: #eef3ff;
    color: rgb(92, 95, 98);
    line-height: 1.4;
  }

  .highlight > * + * {
    margin-top: 1rem;
  }

  .highlight h3 {
    font-size: 1rem;
    color: rgb(32, 34, 35);
  }

  .highlight-description {
    flex: 1 1;
  }

  .highlight a {
    display: flex;
    width: fit-content;
    background-color: rgb(250, 251, 251);
    box-shadow: rgba(0, 0, 0, 0.2) 0px -3px 0px 0px inset, rgba(255, 255, 255, 0.9) 0px 2px 0px 0px inset;
    border: 1px solid rgb(140, 145, 150);
    border-radius: 4px;
    color: rgb(92, 95, 98);
    padding: 3px 10px 5px;
    text-decoration: none;
  }
/* END_SECTION:hello-world */

/* CSS from block stylesheet tags */
/* START_BLOCK:group (INDEX:24) */
.group {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    width: 100%;
  }

  .group--horizontal {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0 var(--padding);
  }

  .group--vertical {
    flex-direction: column;
    align-items: var(--alignment);
    padding: var(--padding) 0;
  }
/* END_BLOCK:group */

/* START_BLOCK:text (INDEX:25) */
.text {
    text-align: var(--text-align);
  }
  .text--title {
    font-size: 2rem;
    font-weight: 700;
  }
  .text--subtitle {
    font-size: 1.5rem;
  }
/* END_BLOCK:text */

/* CSS from snippet stylesheet tags */
/* START_SNIPPET:image (INDEX:27) */
.image {
    display: block;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: auto;
  }

  .image > img {
    width: 100%;
    height: auto;
  }
/* END_SNIPPET:image */