Brand Master Slide
CIE Logo

Care Intelligence
Engine

Your Success. Our Mission.

We don't sell tools. We deliver outcomes.

QuantumTech IT · https://careintelligence.ai

Color Palette

Primary Scale

Deep Navy

#0a1628 · primary-950

Background / Dark mode base

Navy 900

#184d8f · primary-900

Text on light / headings

Navy 800

#165ab6 · primary-800

Button bg / links

Royal Blue

#1a87f5 · primary-600

Primary action buttons

Bright Blue

#32a6ff · primary-500

Interactive elements

Sky Blue

#58c3ff · primary-400

Hover states / accents

Light Sky

#bce8ff · primary-200

Badges / tinted backgrounds

Ice Blue

#eef9ff · primary-50

Page background tint

Accent Colors

Cyan Neon

#00f5ff · accent-cyan

Hero glow / primary accent

Purple

#a855f7 · accent-purple

Gradient mid-point / PDGM

Pink

#ec4899 · accent-pink

Gradient end / highlights

Emerald

#10b981 · accent-green

Success / LOS model

Solution Model Colors

Hospice Risk

#06b6d4

PDGM Optimization

#a855f7

Length of Stay

#10b981

Recertification

#f97316

Typography

Display / Hero

Space Grotesk

Weight 700 · 56–72 px

font-display text-5xl md:text-7xl font-bold

Section Title

Space Grotesk

Weight 600 · 32–40 px

font-display text-3xl md:text-4xl font-semibold

Card Title

Inter

Weight 600 · 20–24 px

font-sans text-xl font-semibold

Body

Inter

Weight 400 · 16 px

font-sans text-base

Caption / Label

Inter

Weight 500 · 12–14 px

font-sans text-sm font-medium

Overline / Badge

Inter

Weight 600 · 12 px

font-sans text-xs font-semibold uppercase tracking-wider

Google Fonts Import

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

Gradients

Hero Text

gradient-text

Primary Button

btn-primary

Background

bg-gradient-to-b from-primary-950 to-[#050a14]

Hero Glow

bg-hero-glow

Card Border

gradient-border

CTA Button

from-blue-500 via-violet-500 to-purple-500

Effects & Glass

Glass Card

background: rgba(255,255,255,0.03); backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.08);
glass

Glow Text

text-shadow: 0 0 40px rgba(0,245,255,0.5);
glow-text

Glow Border

box-shadow: 0 0 20px rgba(0,245,255,0.15), inset 0 0 20px rgba(0,245,255,0.05);
glow-border

Button Shadow

box-shadow: 0 4px 30px rgba(0,245,255,0.3);
shadow-[0_4px_30px_rgba(0,245,255,0.3)]

Animations

Float

0%,100% translateY(0) → 50% translateY(-20px)

Duration: 6 s

animate-float

Glow Pulse

0% box-shadow 20px → 100% 40px

Duration: 2 s alternate

animate-glow

Slow Pulse

scale 1→1.05→1

Duration: 4 s

animate-pulse-slow

Gradient Shift

background-position 0%→100%→0%

Duration: 8 s

animate-gradient

Slide Up

opacity 0→1, translateY 20→0

Duration: 0.5 s ease-out

animate-slide-up

Voice & Messaging

Outcome-Focused"We deliver outcomes." not "We provide tools."
Clinical Authority"95% prediction accuracy" — always cite metrics.
Human-Centered"Give families clarity" — lead with empathy.
Transformation Language"Start Your Transformation" — inspire action.
Concise & CleanShort declarative sentences. No jargon walls.

Key Brand Phrases

Your Success. Our Mission. We don't sell tools. We deliver outcomes. Start Your Transformation AI-Powered Healthcare Transformation Earlier Interventions Plan with Precision Maximize Revenue Right Care, Right Time Introducing Care Intelligence Engine

Spacing & Layout Guide

Max content widthmax-w-7xl (80rem / 1280px)
Container paddingpx-6
Section spacingpy-20 (80px)
Card border-radiusrounded-2xl / rounded-3xl
Button radiusrounded-full
Grid gapgap-4 to gap-8
Scrollbar thumbrgba(0,245,255,0.3)

Quick Reference

// tailwind.config.ts — key tokens
colors: {
  primary: { 50:'#eef9ff', 500:'#32a6ff', 600:'#1a87f5', 800:'#165ab6', 950:'#0a1628' },
  accent:  { cyan:'#00f5ff', purple:'#a855f7', pink:'#ec4899', green:'#10b981' },
}
fontFamily: {
  sans:    ['Inter', 'system-ui', 'sans-serif'],
  display: ['Space Grotesk', 'system-ui', 'sans-serif'],
}

// CSS custom properties
:root {
  --foreground-rgb: 255, 255, 255;
  --background-start-rgb: 10, 22, 40;   /* #0a1628 */
  --background-end-rgb: 5, 10, 20;      /* #050a14 */
}

// Hero gradient text
background: linear-gradient(135deg, #00f5ff 0%, #a855f7 50%, #ec4899 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;