/**
 * Liberty Web Kits - design tokens.
 *
 * Single source of truth for the visual system. Mirrored into Elementor's
 * global colours and fonts so the builder and the theme cannot drift.
 *
 * Palette is owner-specified and must not be substituted.
 */

:root {
	/* --- Surfaces --------------------------------------------------- */
	--lwk-bg:            #05070D;
	--lwk-bg-2:          #090D17;
	--lwk-surface:       #0D1220;
	--lwk-surface-2:     #121A2C;

	/* --- Brand ------------------------------------------------------ */
	--lwk-purple:        #7C3AED;
	--lwk-violet:        #A855F7;
	--lwk-blue:          #3B82F6;
	--lwk-cyan:          #22D3EE;

	/* Reserved strictly for bundle / premium highlights. */
	--lwk-gold:          #E4B95B;

	/* --- Text ------------------------------------------------------- */
	--lwk-text:          #FFFFFF;
	--lwk-text-2:        #A8B0C0;
	--lwk-text-3:        #747D90;

	/* --- Lines ------------------------------------------------------ */
	--lwk-border:        rgba(255, 255, 255, 0.08);
	--lwk-border-strong: rgba(255, 255, 255, 0.16);

	/* --- Gradients -------------------------------------------------- */
	--lwk-grad-primary:  linear-gradient(135deg, #7C3AED, #3B82F6);
	--lwk-grad-rich:     linear-gradient(135deg, #A855F7, #6366F1, #3B82F6);

	/* --- Typography ------------------------------------------------- */
	--lwk-font-display: "Sora", ui-sans-serif, system-ui, -apple-system,
	                    "Segoe UI", Roboto, sans-serif;
	--lwk-font-body:    "Manrope", ui-sans-serif, system-ui, -apple-system,
	                    "Segoe UI", Roboto, sans-serif;

	--lwk-fs-body:      1rem;      /* 16px */
	--lwk-fs-lead:      1.125rem;  /* 18px */

	/* Fluid display sizes. clamp() keeps the 8 target breakpoints legible
	   without a cascade of per-breakpoint overrides. */
	--lwk-fs-hero:      clamp(2.125rem, 1.30rem + 3.9vw, 5rem);   /* 34 -> 80 */
	--lwk-fs-h2:        clamp(1.625rem, 1.25rem + 1.7vw, 3rem);   /* 26 -> 48 */
	--lwk-fs-h3:        clamp(1.125rem, 0.98rem + 0.7vw, 1.625rem);
	--lwk-fs-product:   clamp(1.125rem, 1.02rem + 0.5vw, 1.5rem); /* 18 -> 24 */

	/* --- Layout ----------------------------------------------------- */
	--lwk-container:    1280px;
	--lwk-container-wide: 1440px;
	--lwk-gutter:       24px;
	--lwk-section-y:    120px;

	/* --- Shape ------------------------------------------------------ */
	--lwk-radius-sm:    10px;   /* buttons */
	--lwk-radius:       14px;   /* cards */
	--lwk-radius-lg:    20px;   /* feature panels */

	/* --- Depth ------------------------------------------------------ */
	--lwk-shadow-card:  0 1px 0 rgba(255, 255, 255, 0.04) inset;
	--lwk-shadow-lift:  0 18px 40px -18px rgba(0, 0, 0, 0.8);
	--lwk-glow-purple:  0 0 60px -12px rgba(124, 58, 237, 0.45);

	/* --- Motion ----------------------------------------------------- */
	--lwk-ease:         cubic-bezier(0.22, 0.61, 0.36, 1);
	--lwk-dur:          220ms;
}

@media (max-width: 1024px) {
	:root {
		--lwk-section-y: 80px;
	}
}

@media (max-width: 767px) {
	:root {
		--lwk-section-y: 60px;
		--lwk-gutter:    20px;
	}
}

/*
 * The marketplace is a committed dark interface: it does not follow the
 * visitor's light/dark preference. The palette above is the design, not a
 * default. Colours are therefore declared once, explicitly, with no
 * prefers-color-scheme branch.
 */