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

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

/* ------------------------------------ *\
  ==BASE STYLE
\* ------------------------------------ */
.paragraph--type--small-push.card.small-push {
  border: 0;
  border-radius: 0;
}

.small-push__body {
  padding: 2rem;
  position: relative;
  width: 33.72%;
}

.paragraph--type--small-push.card.small-push .small-push__text h2,
.paragraph--type--small-push.card.small-push .small-push__text h3,
.paragraph--type--small-push.card.small-push .small-push__text h4 {
  font-size: 2rem;
  font-weight: 500;
}

.small-push__body:after {
  content: '';
  width: calc(23.68% * 2);
  height: 4rem;
  position: absolute;
  bottom: 0;
  right: 100%;
  background-color: inherit;
  z-index: 9;
}

.small-push__cta {
  margin-top: 2rem;
  padding: 0 1rem;
}

.paragraph--type--small-push.card.small-push.flex-lg-row-reverse
  .small-push__body:after {
  right: 100%;
}

.paragraph--type--small-push.card.small-push.flex-lg-row-reverse
  .field--name-field-small-push-image {
  text-align: right;
}

.paragraph--type--small-push.card.small-push.flex-lg-row
  .small-push__body:after {
  left: 100%;
}

@media screen and (max-width: 900px) {
  .paragraph--type--small-push.card.small-push.flex-lg-row-reverse
    .small-push__body,
  .paragraph--type--small-push.card.small-push.flex-lg-row .small-push__body {
    width: 100%;
  }

  .paragraph--type--small-push.card.small-push.flex-lg-row-reverse
    .small-push__body::after,
  .paragraph--type--small-push.card.small-push.flex-lg-row
    .small-push__body::after {
    height: 45%;
    width: 4rem;
    top: 100%;
    left: 0;
  }

  .paragraph--type--small-push .small-push__cta,
  .paragraph--type--small-push .paragraph.paragraph--type--texte {
    padding: 0;
  }
}
