.bard {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--spacer-2)
}

@media(min-width: 43.75rem) {
    .bard {
        margin:0 auto;
        max-width: 1496px;
        padding: calc(var(--spacer-sections)*1) var(--spacer-3) 0
    }
}

.bard__content {
    position: relative;
    flex-direction: column;
    width: 100%;
    height: 100%;
    border-radius: 3.125rem;
    gap: 1.5625rem;
    padding: 4.375rem 2.1875rem;
    overflow: hidden;
    background: linear-gradient(262deg, #f65661 -0.01%, #127cfb 99.99%)
}

@media(min-width: 43.75rem) {
    .bard__content {
        gap:2.875rem;
        padding: 6.25rem 3.125rem;
        border-radius: 10.625rem
    }
}

@media(min-width: 64rem) {
    .bard__content {
        padding:8.125rem 4.375rem
    }
}

.bard__content__meta {
    display: flex;
    flex-direction: column;
    gap: 1.25rem
}

@media(min-width: 64rem) {
    .bard__content__meta {
        gap:2.5rem
    }
}

.bard__content .t-paragraph {
    max-width: 800px
}

.bard__content .glue-headline {
    color: #fff;
    position: initial;
    z-index: 2;
    max-width: 980px
}

@media(max-width: 43.6875rem) {
    .bard__content .glue-headline {
        font-size:2.25rem
    }
}

.bard__content p {
    margin: 0
}

@media(max-width: 43.6875rem) {
    .bard__content p {
        font-size:1rem
    }
}

.bard__content p,.bard__content a {
    position: relative;
    z-index: 2;
    color: #fff;
    text-align: center
}

.bard__content .custom-button {
    --background: transparent
}

@media(hover: hover) {
    .bard__content .custom-button:hover {
        --background: white
    }
}

@media(max-width: 43.6875rem) {
    .bard__content .custom-button.glue-button.glue-button--icon-right {
        padding:0 15px
    }
}