/*  COMPONENT: CALL TO ACTION
//////////////////////////////////////////////////////////////////////////////*/

@layer components {
    .cta {
    }
    .cta h3 {
        font-size: var(--font-size-l);
        line-height: var(--line-height-l);
        margin-bottom: var(--spacing-s);
        font-weight: 900;
    }
    .cta ul {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        gap: var(--spacing-s);
    }
    .cta a {
        display: grid;
        place-items: center;
        width: fit-content;
        height: 40px;
        padding: 0.25rem 1.25rem;

        text-decoration: none;

        border: 2px solid;
        border-radius: 2rem;

        font-size: var(--font-size-s);
        font-weight: 700;
    }
}