/** Shopify CDN: Minification failed

Line 220:0 Unexpected "}"

**/
/* Top Level */


.breadcrumbs {
  align-items: center; /* This forces vertical centering */
  padding-top: 8px;
  padding-bottom: 0px;
  gap: 12px;
}

/* Breadcrumbs */
/* 0. Set the base size for the entire breadcrumb block */
.breadcrumb {
  font-size: 13px;      /* everything inside will use this as 1 em */
  align-items: center;  /* vertically center icon + text */
  gap: 3px;
  overflow-x: scroll;
  /* 1. Turn on the Flex engine (REQUIRED for flex-wrap to work) */
  display: flex;
  /* 2. Force items to stay in one long horizontal row */
  flex-wrap: nowrap;
  /* 3. Allow horizontal scrolling if the row is too long */
  overflow-x: auto; 
  /* 4. OPTIONAL: Makes sure items align vertically in the middle */
  align-items: center;
  /* Hides the ugly grey scrollbar (Modern Browsers) */
    scrollbar-width: none;

}

.breadcrumb > * {
  /* 5. CRITICAL: This prevents the text INSIDE the item from breaking */
  white-space: nowrap; 
  /* 6. CRITICAL: Tells the browser "Do not squish this item" */
  flex-shrink: 0;
  /* 5. THE  TRICK: "Isolate" the items so they stay LTR */

}

/* 1. Turn each crumb link into an inline-flex container */
.breadcrumb a {
  display: inline-flex;
  align-items: center;  /* vertically center icon + text */
  gap: 0.35em;          /* ~3.5px at 14px font-size */
  color: #8D8D8D !important;
}

/* 2. Icons flow at the text size and inherit color & alignment */
.breadcrumb svg {
  height: 0.8em;          /* now 14px */
  width: auto;
  fill: currentColor;
  color: #8D8D8D;
  vertical-align: middle;
}

/* Targets only the first span inside your breadcrumb container */
.breadcrumb > span[itemprop="itemListElement"]:first-of-type {
  align-items: center;    /* Centers the icon vertically inside this box */
}

/* 3. Separator styling */
.breadcrumb .separator {
  margin: 0 0.01em;      /* ~7px on either side */
  line-height: 1;       /* keeps it aligned on the same axis */
  color: #aaa;          /* or whatever neutral you prefer */
}

/* Targets the span that is 2nd from the end (skipping the separator) */
.breadcrumb > span:nth-last-child(1) {
  color: #003C77 !important;
  font-weight: 500;
}

.emojis {
  display: flex;
  padding: 10px 16px;
  background: #fff;
  gap: 12px;
}

.related-section {
  display: flex;
  flex-direction: column;
  padding: 10px 16px;
  background: #fff;
  gap: 12px;
}


/* Related Articles */
.related-section details > summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  list-style: none;
  padding: 0;
}
.related-section__title {
  font: 600 14px/20px Outfit, sans-serif;
  color: #1A1A1A;
  margin: 0;
}

.icon-chevron-down {
  transition: transform 0.3s ease;
  display: inline-block;
}
details[open] > summary .icon-chevron-down {
  transform: rotate(180deg);
}

/* Subheader styling */
.related-section__subheader {
  font: 500 14px/16px Outfit, sans-serif;
  color: #333;
  margin: 8px 0 0;
}

/* List defaults to single column on mobile */
.related-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

/* Card styling */
.related-list__link {
  display: flex;
  padding: 4px;
  gap: 6px;
  background: #fff;
  box-shadow: 0 3px 18px rgba(26,26,26,.1);
  border-radius: 8px;
  text-decoration: none;
  align-items: center;
}
.related-list__icon {
  padding: 6px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
}

.related-list__icon img {
  width: 36px;
  height: calc(36px * (486 / 855));
  object-fit: contain;
}
.related-list__info {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.related-list__info-title {
  font: 500 14px/20px Outfit, sans-serif;
  color: #006ae6 !important;
  text-decoration: underline;
  margin: 0;
}

.related-list__info-meta {
  font: 400 10px/20px Outfit, sans-serif;
  color: #1A1A1A;
  margin: 0;
}


.related-section__info-title {
  font: 500 14px/20px Outfit, sans-serif;
  color: #006ae6 !important;
  text-decoration: underline;
  margin: 0;
}

.related-section__info-meta {
  font: 400 10px/20px Outfit, sans-serif;
  color: #1A1A1A;
  margin: 0;
}

/* ======= DESKTOP GRID ======= */
@media (min-width: 768px) {
  .related-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .related-list {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* ======= Top Section ======= */

.r {
  display: flex;
  padding: 10px 16px;
  background: #fff;
  gap: 12px;
}
}
.im {
  flex-shrink: 0;
}
.g {
  width: 60px;
  height: 40px;
  background: #fff;
  border: 1px solid#E4E4E4;
  border-radius: 8px;
  object-fit: contain;
  padding: 4px;
}
.sb {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.t {
  font-size: 1.5rem;
  font-weight: bold;
  margin: 0;
}
.ln {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
}
.ln a {
  font-size: 1.4rem;
  color: #006ae6 !important;
  text-decoration: underline;
  white-space: nowrap;
}
/* Base styles */
.rt {
  margin-left: auto;
  font-size: 1.4rem;
  display: flex;
  gap: 2px;
}

/* Hide .rt on very small screens */
@media (max-width: 389.99px) {
  .rt {
    display: none;   /* or visibility: hidden; if you want its space preserved */
  }
}
.s {
  color: #fcdc37;
}