/* Extracted inline styles from the Imaginate Solutions pages. */
.x-1 { background-image:linear-gradient(to right, var(--brand-foreground) 1px, transparent 1px), linear-gradient(to bottom, var(--brand-foreground) 1px, transparent 1px);background-size:44px 44px;mask-image:radial-gradient(120% 90% at 70% 15%, black, transparent 78%);-webkit-mask-image:radial-gradient(120% 90% at 70% 15%, black, transparent 78%); }
.x-2 { width:55%; }
.x-3 { width:35%; }
.x-4 { width:70%; }
.x-5 { width:40%; }
.x-6 { width:80%; }
.x-7 { width:62%; }

img.site-logo {
    filter: invert(1);
    width: 120px;
}
img.footer-site-logo {
    width: 120px;
}

ul.social-links li.social-icon {
    border: 1px solid #fff;
    border-radius: 25px;
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.plugins-hero {
    border-bottom: 1px solid var(--hairline);
    background: linear-gradient(90deg, var(--surface-alt), var(--surface) 58%, 
color-mix(in oklab, var(--ember) 10%, var(--surface)));
}

.plugin-media {
    display: grid;
    place-items: center;
    margin: -0.15rem -0.15rem 1rem;
    aspect-ratio: 1 / 1;
    border-radius: 0.625rem;
    border: 1px solid var(--hairline);
    background: linear-gradient(135deg, 
color-mix(in oklab, var(--brand) 9%, var(--surface)), var(--surface) 62%), var(--surface);
    overflow: hidden;
}