@font-face {
    font-family: "Dancing Script";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("/fonts/DancingScript-Bold.woff2") format("woff2"),
      url("/fonts/DancingScript-Bold.woff2") format("woff");
}

.beautiful {
    font-weight: var(--font-weight-semi-bold);
    font-variation-settings: 'wght' var(--font-weight-semi-bold);
    transition: background-image 0.5s ease;
    background: linear-gradient(45deg, var(--accent-color), #7239B3, #FF385A);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent
}

.delightful {
    transition: color 0.5s ease;
    color: var(--accent-color);
    font-family: "Dancing Script";
    font-weight: var(--font-weight-bold);
}

.cta {
    margin-top: 1.5rem;
}

@media (prefers-color-scheme: dark) {
    .beautiful {
        background: linear-gradient(45deg, var(--accent-color), #39e2c6, #8eec14);
        background-clip: text;
        -webkit-background-clip: text;
    }
}

@media (prefers-reduced-motion: reduce) {
    .beautiful {
        transition: none;
    }

    .delightful {
        transition: none;
    }
}