:root {
  /* client palette */
  --mumu-cream: #e8d6ef;
  --mumu-lavender: #c3aee8;
  --mumu-mint: #c5e0dd;
  --mumu-sage: #a7cac1;
  /* derived */
  --mumu-surface: #faf6fd;
  --mumu-text: #4d5c56;
  --mumu-muted: #7a9189;
  --mumu-mint-dark: #9fc9c4;
  --mumu-lavender-dark: #7a68a8;
  --mumu-lavender-deep: #9b85c9;
  --mumu-sage-dark: #6d9a8f;
  --mumu-sage-deep: #5a8579;
  --mumu-sage-muted: #4f6b66;
  --mumu-font: 'Nunito Sans', Helvetica, Arial, sans-serif;
  --mumu-font-display: 'Nunito', Helvetica, Arial, sans-serif;
}

body {
  position: relative;
  color: var(--mumu-text);
  background: #fff;
  font-family: var(--mumu-font);
}

h1, h2, h3,
.products-product-name,
.product-title {
  font-family: var(--mumu-font-display);
}

body::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .4;
  background: url('/themes/mumukids/images/body-background.png') repeat;
  background-size: 400px;
}

.products-list li {
  background: #fff;
  padding: .75em;
  border-radius: .3em;
  box-shadow: 0 1px 4px rgba(77, 92, 86, .08);
  display: flex;
  flex-direction: column;
}

.products-list li > *:last-child {
  margin-top: auto;
}

.products-product-image,
.product .product-image,
.cart-products-body-image img {
  border-radius: .3em;
  object-fit: contain;
}

a { color: var(--mumu-lavender-dark); }

h1, h2, h3 { color: var(--mumu-lavender-dark); }

.header {
  background: var(--mumu-surface);
  color: var(--mumu-text);
}

.header ul a { color: var(--mumu-sage-muted); }

.header ul li:hover {
  background: transparent;
}

.header ul li:hover > a {
  color: var(--mumu-mint-dark);
}

.header .parent-subcategories li:hover > a {
  color: var(--mumu-mint-dark);
}

.header .menu > .top,
.header .parent-subcategories,
.header .parent-subcategories li {
  text-align: left;
}

@media screen and (min-width: 1001px) {
  .header .menu > .top {
    padding-left: .5em;
    padding-right: .5em;
  }

  .header .menu > .top:hover,
  .header .menu > .top:hover > a {
    background: transparent;
    color: var(--mumu-mint-dark);
  }

  .header .parent-div,
  .header .parent-div-in,
  .header .parent-subcategories,
  .header .parent-subcategories li,
  .header .parent-subcategories li:hover {
    background: var(--mumu-surface);
  }

  .header .parent-subcategories li,
  .header .parent-subcategories a {
    color: var(--mumu-sage-muted);
  }

  .header .parent-subcategories li {
    line-height: 2.5em;
    height: 2.5em;
    padding: 0 .5em;
  }
}

#footer,
.footer {
  background: var(--mumu-lavender);
  color: #fff;
}

