.button {
  position: relative;
  z-index: 1;
  border-radius: 5.491vw
    /*80px*/
  ;
  background: var(--Black);
  color: var(--White);
  padding: 0 2.196vw
    /*32px*/
    0.137vw
    /*2px*/
    2.196vw
    /*32px*/
  ;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.549vw
    /*8px*/
  ;
  height: 4.942vw
    /*72px*/
  ;
  cursor: pointer;
  border: none;
  overflow: hidden;
}

body.-apple .button {
  padding-top: 4px;
  padding-bottom: 1px;
}

.button.-disabled,
.button:disabled {
  opacity: 0.2;
  pointer-events: none;
}

.circle-arrow {
  position: relative;
  z-index: 1;
  display: flex;
  width: 1.235vw
    /*18px*/
  ;
  aspect-ratio: 1/1;
  height: fit-content;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.circle-arrow__inner {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.3s, transform 0.3s;
  background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggNkwxMSA5TDggMTIiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
}

.circle-arrow:before,
.circle-arrow:after {
  content: '';
  display: block;
  width: 100%;
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  border-radius: 50%;
  background: var(--Green);
  transition: transform 0.3s, opacity 0.3s;
  transition-timing-function: ease-in;
  aspect-ratio: 1/1;
}

.circle-arrow:before {
  opacity: 0.3;
  transition: transform 0.3s, opacity 0.3s;
  transition-timing-function: ease-in;
  transform: scale(0.66);
  transition-delay: 0.15s;
}

.circle-arrow:after {
  transform: scale(0.33);
}

.button:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.4s;
  pointer-events: none;
  background: rgba(255, 255, 255, 0.10);
}



.button.-border {
  border: 1px solid var(--Grey, #B4C3D3);
  color: var(--Black, #000);
  background: none;
  transition: border 0.4s;
}

.button.-border:before {
  display: none;
}

.button.-border.-disabled,
.button.-border:disabled {
  opacity: 0.3;
}

.border-link,
.link-in-text a {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  transition: color 0.4s, border 0.4s;
  color: var(--Black);
  width: fit-content;
}

.copy-button {
  border-radius: 2.745vw
    /*40px*/
  ;
  border: 1px solid var(--white-20, rgba(255, 255, 255, 0.20));
  background: var(--white-10, rgba(255, 255, 255, 0.10));
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);

  display: flex;
  justify-content: center;
  align-items: center;
  transition: background 0.4s;
  height: 2.745vw
    /*40px*/
  ;
  min-width: 7.687vw
    /*112px*/
  ;
  padding: 0 1.030vw
    /*15px*/
    1px 1.030vw
    /*15px*/
  ;
  width: fit-content;
  cursor: pointer;
  color: var(--White);
  user-select: none;
}

.copy-button .visible-text,
.copy-button .hidden-text {
  gap: 0.275vw
    /*4px*/
  ;

  display: flex;
  justify-content: center;
  align-items: center;
  transition: opacity 0.4s;
  color: var(--White);
}

.copy-button .visible-text:before,
.copy-button .hidden-text:before {
  content: '';
  display: block;
  width: 1.373vw
    /*20px*/
  ;
  aspect-ratio: 1/1;
  margin-top: 0.137vw
    /*2px*/
  ;
  background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuMyAzLjc4VjEyLjMzMzNDNS4yOTk4NyAxMy4xNzk2IDUuNjEzNiAxMy45OTQzIDYuMTc3NTUgMTQuNjEyMUM2Ljc0MTUgMTUuMjI5OCA3LjUxMzQ0IDE1LjYwNDUgOC4zMzY4IDE1LjY2TDguNTUgMTUuNjY2N0gxNC4yODgyQzE0LjE1MzggMTYuMDU2NiAxMy45MDQ5IDE2LjM5NDEgMTMuNTc1NyAxNi42MzI5QzEzLjI0NjUgMTYuODcxNyAxMi44NTMyIDE2Ljk5OTkgMTIuNDUgMTdINy45QzYuODY1NjYgMTcgNS44NzM2OCAxNi41Nzg2IDUuMTQyMjggMTUuODI4NEM0LjQxMDg5IDE1LjA3ODMgNCAxNC4wNjA5IDQgMTNWNS42NjY2N0MzLjk5OTc5IDUuMjUyOSA0LjEyNDcxIDQuODQ5MjUgNC4zNTc1NCA0LjUxMTM1QzQuNTkwMzcgNC4xNzM0NCA0LjkxOTY1IDMuOTE3OTIgNS4zIDMuNzhaTTE1LjA1IDFDMTUuNTY3MiAxIDE2LjA2MzIgMS4yMTA3MSAxNi40Mjg5IDEuNTg1NzlDMTYuNzk0NiAxLjk2MDg2IDE3IDIuNDY5NTcgMTcgM1YxMi4zMzMzQzE3IDEyLjg2MzggMTYuNzk0NiAxMy4zNzI1IDE2LjQyODkgMTMuNzQ3NUMxNi4wNjMyIDE0LjEyMjYgMTUuNTY3MiAxNC4zMzMzIDE1LjA1IDE0LjMzMzNIOC41NUM4LjAzMjgzIDE0LjMzMzMgNy41MzY4NCAxNC4xMjI2IDcuMTcxMTQgMTMuNzQ3NUM2LjgwNTQ1IDEzLjM3MjUgNi42IDEyLjg2MzggNi42IDEyLjMzMzNWM0M2LjYgMi40Njk1NyA2LjgwNTQ1IDEuOTYwODYgNy4xNzExNCAxLjU4NTc5QzcuNTM2ODQgMS4yMTA3MSA4LjAzMjgzIDEgOC41NSAxSDE1LjA1WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==);
}

