/* =============================================================================
 * Zuba — theme.css
 * Surcharge légère de Bootstrap 5 pour donner l'identité Zuba.
 * Base : Bootship. Inspiration design : ajfsr + womenintech.
 * ============================================================================= */

:root {
	--zuba-primary: #ff8a00;          /* orange Niger / taxi */
	--zuba-primary-dark: #e36b00;
	--zuba-primary-rgb: 255, 138, 0;
	--zuba-secondary: #0f172a;        /* slate ultra dark */
	--zuba-accent: #fbbf24;
	--zuba-bg-soft: #fff7ed;
	--zuba-text: #0f172a;
	--zuba-muted: #64748b;
	--zuba-radius: 1rem;
	--zuba-font-sans: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--zuba-font-display: 'Manrope', var(--zuba-font-sans);
}

/* Override Bootstrap CSS vars */
:root,
[data-bs-theme="light"] {
	--bs-primary: var(--zuba-primary);
	--bs-primary-rgb: var(--zuba-primary-rgb);
	--bs-link-color: var(--zuba-primary);
	--bs-link-color-rgb: var(--zuba-primary-rgb);
	--bs-link-hover-color: var(--zuba-primary-dark);
	--bs-body-font-family: var(--zuba-font-sans);
	--bs-body-color: var(--zuba-text);
	--bs-body-bg: #ffffff;
	--bs-border-radius: 0.625rem;
	--bs-border-radius-lg: var(--zuba-radius);
}

body {
	font-family: var(--zuba-font-sans);
	color: var(--zuba-text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	padding-top: 76px; /* fixed-top navbar */
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
	font-family: var(--zuba-font-display);
	letter-spacing: -0.015em;
}

/* ----------------------------------------------------------------- Buttons */
.btn {
	font-weight: 600;
	letter-spacing: 0;
	border-radius: 0.625rem;
	transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.btn-lg { padding: 0.85rem 1.5rem; }
.btn-primary {
	background-color: var(--zuba-primary);
	border-color: var(--zuba-primary);
}
.btn-primary:hover,
.btn-primary:focus {
	background-color: var(--zuba-primary-dark);
	border-color: var(--zuba-primary-dark);
	transform: translateY(-1px);
	box-shadow: 0 8px 24px -8px rgba(var(--zuba-primary-rgb), 0.5);
}
.btn-outline-dark:hover { background: var(--zuba-secondary); border-color: var(--zuba-secondary); }

/* --------------------------------------------------------------- Utilities */
.py-6  { padding-top: 4rem !important; padding-bottom: 4rem !important; }
.py-7  { padding-top: 6rem !important; padding-bottom: 6rem !important; }
.py-8  { padding-top: 8rem !important; padding-bottom: 8rem !important; }
.pt-6  { padding-top: 4rem !important; } .pb-6 { padding-bottom: 4rem !important; }
.pt-7  { padding-top: 6rem !important; } .pb-7 { padding-bottom: 6rem !important; }
.mt-6  { margin-top: 4rem !important; }  .mb-6 { margin-bottom: 4rem !important; }
.mt-7  { margin-top: 6rem !important; }  .mb-7 { margin-bottom: 6rem !important; }

.bg-primary-subtle { background-color: rgba(var(--zuba-primary-rgb), 0.10) !important; }
.text-primary { color: var(--zuba-primary) !important; }
.bg-primary { background-color: var(--zuba-primary) !important; }
.shadow-sm { box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 4px 12px rgba(15, 23, 42, 0.05) !important; }
.shadow-lg { box-shadow: 0 10px 40px -10px rgba(15, 23, 42, 0.18) !important; }
.rounded-3 { border-radius: 0.75rem !important; }
.rounded-4 { border-radius: var(--zuba-radius) !important; }

/* --------------------------------------------------------------- Navbar */
.navbar.fixed-top {
	border-bottom: 1px solid rgba(15, 23, 42, 0.06);
	backdrop-filter: saturate(180%) blur(10px);
	background-color: rgba(255, 255, 255, 0.92) !important;
}
.navbar .brand-zuba {
	font-family: var(--zuba-font-display);
	font-weight: 800;
	font-size: 1.5rem;
	color: var(--zuba-secondary);
	letter-spacing: -0.02em;
}
.navbar .brand-zuba::before {
	content: '';
	display: inline-block;
	width: 10px;
	height: 10px;
	background: var(--zuba-primary);
	border-radius: 2px;
	margin-right: 8px;
	transform: rotate(45deg);
	vertical-align: middle;
}
.navbar .nav-link {
	color: var(--zuba-text);
	font-weight: 500;
	padding: 0.5rem 0.85rem !important;
}
.navbar .nav-link:hover,
.navbar .current-menu-item .nav-link {
	color: var(--zuba-primary);
}

/* --------------------------------------------------------------- Sections */
.zuba-hero {
	background:
		radial-gradient(circle at 90% 10%, rgba(var(--zuba-primary-rgb), 0.08), transparent 40%),
		radial-gradient(circle at 10% 90%, rgba(251, 191, 36, 0.06), transparent 40%),
		var(--zuba-bg-soft);
}

.zuba-feature-card {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.zuba-feature-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px -12px rgba(15, 23, 42, 0.18) !important;
}

.zuba-icon-circle {
	border-radius: 12px !important;
}

/* --------------------------------------------------------------- Forms */
.form-control, .form-select {
	border-radius: 0.625rem;
	border-color: rgba(15, 23, 42, 0.12);
}
.form-control:focus, .form-select:focus {
	border-color: var(--zuba-primary);
	box-shadow: 0 0 0 0.2rem rgba(var(--zuba-primary-rgb), 0.18);
}
.form-label { font-weight: 500; color: var(--zuba-text); }

/* --------------------------------------------------------------- Footer */
.site-footer {
	background: var(--zuba-secondary) !important;
}
.site-footer h3, .site-footer h5 { color: #fff; }
.site-footer .text-secondary { color: rgba(255, 255, 255, 0.65) !important; }
.site-footer a.text-light:hover { color: var(--zuba-primary) !important; }

/* --------------------------------------------------------------- Skip link */
.skip-link {
	position: absolute;
	top: -40px;
	left: 0;
	background: var(--zuba-primary);
	color: #fff;
	padding: 0.5rem 1rem;
	z-index: 9999;
}
.skip-link:focus { top: 0; }

/* --------------------------------------------------------------- WP core */
.wp-block-image img { border-radius: 0.625rem; }
.page-header { border-bottom: 1px solid rgba(15, 23, 42, 0.05); }

/* --------------------------------------------------------------- Responsive */
@media (max-width: 991.98px) {
	body { padding-top: 64px; }
	.py-6 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
	.py-7 { padding-top: 4rem !important; padding-bottom: 4rem !important; }
	.navbar-collapse {
		padding-top: 0.75rem;
		padding-bottom: 0.5rem;
	}
}