.elementor-3466 .elementor-element.elementor-element-8d5deca{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:9;}.elementor-3466 .elementor-element.elementor-element-8d5deca:not(.elementor-motion-effects-element-type-background), .elementor-3466 .elementor-element.elementor-element-8d5deca > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-994c9bc{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3466 .elementor-element.elementor-element-994c9bc.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3466 .elementor-element.elementor-element-b113708{--grid-template-columns:repeat(0, auto);--grid-column-gap:5px;--grid-row-gap:0px;}.elementor-3466 .elementor-element.elementor-element-b113708 .elementor-widget-container{text-align:center;}.elementor-3466 .elementor-element.elementor-element-b113708 .elementor-social-icon{background-color:#FFFFFF00;}.elementor-3466 .elementor-element.elementor-element-b113708 .elementor-social-icon i{color:#FFFFFF;}.elementor-3466 .elementor-element.elementor-element-b113708 .elementor-social-icon svg{fill:#FFFFFF;}.elementor-3466 .elementor-element.elementor-element-b113708 .elementor-social-icon:hover{background-color:#FFFFFF;}.elementor-3466 .elementor-element.elementor-element-b113708 .elementor-social-icon:hover i{color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-b113708 .elementor-social-icon:hover svg{fill:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-4b77658{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3466 .elementor-element.elementor-element-2a7c8b6{width:var( --container-widget-width, 10.401% );max-width:10.401%;--container-widget-width:10.401%;--container-widget-flex-grow:0;}.elementor-3466 .elementor-element.elementor-element-2a7c8b6.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-search-form{text-align:center;}.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-search-form__toggle{--e-search-form-toggle-size:48px;--e-search-form-toggle-color:var( --e-global-color-17ae00b );}.elementor-3466 .elementor-element.elementor-element-2a7c8b6.elementor-search-form--skin-full_screen .elementor-search-form__container{background-color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-search-form__input,
					.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-search-form__icon,
					.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-lightbox .dialog-lightbox-close-button,
					.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-lightbox .dialog-lightbox-close-button:hover,
					.elementor-3466 .elementor-element.elementor-element-2a7c8b6.elementor-search-form--skin-full_screen input[type="search"].elementor-search-form__input{color:var( --e-global-color-17ae00b );fill:var( --e-global-color-17ae00b );}.elementor-3466 .elementor-element.elementor-element-2a7c8b6:not(.elementor-search-form--skin-full_screen) .elementor-search-form--focus .elementor-search-form__input,
					.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-search-form--focus .elementor-search-form__icon,
					.elementor-3466 .elementor-element.elementor-element-2a7c8b6 .elementor-lightbox .dialog-lightbox-close-button:hover,
					.elementor-3466 .elementor-element.elementor-element-2a7c8b6.elementor-search-form--skin-full_screen input[type="search"].elementor-search-form__input:focus{color:var( --e-global-color-17ae00b );fill:var( --e-global-color-17ae00b );}.elementor-3466 .elementor-element.elementor-element-2a7c8b6:not(.elementor-search-form--skin-full_screen) .elementor-search-form__container{border-radius:19px;}.elementor-3466 .elementor-element.elementor-element-2a7c8b6.elementor-search-form--skin-full_screen input[type="search"].elementor-search-form__input{border-radius:19px;}.elementor-3466 .elementor-element.elementor-element-856e1fa{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:0.5;--border-radius:0px 0px 30px 30px;box-shadow:0px 6px 30px 3px rgba(0, 0, 0, 0.18);--z-index:99;}.elementor-3466 .elementor-element.elementor-element-856e1fa::before, .elementor-3466 .elementor-element.elementor-element-856e1fa > .elementor-background-video-container::before, .elementor-3466 .elementor-element.elementor-element-856e1fa > .e-con-inner > .elementor-background-video-container::before, .elementor-3466 .elementor-element.elementor-element-856e1fa > .elementor-background-slideshow::before, .elementor-3466 .elementor-element.elementor-element-856e1fa > .e-con-inner > .elementor-background-slideshow::before, .elementor-3466 .elementor-element.elementor-element-856e1fa > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-3466 .elementor-element.elementor-element-15946b7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3466 .elementor-element.elementor-element-15946b7.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3466 .elementor-element.elementor-element-c9b8528{--display:flex;--overlay-opacity:0.5;}.elementor-3466 .elementor-element.elementor-element-c9b8528::before, .elementor-3466 .elementor-element.elementor-element-c9b8528 > .elementor-background-video-container::before, .elementor-3466 .elementor-element.elementor-element-c9b8528 > .e-con-inner > .elementor-background-video-container::before, .elementor-3466 .elementor-element.elementor-element-c9b8528 > .elementor-background-slideshow::before, .elementor-3466 .elementor-element.elementor-element-c9b8528 > .e-con-inner > .elementor-background-slideshow::before, .elementor-3466 .elementor-element.elementor-element-c9b8528 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-3466 .elementor-element.elementor-element-c9b8528.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3466 .elementor-element.elementor-element-4351ff7{--display:flex;--justify-content:flex-end;}.elementor-3466 .elementor-element.elementor-element-4351ff7.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3466 .elementor-element.elementor-element-6c49a8b .elementor-heading-title{font-size:14px;}.elementor-3466 .elementor-element.elementor-element-94c8c8e{--display:flex;--justify-content:center;}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-69745da );fill:var( --e-global-color-69745da );}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main .elementor-item:hover,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main .elementor-item:focus{color:#fff;}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-966aee8 .e--pointer-framed .elementor-item:before,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:var( --e-global-color-17ae00b );}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:before,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:after{background-color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-966aee8 .e--pointer-framed .elementor-item.elementor-item-active:before,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .e--pointer-framed .elementor-item.elementor-item-active:after{border-color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-item:before{border-radius:20px;}.elementor-3466 .elementor-element.elementor-element-966aee8 .e--animation-shutter-in-horizontal .elementor-item:before{border-radius:20px 20px 0 0;}.elementor-3466 .elementor-element.elementor-element-966aee8 .e--animation-shutter-in-horizontal .elementor-item:after{border-radius:0 0 20px 20px;}.elementor-3466 .elementor-element.elementor-element-966aee8 .e--animation-shutter-in-vertical .elementor-item:before{border-radius:0 20px 20px 0;}.elementor-3466 .elementor-element.elementor-element-966aee8 .e--animation-shutter-in-vertical .elementor-item:after{border-radius:20px 0 0 20px;}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--dropdown a:hover,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--dropdown a.elementor-item-active,
					.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--dropdown a.highlighted{background-color:var( --e-global-color-aab56a4 );}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--dropdown{border-radius:15px 15px 15px 15px;}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--dropdown li:first-child a{border-top-left-radius:15px;border-top-right-radius:15px;}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--dropdown li:last-child a{border-bottom-right-radius:15px;border-bottom-left-radius:15px;}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main .elementor-nav-menu--dropdown, .elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu__container.elementor-nav-menu--dropdown{box-shadow:5px 0px 29px 9px rgba(0, 0, 0, 0.09);}.elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-3466 .elementor-element.elementor-element-966aee8 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:20px !important;}.elementor-3466 .elementor-element.elementor-element-8d92d32{--display:flex;--justify-content:flex-end;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-3466 .elementor-element.elementor-element-8d92d32.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3466 .elementor-element.elementor-element-522dbc3 .elementor-icon-wrapper{text-align:center;}.elementor-3466 .elementor-element.elementor-element-522dbc3 .elementor-icon{font-size:31px;padding:12px;border-width:2px 2px 2px 2px;}.elementor-3466 .elementor-element.elementor-element-522dbc3 .elementor-icon svg{height:31px;}.elementor-3466 .elementor-element.elementor-element-f02f011{--display:flex;--justify-content:flex-end;}.elementor-3466 .elementor-element.elementor-element-f02f011.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3466 .elementor-element.elementor-element-0b0f152 .elementor-heading-title{font-size:14px;}@media(min-width:768px){.elementor-3466 .elementor-element.elementor-element-994c9bc{--width:15%;}.elementor-3466 .elementor-element.elementor-element-4b77658{--width:85%;}.elementor-3466 .elementor-element.elementor-element-856e1fa{--width:80%;}.elementor-3466 .elementor-element.elementor-element-15946b7{--width:94.785%;}.elementor-3466 .elementor-element.elementor-element-c9b8528{--width:12%;}.elementor-3466 .elementor-element.elementor-element-4351ff7{--width:21%;}.elementor-3466 .elementor-element.elementor-element-94c8c8e{--width:48%;}.elementor-3466 .elementor-element.elementor-element-8d92d32{--width:7%;}.elementor-3466 .elementor-element.elementor-element-f02f011{--width:12%;}}/* Start custom CSS for html, class: .elementor-element-f15add2 */.cssbuttons-io-button {
  background: #a370f0;
  color: white;
  font-family: inherit;
  padding: 0.35em;
  padding-left: 1.2em;
  font-size: 18px;
  font-weight: 500;
  border-radius: 0.7em;
  border: none;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  box-shadow: inset 0 0 1.6em -0.6em #714da6;
  overflow: hidden;
  position: relative;
  height: 2.8em;
  padding-right: 3.3em;
  cursor: pointer;
}

.cssbuttons-io-button .icon {
  background: white;
  margin-left: 1em;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.2em;
  width: 2.2em;
  border-radius: 0.7em;
  box-shadow: 0.1em 0.1em 0.6em 0.2em #7b52b9;
  right: 0.3em;
  transition: all 0.3s;
}

.cssbuttons-io-button:hover .icon {
  width: calc(100% - 0.6em);
}

.cssbuttons-io-button .icon svg {
  width: 1.1em;
  transition: transform 0.3s;
  color: #7b52b9;
}

.cssbuttons-io-button:hover .icon svg {
  transform: translateX(0.1em);
}

.cssbuttons-io-button:active .icon {
  transform: scale(0.95);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-320c79e */.cssbuttons-io-button {
  background: #a370f0;
  color: white;
  font-family: inherit;
  padding: 0.35em;
  padding-left: 1.2em;
  font-size: 18px;
  font-weight: 500;
  border-radius: 0.7em;
  border: none;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  box-shadow: inset 0 0 1.6em -0.6em #714da6;
  overflow: hidden;
  position: relative;
  height: 2.8em;
  padding-right: 3.3em;
  cursor: pointer;
}

.cssbuttons-io-button .icon {
  background: white;
  margin-left: 1em;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.2em;
  width: 2.2em;
  border-radius: 0.7em;
  box-shadow: 0.1em 0.1em 0.6em 0.2em #7b52b9;
  right: 0.3em;
  transition: all 0.3s;
}

.cssbuttons-io-button:hover .icon {
  width: calc(100% - 0.6em);
}

.cssbuttons-io-button .icon svg {
  width: 1.1em;
  transition: transform 0.3s;
  color: #7b52b9;
}

.cssbuttons-io-button:hover .icon svg {
  transform: translateX(0.1em);
}

.cssbuttons-io-button:active .icon {
  transform: scale(0.95);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-69680f5 *//* From Uiverse.io by Li-Deheng */ 
.btn-conteiner {
  display: flex;
  justify-content: center;
  --color-text: #ffffff;
  --color-text-hover: #ffffff;
  --color-background: #808080;
  --color-outline: #0da8ab;
}

.btn-content {
  display: flex;
  align-items: center;
  padding: 5px 30px;
  text-decoration: none;
  height: 50px;
  font-weight: 600;
  font-size: 16px;
  color: var(--color-text);
  background: var(--color-background);
  transition: 1s;
  box-shadow: 0 0 0.2em 0 var(--color-background);
}

.btn-content:hover {
  color: var(--color-text-hover);

}

.btn-content .icon-arrow {
  transition: 0.5s;
  margin-right: 0px;
  transform: scale(0.6);
}

.btn-content:hover .icon-arrow {
  transition: 0.5s;
  margin-right: 25px;
}

.icon-arrow {
  width: 20px;
  margin-left: 15px;
  position: relative;
  top: 6%;
}
  
/* SVG */
#arrow-icon-one {
  transition: 0.4s;
  transform: translateX(-60%);
}

#arrow-icon-two {
  transition: 0.5s;
  transform: translateX(-30%);
}

.btn-content:hover #arrow-icon-three {
  animation: color_anim 1s infinite 0.2s;
}

