/*
Theme Name: Solis & Luna
Theme URI: https://www.solisandluna.co.za/
Author: Solis & Luna Consulting (Pty) Ltd
Author URI: https://www.solisandluna.co.za/
Description: A South African technology studio theme — websites, e-commerce and custom software, backed by ITSM, POPIA and cybersecurity discipline. Built for SEO and generative-engine (AI answer) visibility, with transparent pricing, credential and case-study modules.
Version: 1.7.1
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: solisluna
Tags: business, portfolio, one-column, two-columns, custom-logo, custom-menu, featured-images, block-styles, wide-blocks, translation-ready
*/

/* Design tokens. Layout and components live in assets/css/main.css. */

:root {
	/*
	 * Sampled directly from the Solis & Luna logo: #20A8F8 is the "SOLIS" blue,
	 * #C9CFD6 the "LUNA" grey. The identity is light and airy, so the palette
	 * keeps white as the dominant surface and uses blue as the single accent.
	 */
	--sl-brand:       #20A8F8;   /* Logo blue. Fills and large graphics only —   */
	                             /* at 2.6:1 on white it is too light for text.  */
	--sl-brand-deep:  #0A7CC0;   /* 4.5:1 on white — links and small text.       */
	--sl-brand-dark:  #06598C;   /* Hover, and text on tinted backgrounds.       */
	--sl-brand-tint:  #EAF6FE;
	--sl-brand-tint2: #D3EAFB;

	/* Ink is a soft charcoal, never black — black against this blue reads harsh. */
	--sl-ink:        #26313D;
	--sl-ink-soft:   #33414F;

	--sl-text:       #3C4A57;
	--sl-text-soft:  #5B6875;
	--sl-text-mute:  #8592A0;
	--sl-grey:       #C9CFD6;    /* The "LUNA" grey. */

	--sl-bg:         #FFFFFF;
	--sl-surface:    #F5F9FC;
	--sl-surface-2:  #E9F1F7;
	--sl-line:       #E1E9F0;
	--sl-line-soft:  #EDF3F8;

	--sl-on-brand:      #FFFFFF;
	--sl-on-brand-soft: #D8EEFC;

	--sl-ok:         #0E7C5A;
	--sl-warn:       #B4610A;

	/* The rainbow dots in the logo's heart mark, for one thin decorative rule. */
	--sl-spectrum: linear-gradient(90deg,
		#F04E4E 0%, #F5A623 18%, #F7D046 34%,
		#4CC97A 52%, #20A8F8 70%, #6C6CE5 86%, #B563E0 100%);

	--sl-radius:     14px;
	--sl-radius-lg:  22px;
	--sl-radius-sm:  9px;

	--sl-shadow:     0 1px 2px rgba(38,49,61,.04), 0 8px 24px -14px rgba(38,49,61,.16);
	--sl-shadow-lg:  0 2px 4px rgba(38,49,61,.04), 0 24px 60px -28px rgba(38,49,61,.22);
	--sl-shadow-blue: 0 10px 30px -14px rgba(32,168,248,.45);

	--sl-font:       "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--sl-font-head:  "Plus Jakarta Sans", var(--sl-font);
	--sl-font-mono:  ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;

	--sl-wrap:       1180px;
	--sl-wrap-tight: 820px;
	--sl-gutter:     clamp(1rem, 4vw, 2.5rem);
	--sl-section:    clamp(3.5rem, 8vw, 6.5rem);
}