/*
Theme Name: Cospixare Academy
Theme URI: https://cospixareacademy.com
Author: Cospixare Technologies
Author URI: https://cospixareacademy.com
Description: Official modern, clean, bright, and professional custom theme for Cospixare Academy (A Unit of Cospixare Technologies). Built to reflect the official Deep Academic Navy and Champagne Gold brand colors, with fast performance, accessibility, SEO optimization, and complete dynamic editability via the Cospixare Academy Core plugin.
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cospixare-academy
Tags: educational, courses, academy, modern, clean, responsive, bright, professional, navy, gold
*/

/* ==========================================================================
   CSS Custom Properties (Official Brand Identity Design Tokens)
   Authentic colors extracted from Cospixare Academy official logo:
   - Deep Academic Navy Blue: #0c2340 / #0f2b48
   - Metallic / Champagne Gold: #c59b4e / #dfb564 / #fbf6ec
   - Admissions Open Emerald: #059669
   - Strictly bright, modern, and professional (NO dark mode/cyberpunk/sci-fi).
   ========================================================================== */
:root {
	/* Core Brand Identity */
	--color-primary: #0c2340;          /* Deep Academic Navy Blue */
	--color-primary-hover: #071629;    /* Midnight Navy on Hover */
	--color-primary-light: #edf3f9;    /* Soft Navy Ice Tint */
	--color-navy-gradient: linear-gradient(135deg, #0c2340 0%, #163b65 100%);

	/* Official Brand Gold */
	--color-gold: #c59b4e;             /* Metallic Champagne Gold */
	--color-gold-hover: #b0883e;       /* Deep Rich Gold */
	--color-gold-light: #fbf7ef;       /* Soft Champagne Tint */
	--color-gold-border: #e8d3a7;      /* Subtle Gold Accent Border */
	--color-gold-gradient: linear-gradient(135deg, #dfb564 0%, #c59b4e 100%);

	/* Semantic Admission Colors */
	--color-success: #059669;          /* Emerald Green for Admissions Open */
	--color-success-bg: #ecfdf5;       /* Light Emerald Badge Background */
	--color-success-border: #a7f3d0;
	--color-closed: #64748b;           /* Neutral Slate for Admissions Closed */
	--color-closed-bg: #f1f5f9;
	--color-closed-border: #cbd5e1;

	/* Neutral / Base Colors */
	--color-bg: #ffffff;
	--color-bg-subtle: #f8fafc;        /* Crisp Pearl Off-White */
	--color-bg-warm: #fcfbfa;          /* Subtle Warm Academy Off-White */
	--color-card-bg: #ffffff;
	--color-border: #e2e8f0;
	--color-border-light: #f1f5f9;

	/* Typography Colors */
	--color-text-main: #0c2340;        /* Deep Academic Navy for Headings */
	--color-text-body: #334155;        /* Balanced Slate for Body Copy */
	--color-text-muted: #64748b;       /* Muted Secondary Text */
	--color-text-inverse: #ffffff;     /* Crisp White */

	/* WhatsApp Brand Color */
	--color-whatsapp: #25d366;
	--color-whatsapp-dark: #128c7e;

	/* Typography System */
	--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

	/* Layout & Spacing */
	--container-max-width: 1200px;
	--container-narrow: 860px;
	--header-height: 84px;
	--radius-sm: 6px;
	--radius-md: 12px;
	--radius-lg: 20px;
	--radius-full: 9999px;

	/* Elevation Shadows */
	--shadow-sm: 0 1px 3px rgba(12, 35, 64, 0.05);
	--shadow-md: 0 4px 8px -2px rgba(12, 35, 64, 0.08), 0 2px 4px -2px rgba(12, 35, 64, 0.04);
	--shadow-lg: 0 12px 24px -4px rgba(12, 35, 64, 0.1), 0 4px 8px -2px rgba(12, 35, 64, 0.04);
	--shadow-card: 0 2px 10px rgba(12, 35, 64, 0.06), 0 1px 3px rgba(12, 35, 64, 0.04);
	--shadow-hover: 0 16px 32px -4px rgba(12, 35, 64, 0.12), 0 6px 12px -2px rgba(12, 35, 64, 0.06);

	/* Transitions */
	--transition-fast: 0.15s ease;
	--transition-normal: 0.25s ease;
}

/* ==========================================================================
   CSS Reset & Base Rules
   ========================================================================== */
*, *::before, *::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.6;
	color: var(--color-text-body);
	background-color: var(--color-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
	overflow-x: hidden;
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	overflow-x: hidden;
	background-color: var(--color-bg);
}

img, svg {
	display: block;
	max-width: 100%;
	height: auto;
}

a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color var(--transition-fast);
}

a:hover {
	color: var(--color-gold);
}

h1, h2, h3, h4, h5, h6 {
	color: var(--color-text-main);
	font-weight: 700;
	line-height: 1.25;
	margin-bottom: 0.75rem;
}

p {
	margin-bottom: 1rem;
}

p:last-child {
	margin-bottom: 0;
}

ul, ol {
	padding-left: 1.25rem;
	margin-bottom: 1rem;
}

/* Container */
.container {
	width: 100%;
	max-width: var(--container-max-width);
	margin-left: auto;
	margin-right: auto;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

.container-narrow {
	max-width: var(--container-narrow);
}