body.-apple .copy-button .visible-text:before,
body.-apple .copy-button .hidden-text:before {
  margin-top: -1px;
}

.copy-button .hidden-text:before {
  background: no-repeat center / contain url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwIDJDOC42MTU1MyAyIDcuMjYyMTYgMi40MTA1NCA2LjExMTAxIDMuMTc5NzFDNC45NTk4NyAzLjk0ODg4IDQuMDYyNjYgNS4wNDIxMyAzLjUzMjg1IDYuMzIxMjJDMy4wMDMwMyA3LjYwMDMgMi44NjQ0MSA5LjAwNzc2IDMuMTM0NTEgMTAuMzY1NkMzLjQwNDYgMTEuNzIzNSA0LjA3MTI5IDEyLjk3MDggNS4wNTAyNiAxMy45NDk3QzYuMDI5MjIgMTQuOTI4NyA3LjI3NjUgMTUuNTk1NCA4LjYzNDM3IDE1Ljg2NTVDOS45OTIyNCAxNi4xMzU2IDExLjM5OTcgMTUuOTk3IDEyLjY3ODggMTUuNDY3MkMxMy45NTc5IDE0LjkzNzMgMTUuMDUxMSAxNC4wNDAxIDE1LjgyMDMgMTIuODg5QzE2LjU4OTUgMTEuNzM3OCAxNyAxMC4zODQ1IDE3IDlDMTYuOTk4IDcuMTQ0MDkgMTYuMjU5OSA1LjM2NDc1IDE0Ljk0NzYgNC4wNTI0MkMxMy42MzUzIDIuNzQwMDkgMTEuODU1OSAyLjAwMTk2IDEwIDJaTTEzLjA3MzMgNy43NjU1OEw5LjMwNDA0IDExLjUzNDhDOS4yNTQwMyAxMS41ODQ5IDkuMTk0NjUgMTEuNjI0NiA5LjEyOTI4IDExLjY1MTdDOS4wNjM5MSAxMS42Nzg4IDguOTkzODQgMTEuNjkyNyA4LjkyMzA4IDExLjY5MjdDOC44NTIzMiAxMS42OTI3IDguNzgyMjUgMTEuNjc4OCA4LjcxNjg4IDExLjY1MTdDOC42NTE1MSAxMS42MjQ2IDguNTkyMTMgMTEuNTg0OSA4LjU0MjEyIDExLjUzNDhMNi45MjY3MyA5LjkxOTQyQzYuODI1NyA5LjgxODM4IDYuNzY4OTMgOS42ODEzNSA2Ljc2ODkzIDkuNTM4NDZDNi43Njg5MyA5LjM5NTU3IDYuODI1NyA5LjI1ODU0IDYuOTI2NzMgOS4xNTc1QzcuMDI3NzcgOS4wNTY0NiA3LjE2NDgxIDguOTk5NyA3LjMwNzY5IDguOTk5N0M3LjQ1MDU4IDguOTk5NyA3LjU4NzYyIDkuMDU2NDYgNy42ODg2NiA5LjE1NzVMOC45MjMwOCAxMC4zOTI2TDEyLjMxMTMgNy4wMDM2NUMxMi4zNjE0IDYuOTUzNjIgMTIuNDIwOCA2LjkxMzk0IDEyLjQ4NjEgNi44ODY4NkMxMi41NTE1IDYuODU5NzkgMTIuNjIxNiA2Ljg0NTg1IDEyLjY5MjMgNi44NDU4NUMxMi43NjMxIDYuODQ1ODUgMTIuODMzMSA2Ljg1OTc5IDEyLjg5ODUgNi44ODY4NkMxMi45NjM5IDYuOTEzOTQgMTMuMDIzMiA2Ljk1MzYyIDEzLjA3MzMgNy4wMDM2NUMxMy4xMjMzIDcuMDUzNjggMTMuMTYzIDcuMTEzMDcgMTMuMTkwMSA3LjE3ODQ0QzEzLjIxNzEgNy4yNDM4IDEzLjIzMTEgNy4zMTM4NiAxMy4yMzExIDcuMzg0NjFDMTMuMjMxMSA3LjQ1NTM3IDEzLjIxNzEgNy41MjU0MiAxMy4xOTAxIDcuNTkwNzlDMTMuMTYzIDcuNjU2MTYgMTMuMTIzMyA3LjcxNTU1IDEzLjA3MzMgNy43NjU1OFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=);
}