#footer a,
.footer a { color: #fff; }

.footer-credentials {
  text-align: center;
  font-size: 80%;
}

/* text */
.products-product-name {
  color: var(--mumu-sage-muted);
  margin: .3em 0;
  font-size: 1rem;
  line-height: 1.3em;
  height: 3.9em;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.product-title {
  color: var(--mumu-sage-muted);
}

.products-product-description,
.product-description,
label {
  color: var(--mumu-muted);
}

.products-product-price,
.product-price {
  color: var(--mumu-sage-dark);
}

/* primary CTAs */
.buy-now,
input[type=submit] {
  background: var(--mumu-sage-dark);
  border-color: var(--mumu-sage-dark);
  color: #fff;
}

.buy-now:hover,
input[type=submit]:hover {
  background: var(--mumu-sage-deep);
  border-color: var(--mumu-sage-deep);
  color: #fff;
  opacity: 1;
}

.add-to-cart {
  background: var(--mumu-surface);
  border-color: var(--mumu-sage-dark);
  color: var(--mumu-sage-dark);
}

.add-to-cart:hover {
  background: var(--mumu-sage-dark);
  border-color: var(--mumu-sage-dark);
  color: #fff;
}

/* secondary */
.pager li,
.pager li:first-child {
  color: var(--mumu-muted);
  border-color: var(--mumu-mint);
}

.pager .pager-selected,
.pager li:hover {
  background: var(--mumu-mint);
  color: var(--mumu-text);
}

/* cart order */
.checkout button,
.order-button {
  background: var(--mumu-lavender);
  color: #fff;
}

.checkout button:hover,
.order-button:hover {
  background: var(--mumu-lavender-deep);
}

.carousel {
  overflow: hidden;
  width: 100%;
}

.carousel .banner-item {
  overflow: hidden;
  position: relative;
  height: 70vh;
}

.carousel .banner-item picture {
  display: block;
  height: 100%;
}

.carousel .banner-item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.carousel .banner-content {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  padding: .5em 3em;
  box-sizing: border-box;
  background: rgba(79, 107, 102, .75);
  border-radius: .3em;
  transform: translate(-50%, -50%);
  font-size: 1.4rem;
  color: #fff;
  text-align: center;
}

.carousel .banner-content h2 {
  font-size: 1.6em;
  color: #fff;
}

.slick-next {
  right: 10px !important;
  padding: 2em !important;
  min-width: 30px;
  min-height: 30px;
  opacity: .8;
}

.slick-prev {
  left: 10px !important;
  padding: 2em !important;
  min-width: 30px;
  min-height: 30px;
  z-index: 3;
  opacity: .8;
}

.page-home .posts-segment-home-links .post > a,
.page-home .posts-segment-home-links .post h3,
.page-home .posts-segment-home-links .post p {
  display: none;
}

.page-home .posts-segment-home-links .post img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: .5em;
}

.banner-mid img {
  width: 100%;
  aspect-ratio: 6 / 1;
  object-fit: cover;
  display: block;
}

.shoppster-links-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: 1fr 1fr;
  gap: .5em;
  width: 100%;
  aspect-ratio: 7 / 3;
}

.shoppster-links-row + .shoppster-links-row {
  margin-top: .5em;
}

.shoppster-links-item-1 {
  grid-column: 1 / span 2;
  grid-row: 1 / span 2;
}

.shoppster-links-item-2 {
  grid-column: 3 / span 2;
  grid-row: 1;
}

.shoppster-links-item-3 {
  grid-column: 3;
  grid-row: 2;
}

.shoppster-links-item-4 {
  grid-column: 4;
  grid-row: 2;
}

.shoppster-links-item-5 {
  grid-column: 5;
  grid-row: 1 / span 2;
}

.shoppster-links-item {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: .5em;
}

.shoppster-links-item a {
  display: block;
  width: 100%;
  height: 100%;
}

.shoppster-links-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 1000px) {
  .carousel .banner-item {
    height: 50vh;
  }

  .carousel .banner-content {
    font-size: 1rem;
    padding: .5em 1em;
  }

  section .posts-segment-home-links {
    grid-template-columns: repeat(2, 1fr);
  }

  .banner-mid img {
    aspect-ratio: 3 / 2;
  }

  .shoppster-links-row {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: none;
    aspect-ratio: auto;
  }

  .shoppster-links-item {
    height: auto;
  }

  .shoppster-links-item a {
    height: auto;
  }

  .shoppster-links-item img {
    height: auto;
  }

  .shoppster-links-item-1 {
    grid-column: 1 / span 2;
    grid-row: 1;
  }

  .shoppster-links-item-1 img,
  .shoppster-links-item-3 img,
  .shoppster-links-item-4 img {
    aspect-ratio: 1 / 1;
  }

  .shoppster-links-item-2 {
    grid-column: 1 / span 2;
    grid-row: 2;
  }

  .shoppster-links-item-2 img {
    aspect-ratio: 2 / 1;
  }

  .shoppster-links-item-3 {
    grid-column: 1;
    grid-row: 3;
  }

  .shoppster-links-item-4 {
    grid-column: 1;
    grid-row: 4;
  }

  .shoppster-links-item-5 {
    grid-column: 2;
    grid-row: 3 / span 2;
  }

  .shoppster-links-item-5,
  .shoppster-links-item-5 a {
    height: 100%;
  }

  .shoppster-links-item-5 img {
    aspect-ratio: auto;
    height: 100%;
  }
}