@charset "UTF-8";
/*!
 * Single recipe template — source SCSS (do not edit assets/css/single-recipe.css by hand).
 * Compile: npm run build:css
 *
 * @package YaloFSE
 */
/* ==========================================================================
   Twelve Column Grid Layout
   ========================================================================== */
@media (min-width: 992px) {
  .twelve-col-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
  }
  .twelve-col-grid .recipe-stats {
    grid-column-start: 1;
    grid-column-end: 13;
  }
}
.twelve-col-grid .recipe-stats .recipe-stat__value {
  background-image: none;
}

/* ==========================================================================
   Recipe Header
   ========================================================================== */
.recipe-header {
  color: var(--color-dark);
  margin-top: 12px;
}

.recipe-header .recipe-breadcrumbs {
  margin: 32px 0;
}

.recipe-header .recipe-breadcrumbs a {
  color: var(--color-dark);
}

/* ==========================================================================
   Recipe Details
   ========================================================================== */
.recipe-header .recipe-image,
.recipe-header .recipe-title {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.recipe-header .recipe-title {
  margin-top: 40px;
  margin-bottom: 0;
  padding: 0 16px;
  box-sizing: border-box;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

@media (min-width: 992px) {
  .recipe-header .recipe-image,
  .recipe-header .recipe-title {
    width: 80%;
  }
  .recipe-header .recipe-title {
    padding: 0;
    margin-top: 56px;
  }
}
/* ==========================================================================
   Recipe Content
   ========================================================================== */
.recipe-content {
  display: grid;
  margin: 0 var(--spacing-md);
}

.recipe-content h2.headline-lg {
  margin-bottom: 0;
}

.recipe-content .description {
  padding: 0;
}

.recipe-content .description p {
  margin: 0;
  font-family: var(--font-secondary);
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0;
  color: var(--color-dark);
}

@media (min-width: 768px) {
  .recipe-content .description p {
    font-size: 1.1rem;
    line-height: 1.5;
  }
}
@media (min-width: 1400px) {
  .recipe-content .description p {
    font-size: 1rem;
    line-height: 1.5;
  }
}
@media (min-width: 1920px) {
  .recipe-content .description p {
    font-size: 1rem;
    line-height: 1.5;
  }
}
.recipe-content .description em {
  font-size: var(--font-size-sm);
  font-family: var(--font-secondary);
  line-height: var(--line-height-relaxed);
  letter-spacing: var(--letter-spacing-wide);
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .recipe-content .description em {
    font-size: var(--font-size-base);
  }
}
@media (min-width: 1920px) {
  .recipe-content .description em {
    font-size: 22px;
  }
}
.recipe-content .directions,
.recipe-content .ingredients {
  display: grid;
  grid-template-rows: max-content;
  row-gap: 32px;
}

.recipe-content .recipe-directions {
  border: none;
  box-sizing: border-box;
}

.recipe-content .recipe-stats {
  padding-bottom: 24px;
}

/* ==========================================================================
   Ingredients
   ========================================================================== */
.recipe-content .ingredients ul {
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: var(--font-secondary);
}

.recipe-content .ingredients ul li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 8px 0;
  font-family: var(--font-secondary);
}

.recipe-content .ingredients ul li::before {
  content: "";
  width: 16px;
  min-width: 16px;
  height: 16px;
  border: 1px solid var(--color-dark);
  border-radius: 2px;
  margin-top: 4px;
  box-sizing: border-box;
}

/* Ingredient title/header styling - no disc, no padding */
.recipe-content .ingredients ul li.ingredient-title {
  padding: 0;
  margin-top: var(--spacing-lg);
  font-weight: 700;
  text-transform: uppercase;
}

.recipe-content .ingredients ul li.ingredient-title:first-child {
  margin-top: 0;
}

.recipe-content .ingredients ul li.ingredient-title::before {
  content: none;
  display: none;
}

/* ==========================================================================
   Directions
   ========================================================================== */
.recipe-content .directions ol {
  margin: 0;
  padding-left: 1.5em;
  list-style: decimal;
  list-style-position: outside;
  font-family: var(--font-secondary);
}

.recipe-content .directions ol li {
  margin: 0 0 1rem;
  padding-left: 0.35em;
  line-height: 1.5;
  color: var(--color-dark);
}

.recipe-content .directions ol li:last-child {
  margin-bottom: 0;
}

/* Direction title/header styling */
.recipe-content .directions h3.direction-title {
  font-weight: 700;
  margin: var(--spacing-2xl) 0 var(--spacing-lg) 0;
  font-family: var(--font-primary);
  font-size: var(--font-size-xl);
}

.recipe-content .directions h3.direction-title:first-child {
  margin-top: 0;
}

/* Recipe Content Grid Layout */
@media (min-width: 992px) {
  .recipe-content {
    grid-template-columns: repeat(12, 1fr);
    column-gap: 32px;
    margin: 64px 32px;
    align-items: start;
  }
  /* Row 1: ingredients (left) and stats (right) share the same top edge. */
  .recipe-content .ingredients {
    grid-column-start: 2;
    grid-column-end: 6;
    grid-row-start: 1;
    grid-row-end: 4;
    align-self: start;
    padding: 0 0 64px;
    height: max-content;
    position: sticky;
    top: 150px;
  }
  .recipe-content > .recipe-stats {
    grid-column-start: 6;
    grid-column-end: 12;
    grid-row-start: 1;
    grid-row-end: 2;
    align-self: start;
  }
  /* Row 2: print, share, description, directions under stats (same grid column). */
  .recipe-content .recipe-directions {
    grid-column-start: 6;
    grid-column-end: 12;
    grid-row-start: 2;
    grid-row-end: 3;
    align-self: start;
    border-left: 1px solid #000;
    padding: 8px 0 48px 24px;
  }
  .recipe-content .recipe-directions .directions {
    padding: 0;
  }
}
/* ==========================================================================
   Recipe Stats
   ========================================================================== */
.recipe-stats {
  --recipe-stats-border: var(--kb-brand-blue, #001489);
  display: flex;
  flex-direction: column;
  align-self: stretch;
  margin: 20px 0 0;
  padding: 0;
  background: var(--color-white);
  border-top: 1px solid var(--recipe-stats-border);
  border-bottom: 1px solid var(--recipe-stats-border);
  box-sizing: border-box;
}

.recipe-stat {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
  padding: 1.125rem 0;
  text-align: left;
}

.recipe-stat__icon {
  flex-shrink: 0;
  display: block;
  width: 56px;
  height: 52px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.recipe-stat__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  min-width: 0;
}

.recipe-stat__label,
.recipe-stat__value {
  font-family: var(--font-secondary);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1.25;
  color: var(--color-dark);
}

.recipe-stat__label {
  font-weight: 700;
  font-size: 0.8125rem;
}

.recipe-stat__value {
  font-weight: 400;
  font-size: 0.8125rem;
}

.recipe-stat--prep .recipe-stat__icon {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2743%27%20height%3D%2740%27%20viewBox%3D%270%200%2043%2040%27%20fill%3D%27none%27%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%3E%3Cg%20clip-path%3D%27url(%23clip0_573_4491)%27%3E%3Cpath%20d%3D%27M27.7153%2022.4089C24.8887%2023.04%2016.5598%2023.3778%2014.222%2023.04C14.222%2021.2622%2013.3331%2021.2622%2013.3331%2021.2622C13.3331%2021.2622%209.44867%2021.92%205.58201%2021.1822C4.71978%2022.2134%203.55534%2022.1511%203.55534%2022.1511C2.07978%2022.1511%200.888672%2020.96%200.888672%2019.4845C0.888672%2018.0089%202.07978%2016.8178%203.55534%2016.8178C3.55534%2016.8178%202.03534%2016.8178%2013.3331%2016.8178C24.6309%2016.8178%2031.2976%2016.6667%2034.6664%2018.1511C33.8576%2019.8756%2030.5331%2021.7778%2027.7153%2022.4089Z%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M13.334%2021.2622V16.8177%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M10.3821%2014.16L23.4221%201.12892C24.4621%200.0889196%2029.8754%202.55114%2034.7377%207.41336C39.5999%2012.2756%2042.0621%2017.6889%2041.0221%2018.7289L20.9066%2038.8445C20.5599%2039.1911%2020.0177%2039.2089%2019.6888%2038.8889L5.66211%2024.8623%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-miterlimit%3D%2710%27%20stroke-linecap%3D%27round%27/%3E%3Cpath%20d%3D%27M29.1738%208.12439L33.9472%2012.9066%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-miterlimit%3D%2710%27%20stroke-linecap%3D%27round%27/%3E%3C/g%3E%3Cdefs%3E%3CclipPath%20id%3D%27clip0_573_4491%27%3E%3Crect%20width%3D%2742.1511%27%20height%3D%2740%27%20fill%3D%27white%27/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.recipe-stat--cook .recipe-stat__icon {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2742%27%20height%3D%2740%27%20viewBox%3D%270%200%2042%2040%27%20fill%3D%27none%27%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%3E%3Cg%20clip-path%3D%27url(%23clip0_573_4468)%27%3E%3Cpath%20d%3D%27M4.62305%2019.5894V32.5273%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M4.62305%2019.5894H34.3214%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M4.62305%2016.0406L17.855%2011.5691L25.7942%208.94299%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M34.3223%2032.5273V19.5894%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M4.62305%2032.5272C4.62305%2036.0862%207.51278%2038.986%2011.0717%2038.986H27.8626C31.4317%2038.986%2034.3113%2036.0963%2034.3113%2032.5272%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M13.809%2012.8466L13.2818%2011.1635C12.9269%2010.0482%2013.5454%208.86186%2014.6607%208.50698L18.7064%207.22941C19.8217%206.87453%2021.008%207.49303%2021.3629%208.60837L21.8293%2010.0887%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M25.3281%206.45878C25.3281%209.47019%2027.7717%2011.9036%2030.773%2011.9036C33.7743%2011.9036%2036.2179%209.47019%2036.2179%206.45878C36.2179%203.44738%2033.7743%201.01392%2030.773%201.01392C27.7717%201.01392%2025.3281%203.44738%2025.3281%206.45878Z%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M32.082%2019.5995C32.4774%2019.1128%2032.7208%2018.4943%2032.7208%2017.8251C32.7208%2016.2738%2031.4635%2015.0063%2029.9121%2015.0063C28.3608%2015.0063%2027.1035%2016.2636%2027.1035%2017.8251C27.1035%2018.5044%2027.3469%2019.123%2027.7423%2019.6096%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M36.1374%207.44231C36.3706%207.40176%2036.6139%207.37134%2036.8573%207.37134C38.9663%207.37134%2040.6697%209.07476%2040.6697%2011.1838C40.6697%2013.2928%2038.9663%2014.9962%2036.8573%2014.9962C36.2286%2014.9962%2035.6405%2014.8441%2035.1133%2014.5805%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M4.6233%2027.9341H2.68668C1.76399%2027.9341%201.01367%2027.0925%201.01367%2026.038V24.1419C1.01367%2023.0976%201.76399%2022.2458%202.68668%2022.2458H4.6233%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M34.4531%2027.9341H36.3898C37.3124%2027.9341%2038.0628%2027.0925%2038.0628%2026.038V24.1419C38.0628%2023.0976%2037.3124%2022.2458%2036.3898%2022.2458H34.4531%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/g%3E%3Cdefs%3E%3CclipPath%20id%3D%27clip0_573_4468%27%3E%3Crect%20width%3D%2741.6831%27%20height%3D%2740%27%20fill%3D%27white%27/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.recipe-stat--serves .recipe-stat__icon {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2749%27%20height%3D%2740%27%20viewBox%3D%270%200%2049%2040%27%20fill%3D%27none%27%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%3E%3Cg%20clip-path%3D%27url(%23clip0_573_4482)%27%3E%3Cpath%20d%3D%27M10.2383%2038.7737C11.4645%2038.4426%2013.2671%2038.087%2015.0084%2038.087H28.5461C30.8269%2038.087%2032.3842%2037.3513%2033.3039%2036.6401C35.8422%2034.6781%2039.0427%2031.5634%2041.765%2029.5647C42.2309%2029.2213%2042.8931%2028.7553%2042.9054%2028.2771C42.9421%2027.4065%2041.5933%2026.3274%2040.2076%2026.1434C39.1285%2025.9963%2038.3192%2026.2048%2037.2401%2026.8547C34.5547%2028.461%2031.1212%2031.3427%2031.1212%2031.3427H19.2879%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M28.8903%2031.2937V30.1165C28.8903%2028.3998%2027.6518%2027.1122%2025.8247%2026.8915C23.2496%2026.5482%2018.455%2026.1803%2014.9847%2025.7389C13.3783%2025.5304%2011.3795%2025.9841%2010.141%2026.8179C9.61375%2027.1613%209.02515%2027.5169%208.4243%2027.848C7.48009%2028.3753%203.34766%2031.5758%203.34766%2031.5758%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M1.22656%2025.6653H47.0389%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M3.74023%2025.6652C3.74023%2014.3225%2012.937%205.13794%2024.2798%205.13794C35.6225%205.13794%2044.8193%2014.3348%2044.8193%2025.6775H3.74023V25.6652Z%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M10.5957%2018.1115C11.9936%2015.5855%2014.0782%2013.4886%2016.5798%2012.0662%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M20.5156%204.99076C20.5156%202.91841%2022.1956%201.2262%2024.2802%201.2262C26.3648%201.2262%2028.0325%202.91841%2028.0325%204.99076%27%20stroke%3D%27%23EE2E24%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/g%3E%3Cdefs%3E%3CclipPath%20id%3D%27clip0_573_4482%27%3E%3Crect%20width%3D%2748.2649%27%20height%3D%2740%27%20fill%3D%27white%27/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

@media (min-width: 992px) {
  .recipe-stats {
    flex-direction: row;
    align-items: stretch;
    padding: 0;
    margin-top: 0;
    border-top: none;
    border-right: none;
    border-left: 1px solid var(--recipe-stats-border);
    border-bottom: 1px solid var(--recipe-stats-border);
  }
  .recipe-stat {
    flex: 1 1 0;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0.65rem;
    padding: 1.25rem 0.75rem 1.5rem;
    text-align: center;
  }
  .recipe-stat__icon {
    width: 40px;
    height: 36px;
  }
  .recipe-stat__text {
    align-items: center;
  }
  .recipe-stat__label,
  .recipe-stat__value {
    font-size: 0.875rem;
  }
}
.single-recipe .btn-print {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: auto;
  margin-top: 24px;
  padding: 0.5rem 1.2rem;
  background: var(--kb-brand-blue, #001489);
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  font-family: var(--font-secondary);
  font-size: 1em;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.25;
  border: 2px solid transparent;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.single-recipe .btn-print:hover,
.single-recipe .btn-print:focus-visible {
  background: #fff;
  color: var(--kb-brand-blue, #001489);
  border-color: var(--kb-brand-blue, #001489);
  outline: none;
}

.single-recipe .recipe-share {
  display: flex;
  gap: 10px;
  margin-top: 14px;
  margin-bottom: 24px;
}

.single-recipe .recipe-share__link {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: var(--kb-brand-blue, #001489);
  color: #fff;
  border: 2px solid var(--kb-brand-blue, #001489);
  font-family: var(--font-secondary);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.single-recipe .recipe-share__link svg {
  width: 18px;
  height: 18px;
  display: block;
}

.single-recipe .recipe-share__link svg path {
  fill: currentColor;
}

.single-recipe .recipe-share__link:hover,
.single-recipe .recipe-share__link:focus-visible {
  background: #fff;
  color: var(--kb-brand-blue, #001489);
  outline: none;
}

/* ==========================================================================
   Single Recipe Page Specific
   ========================================================================== */
.single-recipe .recipe-image img {
  min-width: 100%;
  width: 100%;
  height: 460px;
  object-fit: cover;
}

.single-recipe .related-recipe-thumb img {
  width: 100%;
  height: auto;
}

.single-recipe .recipe-social {
  margin-left: 30px;
  margin-bottom: var(--spacing-lg);
}

.single-recipe .recipe-social .link-sm {
  background-image: none;
}

/* Keep single-recipe featured module aligned to global content constraints. */
.single-recipe .kb-featured-recipes {
  width: 90%;
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
}

/* ==========================================================================
   Related Recipes Section
   ========================================================================== */
.related-recipes {
  padding-top: 64px;
}

@media (min-width: 992px) {
  .related-recipes {
    padding-top: 96px;
  }
}
/* Related recipes on single recipe page */
section.recipes_list.related {
  overflow: hidden;
}

section.recipes_list.related h2 {
  margin-top: 80px;
}

@media (min-width: 992px) {
  section.recipes_list.related h2 {
    margin-top: 160px;
  }
}
@media (min-width: 992px) {
  section.recipes_list.related h2,
  section.recipes_list.related .divider-sm {
    grid-column-start: 2;
    grid-column-end: 14;
  }
}
section.recipes_list.related .container {
  padding: 0;
  overflow: hidden;
}

section.recipes_list.related .recipes {
  display: none;
  margin-bottom: 80px;
}

@media (min-width: 768px) {
  section.recipes_list.related .recipes {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
    overflow-x: visible;
    padding: 0 32px;
  }
}
@media (min-width: 992px) {
  section.recipes_list.related .recipes {
    margin-bottom: 120px;
  }
}
section.recipes_list.related .slides {
  margin: 48px 0;
}

@media (min-width: 768px) {
  section.recipes_list.related .slides {
    display: none;
  }
}
section.recipes_list.related .slides .recipe-card {
  transition: background var(--transition-fast);
  padding: 12px;
  border-radius: 24px;
}

section.recipes_list.related .slides .glide__arrows {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

section.recipes_list.related .slides .glide__arrows .glide__arrow {
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: var(--color-white);
  color: var(--color-dark);
  font-size: var(--font-size-sm);
  transition: all var(--transition-fast);
  margin: 0 0.5rem;
  cursor: pointer;
}

section.recipes_list.related .slides .glide__arrows .glide__arrow:hover {
  background: var(--color-dark);
  color: var(--color-white);
}

section.recipes_list.related .slides .glide__arrows .glide__arrow:hover svg path {
  fill: var(--color-white);
}

section.recipes_list.related .slides .glide__arrows .glide__arrow--left svg {
  transform: rotate(90deg);
}

section.recipes_list.related .slides .glide__arrows .glide__arrow--right svg {
  transform: rotate(-90deg);
}

/* ==========================================================================
   Tips
   ========================================================================== */
.tips ul {
  margin: 0;
  padding-left: 1.25em;
  list-style-type: disc;
  list-style-position: outside;
  font-family: var(--font-secondary);
}

.tips ul li {
  margin: 0 0 0.75rem;
  line-height: 1.5;
  color: var(--color-dark);
}

.tips ul li:last-child {
  margin-bottom: 0;
}

/* ==========================================================================
   Related Product
   ========================================================================== */
.related-product {
  background: var(--color-white);
  border-radius: 8px;
  padding: var(--spacing-lg);
  height: max-content;
  max-width: 440px;
}

@media (min-width: 992px) {
  .related-product {
    border-radius: 16px;
  }
}
.related-product .product-info {
  display: grid;
  grid-template-columns: 2.5fr 1.5fr;
}

.related-product .product-info img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.related-product .button-group {
  margin-top: 40px;
  display: grid;
  grid-template-columns: max-content max-content;
  align-items: center;
  gap: var(--spacing-lg);
}

.related-product .button.small.arrow {
  padding-left: 55px;
  display: inline-flex;
}