.btn-content:hover #arrow-icon-one {
  transform: translateX(0%);
  animation: color_anim 1s infinite 0.6s;
}

.btn-content:hover #arrow-icon-two {
  transform: translateX(0%);
  animation: color_anim 1s infinite 0.4s;
}

/* SVG animations */
@keyframes color_anim {
  0% {
    fill: white;
  }

  50% {
    fill: var(--color-background);
  }

  100% {
    fill: white;
  }
}

/* Button animations */
@-webkit-keyframes btn-content {
  0% {
    outline: 0.2em solid var(--color-background);
    outline-offset: 0;
  }
}

@keyframes btn-content {
  0% {
    outline: 0.2em solid var(--color-background);
    outline-offset: 0;
  }
}/* End custom CSS */
/* Start custom CSS for search-form, class: .elementor-element-2a7c8b6 */.button {
  --primary: #ff5569;
  --neutral-1: #f7f8f7;
  --neutral-2: #e7e7e7;
  --radius: 14px;

  cursor: pointer;
  border-radius: var(--radius);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  border: none;
  box-shadow: 0 0.5px 0.5px 1px rgba(255, 255, 255, 0.2),
    0 10px 20px rgba(0, 0, 0, 0.2), 0 4px 5px 0px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: all 0.3s ease;
  min-width: 200px;
  padding: 20px;
  height: 68px;
  font-family: "Galano Grotesque", Poppins, Montserrat, sans-serif;
  font-style: normal;
  font-size: 18px;
  font-weight: 600;
}
.button:hover {
  transform: scale(1.02);
  box-shadow: 0 0 1px 2px rgba(255, 255, 255, 0.3),
    0 15px 30px rgba(0, 0, 0, 0.3), 0 10px 3px -3px rgba(0, 0, 0, 0.04);
}
.button:active {
  transform: scale(1);
  box-shadow: 0 0 1px 2px rgba(255, 255, 255, 0.3),
    0 10px 3px -3px rgba(0, 0, 0, 0.2);
}
.button:after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--radius);
  border: 2.5px solid transparent;
  background: linear-gradient(var(--neutral-1), var(--neutral-2)) padding-box,
    linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.45))
      border-box;
  z-index: 0;
  transition: all 0.4s ease;
}
.button:hover::after {
  transform: scale(1.05, 1.1);
  box-shadow: inset 0 -1px 3px 0 rgba(255, 255, 255, 1);
}
.button::before {
  content: "";
  inset: 7px 6px 6px 6px;
  position: absolute;
  background: linear-gradient(to top, var(--neutral-1), var(--neutral-2));
  border-radius: 30px;
  filter: blur(0.5px);
  z-index: 2;
}
.state p {
  display: flex;
  align-items: center;
  justify-content: center;
}
.state .icon {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  transform: scale(1.25);
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.state .icon svg {
  overflow: visible;
}

/* Outline */
.outline {
  position: absolute;
  border-radius: inherit;
  overflow: hidden;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.4s ease;
  inset: -2px -3.5px;
}
.outline::before {
  content: "";
  position: absolute;
  inset: -100%;
  background: conic-gradient(
    from 180deg,
    transparent 60%,
    white 80%,
    transparent 100%
  );
  animation: spin 2s linear infinite;
  animation-play-state: paused;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.button:hover .outline {
  opacity: 1;
}
.button:hover .outline::before {
  animation-play-state: running;
}

/* Letters */
.state p span {
  display: block;
  opacity: 0;
  animation: slideDown 0.8s ease forwards calc(var(--i) * 0.03s);
}
.button:hover p span {
  opacity: 1;
  animation: wave 0.5s ease forwards calc(var(--i) * 0.02s);
}
.button:focus p span {
  opacity: 1;
  animation: disapear 0.6s ease forwards calc(var(--i) * 0.03s);
}
@keyframes wave {
  30% {
    opacity: 1;
    transform: translateY(4px) translateX(0) rotate(0);
  }
  50% {
    opacity: 1;
    transform: translateY(-3px) translateX(0) rotate(0);
    color: var(--primary);
  }
  100% {
    opacity: 1;
    transform: translateY(0) translateX(0) rotate(0);
  }
}
@keyframes slideDown {
  0% {
    opacity: 0;
    transform: translateY(-20px) translateX(5px) rotate(-90deg);
    color: var(--primary);
    filter: blur(5px);
  }
  30% {
    opacity: 1;
    transform: translateY(4px) translateX(0) rotate(0);
    filter: blur(0);
  }
  50% {
    opacity: 1;
    transform: translateY(-3px) translateX(0) rotate(0);
  }
  100% {
    opacity: 1;
    transform: translateY(0) translateX(0) rotate(0);
  }
}
@keyframes disapear {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translateX(5px) translateY(20px);
    color: var(--primary);
    filter: blur(5px);
  }
}

/* Plane */
.state--default .icon svg {
  animation: land 0.6s ease forwards;
}
.button:hover .state--default .icon {
  transform: rotate(45deg) scale(1.25);
}
.button:focus .state--default svg {
  animation: takeOff 0.8s linear forwards;
}
.button:focus .state--default .icon {
  transform: rotate(0) scale(1.25);
}
@keyframes takeOff {
  0% {
    opacity: 1;
  }
  60% {
    opacity: 1;
    transform: translateX(70px) rotate(45deg) scale(2);
  }
  100% {
    opacity: 0;
    transform: translateX(160px) rotate(45deg) scale(0);
  }
}
@keyframes land {
  0% {
    transform: translateX(-60px) translateY(30px) rotate(-50deg) scale(2);
    opacity: 0;
    filter: blur(3px);
  }
  100% {
    transform: translateX(0) translateY(0) rotate(0);
    opacity: 1;
    filter: blur(0);
  }
}

/* Contrail */
.state--default .icon:before {
  content: "";
  position: absolute;
  top: 50%;
  height: 2px;
  width: 0;
  left: -5px;
  background: linear-gradient(to right, transparent, rgba(0, 0, 0, 0.5));
}
.button:focus .state--default .icon:before {
  animation: contrail 0.8s linear forwards;
}
@keyframes contrail {
  0% {
    width: 0;
    opacity: 1;
  }
  8% {
    width: 15px;
  }
  60% {
    opacity: 0.7;
    width: 80px;
  }
  100% {
    opacity: 0;
    width: 160px;
  }
}

/* States */
.state {
  padding-left: 29px;
  z-index: 2;
  display: flex;
  position: relative;
}
.state--default span:nth-child(4) {
  margin-right: 5px;
}
.state--sent {
  display: none;
}
.state--sent svg {
  transform: scale(1.25);
  margin-right: 8px;
}
.button:focus .state--default {
  position: absolute;
}
.button:focus .state--sent {
  display: flex;
}
.button:focus .state--sent span {
  opacity: 0;
  animation: slideDown 0.8s ease forwards calc(var(--i) * 0.2s);
}
.button:focus .state--sent .icon svg {
  opacity: 0;
  animation: appear 1.2s ease forwards 0.8s;
}
@keyframes appear {
  0% {
    opacity: 0;
    transform: scale(4) rotate(-40deg);
    color: var(--primary);
    filter: blur(4px);
  }
  30% {
    opacity: 1;
    transform: scale(0.6);
    filter: blur(1px);
  }
  50% {
    opacity: 1;
    transform: scale(1.2);
    filter: blur(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}/* End custom CSS */