.copy-button .hidden-text {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.copy-button.-active .hidden-text {
  opacity: 1;
  position: relative;
}

.copy-button.-active .visible-text {
  opacity: 0;
  position: absolute;
}

.copy-button.-active {
  pointer-events: none;
}



@media screen and (max-width: 1024px) {
  .button {
    border-radius: clamp(78px, 20.513vw, 82px);
    padding: 20px clamp(27px, 7.179vw, 29px) 20px clamp(27px, 7.179vw, 29px);

    gap: clamp(7px, 2.051vw, 9px);
    height: clamp(62px, 16.410vw, 66px);
  }

  .button .circle-arrow {
    margin-top: clamp(2px, 0.769vw, 3.5px);
  }

  body.-apple .button {
    padding-top: 3px;
    padding-bottom: 0;
  }

  body.-apple .button .circle-arrow {
    margin-top: -1px;
  }

  .circle-arrow {
    width: clamp(15px, 4.103vw, 17px);
  }


  .copy-button {
    border-radius: 40px;
    height: 40px;
    min-width: 112px;
    padding: 0 15px 1px 15px;
  }

  .copy-button .visible-text,
  .copy-button .hidden-text {
    gap: 4px;
  }

  .copy-button .visible-text:before,
  .copy-button .hidden-text:before {
    width: 20px;
    margin-top: 2px;
  }


}

• [F] accordions.css
  Delete
• [F] buttons.css
  Delete
• [F] form-elements.css
  Delete
• [F] typography.css
  Delete
• [F] variables.css
  Delete