:root {
  --custom-palette-ao-leite: rgb(233, 196, 106);
  --custom-palette-amargo: rgb(101, 189, 202);
  --custom-palette-cacau-nacional: rgb(167, 101, 77);
  --custom-palette-crocante: rgb(230, 137, 158);
  --custom-palette-gianduia: rgb(146, 185, 103);
  --custom-palette-casca-recheada: rgb(212, 78, 67);
}

/*
:root {
  --palette-background: #1b040b;
  --palette-neutral-light: #eeeeee;
  --palette-highlight: #c91b52;
  --palette-carousel-background: #1b040b;
  --palette-navigation-background: #1b040b;
  --palette-darkest: #1b040b;
} */


.card .tagline {
  font-weight: bold;
  opacity: 1;
}

.featured > div {
  padding: 1.2rem .8rem;
}

.featured .featured-label {
  margin-bottom: .8rem;
}

.featured .featured-value {
  font-size: 120%;
}

.splash figure::after {
  content: '';
  background: rgba(0,0,0,0.04);
  display: block;
  position: absolute;
  top: 0;
  right:  0;
  left: 0;
  bottom: 0;
}

.sliders ul > li {
  padding: 9.6rem 0;
}

.sliders .intro {
  text-align: center;
}

.sliders .intro p {
  text-align: left;
}

.sliders .intro > h2 {
  padding: .6rem 1.2rem;
  border-radius: 8px;
}


[data-category="Ao leite"] .splash figure {
  background: transparent;
}

.slider[data-category="Ao leite"] .intro > h2 {
  background-color: var(--custom-palette-ao-leite);
  color: white;
  display: inline-block;
}

[data-category="Ao leite"] .tagline,
[data-category="Ao leite"] [data-section="onde-comprar"] i {
  color: var(--custom-palette-ao-leite);
}

.card[data-category="Ao leite"] .label {
  background-color: var(--custom-palette-ao-leite);
  color: white;
}

.slider[data-category="Amargo"] .intro > h2 {
  background-color: var(--custom-palette-amargo);
  color: white;
  display: inline-block;
}

[data-category="Amargo"] .tagline,
[data-category="Amargo"] [data-section="onde-comprar"] i {
  color: var(--custom-palette-amargo);
}

.card[data-category="Amargo"] .label {
  background-color: var(--custom-palette-amargo);
  color: white;
}

.slider[data-category="Crocante"] .intro > h2 {
  background-color: var(--custom-palette-crocante);
  color: white;
  display: inline-block;
}

[data-category="Crocante"] .tagline,
[data-category="Crocante"] [data-section="onde-comprar"] i {
  color: var(--custom-palette-crocante);
}

.card[data-category="Crocante"] .label {
  background-color: var(--custom-palette-crocante);
  color: white;
}

.slider[data-category="Cacau nacional de origem"] .intro > h2 {
  background-color: var(--custom-palette-cacau-nacional);
  color: white;
  display: inline-block;
}

[data-category="Cacau nacional de origem"] .tagline,
[data-category="Cacau nacional de origem"] [data-section="onde-comprar"] i {
  color: var(--custom-palette-cacau-nacional);
}

.card[data-category="Cacau nacional de origem"] .label {
  background-color: var(--custom-palette-cacau-nacional);
  color: white;
}

.slider[data-category="Casca recheada"] .intro > h2 {
  background-color: var(--custom-palette-casca-recheada);
  color: white;
  display: inline-block;
}

[data-category="Casca recheada"] .tagline,
[data-category="Casca recheada"] [data-section="onde-comprar"] i {
  color: var(--custom-palette-casca-recheada);
}

.card[data-category="Casca recheada"] .label {
  background-color: var(--custom-palette-casca-recheada);
  color: white;
}

.slider[data-category="Gianduia"] .intro > h2 {
  background-color: var(--custom-palette-gianduia);
  color: white;
  display: inline-block;
}

[data-category="Gianduia"] .tagline,
[data-category="Gianduia"] [data-section="onde-comprar"] i {
  color: var(--custom-palette-gianduia);
}

.card[data-category="Gianduia"] .label {
  background-color: var(--custom-palette-gianduia);
  color: white;
}

.splash figure img {
  opacity: 1;
}

.card .label {
  background-color: white;
}

.slider .card .label {
  display: none;
}

.cover figure img {
  /* opacity: .25; */
  filter: grayscale(.33);
}

.trivia .number {
  min-width: 12rem;
}

[data-item] .splash figure::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-blend-mode: multiply;
  background-size: 100%;
}

[data-section="onde-comprar"] p {
  display: flex;
  flex-direction: row;
}

[data-section="onde-comprar"] p a {
  border-color: #ccc;
  font-size: 1.6rem !important;
}

[data-section="onde-comprar"] p,
[data-section="onde-comprar"] a {
  webkit-text-size-adjust: 100%;
}
