/** Shopify CDN: Minification failed

Line 143:18 Unexpected "{"
Line 143:27 Expected ":"
Line 161:20 Unexpected "{"
Line 161:29 Expected ":"
Line 165:18 Unexpected "{"
Line 165:27 Expected ":"
Line 173:18 Unexpected "{"
Line 173:27 Expected ":"
Line 174:18 Unexpected "{"
Line 174:27 Expected ":"
... and 4 more hidden warnings

**/
.collapsible-content--wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: flex-start;
}

.collapsible-content--block {
    border-radius: 20px;
    margin-bottom: 10px;
    background: var(--body_alternate_background);
    transition: all 1s ease;
}

.collapsible--heading {
    padding: 15px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 10px;
}

.collapsible--text {
    padding: 0 10px;
}

.collapsible--icon {
    width: 36px;
    height: 36px;
    background: var(--heading_color);
    border-radius: 50%;
    color: var(--body_alternate_background);
    display: flex;
    align-items: center;
    justify-content: center;
}

.collapsible--icon svg {
    width: 14px;
    height: auto;
    transition: .5s ease;
}

.collapsible--content-body {
    padding: 25px 25px;
    padding-top: 0!important;
}

.collapsible-content--block[open] {
    background: var(--heading_color);
    border-color: var(--heading_color);
}

.collapsible-content--block[open] .collapsible--text {
    color: var(--body_alternate_background);
}

.collapsible-content--block[open] .collapsible--icon {
    background: var(--body_alternate_background);
    color: var(--heading_color);
}

.collapsible-content--block[open] .collapsible--icon svg {
    transform: rotate(45deg);
}

.collapsible-content--block[open] .collapsible--content-body * {
    color: var(--body_alternate_background);
}

@media (min-width:768px) {
    .collapsible-content--wrapper {
        grid-template-columns: 1fr 1.3fr;
        gap: 50px;
    }
    .collapsible-content--info {
        max-width: 90%;
        position: sticky;
        top: calc( var(--header_height, 0px) + 30px);
    }
    .collapsible--heading {
        padding: 20px;
    }
    .collapsible--content-body {
        padding: 25px 30px;
    }
}

@media (min-width:1200px) {
    .collapsible-content--info {
        max-width: 80%;
    }
    .collapsible--heading {
        padding: 25px;
    }
    .collapsible--content-body {
        padding: 25px 35px;
    }
    .collapsible--text {
        padding: 0 10px;
    }
}

/* New: wrapper for heading text + small icon */
.collapsible--heading-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;            /* space between the small icon and text */
}

/* New: small icon/image next to the heading */
.collapsible--img {
  width: 34px;
  height: auto;
  flex: 0 0 auto;
  display: block;
}

/* Optional: tighten heading text when using the wrapper (keeps spacing nice) */
.collapsible--text {
  padding: 0 10px;      /* already in CSS1; keep it */
  margin: 0;            /* ensure no extra margin if your markup uses <p> */
}

/* ICON BADGE ONLY — no effect on the block’s border */

/* Closed: no overlay, no ring */
#shopify-section-{{ section.id }} summary .collapsible--badge{
  --badge-size: 40px;
  display: inline-grid;
  place-items: center;
  width: var(--badge-size);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  flex: 0 0 var(--badge-size);
  line-height: 0;
  overflow: hidden;
  box-sizing: content-box;

  background: transparent;   /* no tint */
  box-shadow: none;          /* no ring */
  transition: background .25s ease, box-shadow .25s ease, transform .2s ease;
}

@media (max-width: 767px){
  #shopify-section-{{ section.id }} summary .collapsible--badge{ --badge-size: 34px; }
}

/* Icon sizing inside the badge */
#shopify-section-{{ section.id }} summary .collapsible--badge .collapsible--img{
  width: 58%;
  height: 58%;
  object-fit: contain;
  display: block;
}

/* Optional: subtle hover ring on the badge only */
#shopify-section-{{ section.id }} summary:hover .collapsible--badge,
#shopify-section-{{ section.id }} summary:focus-visible .collapsible--badge{
  box-shadow: 0 0 0 1.5px var(--heading_color);
}

/* OPEN: flip the badge so the icon stays visible (does NOT touch block border) */
#shopify-section-{{ section.id }} .collapsible-content--block[open] summary .collapsible--badge{
  background: var(--body_alternate_background);
  box-shadow: 0 0 0 1.5px var(--body_alternate_background);
}

/* Optional: tiny lift for dark PNGs against light badge */
#shopify-section-{{ section.id }} .collapsible-content--block[open] summary .collapsible--badge .collapsible--img{
  filter: brightness(0.95) contrast(1.05);
}