/* ------------------------------------ *\
  CONTENTS
\* ------------------------------------ */

/**
 * CONTENTS..............You’re reading it!
*/

.minipush.bg--cyan:focus,
.minipush.bg--cyan:active,
.minipush.bg--cyan:hover {
  background-color: var(--bs-cyan);
}

.minipush.bg--jaune:focus,
.minipush.bg--jaune:active,
.minipush.bg--jaune:hover {
  background-color: var(--bs-yellow);
}

.minipush.bg--orange:focus,
.minipush.bg--orange:active,
.minipush.bg--orange:hover {
  background-color: var(--bs-orange);
}

.minipush.bg--pink:focus,
.minipush.bg--pink:active,
.minipush.bg--pink:hover {
  background-color: var(--bs-pink);
}

.minipush.bg--vert:focus,
.minipush.bg--vert:active,
.minipush.bg--vert:hover {
  background-color: var(--bs-green);
}

.minipush.bg--violet:focus,
.minipush.bg--violet:active,
.minipush.bg--violet:hover {
  background-color: var(--bs-violet);
}

.minipush.bg--black:focus,
.minipush.bg--black:active,
.minipush.bg--black:hover {
  background-color: var(--bs-black);
}

.minipush.bg--black * {
  color: var(--bs-black);
}

a.minipush.bg--black:hover,
a.minipush.bg--black:focus,
a.minipush.bg--black:active,
a.minipush.bg--black:focus *,
a.minipush.bg--black:active *,
a.minipush.bg--black:hover * {
  color: var(--bs-white);
}

.minipush.bg--cyan,
.minipush.bg--jaune,
.minipush.bg--orange,
.minipush.bg--pink,
.minipush.bg--vert,
.minipush.bg--violet,
.minipush.bg--black {
  background-color: var(--bs-white);
}

.minipush {
  display: inline-flex;
  width: 100%;
  border: 1px solid var(--bs-lavender);
  padding: 3rem 2rem;
  transition: background-color 0.3s cubic-bezier(0.76, 0, 0.24, 1);
  text-decoration: none;
  font-size: 2rem;
  line-height: 1.2;
  font-weight: 500;
  height: 100%;
  align-items: center;
  position: relative;
}

.minipush i {
  margin-left: auto;
  margin-right: 1rem;
  transition: all 0.5s;
}

.minipush__text {
  width: 80%;
}

.paragraph--type--mini-push .external--link {
  position: relative;
}

.paragraph--type--mini-push:not(.no-animation) .minipush:hover i,
.paragraph--type--mini-push:not(.no-animation) .minipush:focus i,
.paragraph--type--mini-push:not(.no-animation) .minipush:active i {
  margin-right: unset;
}

.paragraph--type--mini-push .link--external i:before {
  content: '\f08e';
}

.paragraph--type--mini-push .link--mail i:before {
  content: '\f0e0';
}

.paragraph--type--mini-push .link--tel i:before {
  content: '\f095';
}

@media screen and (max-width: 900px) {
  .minipush {
    font-size: 1.25rem;
  }
}
