.ct-art {
    --ct-art-brand: #3632e8;
    --ct-art-panel: #222087;
    --ct-art-ink: #fff;
    --ct-art-muted: #dcdcff;
    --ct-art-accent: #c6f6df;
    --ct-art-space: clamp(1.5rem, 4vw, 3rem);
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    min-height: 380px;
    aspect-ratio: 1;
    overflow: hidden;
    isolation: isolate;
    padding: var(--ct-art-space);
    background: linear-gradient(145deg, var(--ct-art-brand), #b8b7ff);
    text-align: center;
    line-height: 1.5;
}
.ct-art::before, .ct-art::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 42%;
    height: 75%;
    background-image: linear-gradient(#d4d3ff 1px, transparent 1px), linear-gradient(90deg, #d4d3ff 1px, transparent 1px);
    background-size: 13px 13px;
    opacity: .5;
    transform: rotate(23deg);
}
.ct-art::before { left: -16%; top: 5%; }
.ct-art::after { right: -14%; bottom: -15%; }
.ct-art-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.35rem;
    width: 100%;
    min-height: 100%;
    padding: 2rem 1.4rem;
    border: 1px solid #ffffff1f;
    border-radius: 24px;
    background: var(--ct-art-panel);
    color: var(--ct-art-ink);
    box-shadow: 0 12px 32px #1f1d7b26;
}
.ct-art-eyebrow { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ct-art-muted); }
.ct-art-title { white-space: pre-line; font-size: clamp(1.7rem, 2.8vw, 2.5rem); font-weight: 700; line-height: 1.16; letter-spacing: -.035em; overflow-wrap: break-word; }
.ct-art-description { max-width: 29ch; font-size: .95rem; line-height: 1.5; color: var(--ct-art-muted); }
.ct-art-cta { display: inline-flex; align-items: center; gap: 1rem; border-radius: 999px; padding: .75rem 1.25rem; background: var(--ct-art-accent); color: #153d31; font-size: .9rem; font-weight: 700; }
.ct-art-meta { font-size: .8rem; color: var(--ct-art-muted); }
.ct-art--hub { min-height: 100%; aspect-ratio: auto; background: #ddddff; }
@media (max-width: 575px) {
    .ct-art { min-height: 330px; padding: 1.5rem; }
    .ct-art-panel { padding: 1.7rem 1.25rem; gap: 1.1rem; }
    .ct-art-title { font-size: 1.9rem; }
}