/* Spotlight — Style Background compatibility only.
   Keeps the passed design colour field and layers Core patterns above it. */
.bjc-studio-design-core-designs-spotlight { --bjc-design-base-background:linear-gradient(120deg,#101b2c 0%,#192c42 53%,#f6eee2 53.1%,#f6eee2 100%); }
.bjc-studio-design-core-designs-spotlight.bjc-studio-arrangement-text-left { --bjc-design-base-background:linear-gradient(245deg,#101b2c 0%,#192c42 53%,#f6eee2 53.1%,#f6eee2 100%); }
.bjc-studio-design-core-designs-spotlight.bjc-studio-arrangement-media-above,
.bjc-studio-design-core-designs-spotlight.bjc-studio-arrangement-text-above { --bjc-design-base-background:linear-gradient(180deg,#15253b 0%,#15253b 48%,#f6eee2 48.1%,#f6eee2 100%); }
@media(max-width:767px) { .bjc-studio-design-core-designs-spotlight { --bjc-design-base-background:linear-gradient(180deg,#15253b 0%,#15253b 48%,#f6eee2 48.1%,#f6eee2 100%); } }


/* Style Background compatibility: preserve this design's own colour field as the
   bottom background layer while Core's selected pattern remains above it. */
.bjc-studio-design-core-designs-spotlight.bjc-studio-background-soft-circles {
    background-image:
        radial-gradient(circle var(--bjc-studio-bg-scale) at 16% 28%, color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 0 98%, transparent 100%),
        radial-gradient(circle var(--bjc-studio-bg-scale) at 38% 76%, color-mix(in srgb,var(--bjc-studio-bg-secondary) var(--bjc-studio-bg-strength),transparent) 0 98%, transparent 100%),
        radial-gradient(circle var(--bjc-studio-bg-scale) at 74% 24%, color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 0 98%, transparent 100%),
        radial-gradient(circle var(--bjc-studio-bg-scale) at 88% 72%, color-mix(in srgb,var(--bjc-studio-bg-secondary) var(--bjc-studio-bg-strength),transparent) 0 98%, transparent 100%),
        var(--bjc-design-base-background) !important;
}
.bjc-studio-design-core-designs-spotlight.bjc-studio-background-corner-glow {
    background-image:
        radial-gradient(circle at 0 0, color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent), transparent 38%),
        radial-gradient(circle at 100% 100%, color-mix(in srgb,var(--bjc-studio-bg-secondary) var(--bjc-studio-bg-strength),transparent), transparent 38%),
        var(--bjc-design-base-background) !important;
}
.bjc-studio-design-core-designs-spotlight.bjc-studio-background-angled-panels {
    background-image:
        linear-gradient(125deg, color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 0 24%, transparent 24% 68%, color-mix(in srgb,var(--bjc-studio-bg-secondary) var(--bjc-studio-bg-strength),transparent) 68% 100%),
        var(--bjc-design-base-background) !important;
}
.bjc-studio-design-core-designs-spotlight.bjc-studio-background-dots {
    background-image:
        radial-gradient(circle,color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 1.6px,transparent 1.8px),
        var(--bjc-design-base-background) !important;
}
.bjc-studio-design-core-designs-spotlight.bjc-studio-background-grid {
    background-image:
        linear-gradient(color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 1px,transparent 1px),
        var(--bjc-design-base-background) !important;
}
.bjc-studio-design-core-designs-spotlight.bjc-studio-background-diagonal-lines {
    background-image:
        repeating-linear-gradient(135deg, color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 0 2px, transparent 2px calc(var(--bjc-studio-bg-scale) / 2)),
        var(--bjc-design-base-background) !important;
}
.bjc-studio-design-core-designs-spotlight.bjc-studio-background-crosshatch {
    background-image:
        repeating-linear-gradient(45deg,color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 0 1px,transparent 1px calc(var(--bjc-studio-bg-scale) / 2)),
        repeating-linear-gradient(-45deg,color-mix(in srgb,var(--bjc-studio-bg-accent) var(--bjc-studio-bg-strength),transparent) 0 1px,transparent 1px calc(var(--bjc-studio-bg-scale) / 2)),
        var(--bjc-design-base-background) !important;
}