/* Buttons */
.btn {
    display: inline-block;
    font-family: var(--font-h);
    font-weight: var(--weight-body-bold);
    font-size: var(--type-button);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: var(--control-y) var(--control-x);
    clip-path: polygon(8% 0, 92% 0, 100% 50%, 92% 100%, 8% 100%, 0 50%);
    cursor: pointer;
    border: none;
    transition: transform 0.25s ease, filter 0.25s ease;
}

.btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.1);
}

.btn-blue {
    background: linear-gradient(160deg, var(--blue-dark) 45%, var(--blue) 45%);
    color: #fff;
}

.btn-red {
    background: linear-gradient(160deg, #c42025 45%, var(--red) 45%);
    color: #fff;
}

.btn-green {
    background: linear-gradient(160deg, #15b07a 45%, var(--green) 45%);
    color: #fff;
}


.btn-outline {
    position: relative;
    background: transparent;
    color: rgba(255,255,255,0.78);
    overflow: visible;
    isolation: isolate;
    
}


.btn-outline::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.42);
    clip-path: shape(from 91.13% 0%,curve to 93.09% 4.14% with 91.94% 0%/92.69% 1.58%,line to 99.69% 45.81%,curve to 99.69% 54.19% with 100.1% 48.4%/100.1% 51.6%,line to 93.09% 95.86%,curve to 91.13% 100% with 92.69% 98.42%/91.94% 100%,hline to 8.87%,curve to 6.91% 95.86% with 8.06% 100%/7.32% 98.42%,line to 0.31% 54.19%,curve to 0.31% 45.81% with -0.1% 51.6%/-0.1% 48.4%,line to 6.91% 4.14%,curve to 8.87% 0% with 7.32% 1.58%/8.06% 0%,hline to 91.13%,close,move to 10.45% 10.02%,curve to 8.49% 14.16% with 9.65% 10.02%/8.9% 11.6%,line to 3.48% 45.76%,curve to 3.49% 54.21% with 3.07% 48.38%/3.07% 51.61%,line to 8.49% 85.08%,curve to 10.44% 89.16% with 8.9% 87.61%/9.64% 89.16%,line to 50% 88.83%,line to 89.56% 89.16%,curve to 91.51% 85.08% with 90.36% 89.16%/91.1% 87.61%,line to 96.51% 54.21%,curve to 96.52% 45.76% with 96.93% 51.61%/96.93% 48.38%,line to 91.51% 14.16%,curve to 89.55% 10.02% with 91.1% 11.6%/90.35% 10.02%,hline to 10.45%,close);
    z-index: -1;
    
}

.btn-outline:hover::before {
    background: rgba(255,255,255,0.8);
}

.btn-outline:hover {
    color: #fff;
}