/* Ditoma Limited brand layer: palette and type from the brand direction, applied over the generated Tailwind build. */
:root {
	--brand-navy: #061d38;
	--brand-navy-2: #0b2d57;
	--brand-blue: #2563eb;
	--brand-blue-light: #5b8def;
	--brand-teal: #16a6a1;
	--brand-teal-light: #2cc5bf;
	--brand-white: #f7f8fa;
}

body {
	font-family: Manrope, Inter, system-ui, sans-serif;
	background: linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-navy-2) 100%);
	background-attachment: fixed;
	color: var(--brand-white);
}

/* Logo */
.brand-logo { display: flex; align-items: center; line-height: 0; }
.brand-logo img { height: 2.75rem; width: auto; }
.brand-logo-footer { height: 3rem; width: auto; }

/* Page background gradient (hero / sections) */
.from-slate-900 { --tw-gradient-from: var(--brand-navy) var(--tw-gradient-from-position); --tw-gradient-to: rgb(6 29 56 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.via-blue-900 { --tw-gradient-to: rgb(11 45 87 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--brand-navy-2) var(--tw-gradient-via-position), var(--tw-gradient-to); }
.to-indigo-900 { --tw-gradient-to: var(--brand-navy) var(--tw-gradient-to-position); }

/* Glass cards */
.from-blue-900\/30, .from-blue-900\/50 { --tw-gradient-from: rgb(37 99 235 / .12) var(--tw-gradient-from-position); --tw-gradient-to: rgb(37 99 235 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-purple-900\/50, .from-cyan-900\/50 { --tw-gradient-from: rgb(22 166 161 / .14) var(--tw-gradient-from-position); --tw-gradient-to: rgb(22 166 161 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-purple-900\/30, .to-purple-900\/50 { --tw-gradient-to: rgb(22 166 161 / .10) var(--tw-gradient-to-position); }
.to-pink-900\/50, .to-blue-900\/50 { --tw-gradient-to: rgb(37 99 235 / .12) var(--tw-gradient-to-position); }

/* Accents: purple / pink / cyan -> brand blue + teal */
.from-blue-400 { --tw-gradient-from: var(--brand-blue-light) var(--tw-gradient-from-position); --tw-gradient-to: rgb(91 141 239 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-blue-500, .from-blue-600 { --tw-gradient-from: var(--brand-blue) var(--tw-gradient-from-position); --tw-gradient-to: rgb(37 99 235 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-purple-500, .from-cyan-500 { --tw-gradient-from: var(--brand-teal) var(--tw-gradient-from-position); --tw-gradient-to: rgb(22 166 161 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.via-purple-400 { --tw-gradient-to: rgb(44 197 191 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--brand-teal-light) var(--tw-gradient-via-position), var(--tw-gradient-to); }
.to-purple-400, .to-cyan-400 { --tw-gradient-to: var(--brand-teal-light) var(--tw-gradient-to-position); }
.to-purple-500, .to-purple-600, .to-cyan-500 { --tw-gradient-to: var(--brand-teal) var(--tw-gradient-to-position); }
.to-pink-500, .to-blue-500 { --tw-gradient-to: var(--brand-blue) var(--tw-gradient-to-position); }
.hover\:from-blue-700:hover { --tw-gradient-from: #1d4ed8 var(--tw-gradient-from-position); --tw-gradient-to: rgb(29 78 216 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.hover\:to-purple-700:hover { --tw-gradient-to: #128a86 var(--tw-gradient-to-position); }

.text-purple-400 { color: var(--brand-teal-light); }
.text-cyan-400 { color: var(--brand-teal-light); }
.text-blue-400 { color: var(--brand-blue-light); }
.hover\:border-blue-400\/50:hover { border-color: rgb(22 166 161 / .5); }

.gradient-text { background: linear-gradient(135deg, var(--brand-blue-light), var(--brand-teal-light)); background-size: 200% 200%; -webkit-background-clip: text; background-clip: text; }
::-webkit-scrollbar-track { background: rgb(6 29 56 / .6); }
::-webkit-scrollbar-thumb { background: linear-gradient(135deg, var(--brand-blue), var(--brand-teal)); }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(135deg, #1d4ed8, #128a86); }
