@charset "UTF-8";

/* ==========================================================================
   Brand Color Palette Overrides:
   • Primary Corporate Navy Blue: #0D2C54
     (Establishes absolute compliance authority, high patient trust, and institutional stability)
   • Digital Teal Accent: #00A896
     (Defines technological modernity, software optimization, and processing speed)
   ========================================================================== */

:root {
    --primary-corporate-navy: #0D2C54;
    --digital-teal-accent: #00A896;
    --navy-950: #07172D;
    --navy-900: #0D2C54;
    --navy-800: #133863;
    --teal-400: #02c3ae;
    --teal-500: #00A896;
}

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* ==========================================================================
   Typography Configuration
   1. Heading Font Family: Geometric Sans-Serif (Montserrat / Outfit)
   2. Text Style: Lighter-weight, all-caps geometric sans-serif typeface
   ========================================================================== */

/* 1. All Headings: Geometric Sans-Serif */
h1, h2, h3, h4, h5, h6,
.font-heading,
.font-geometric {
    font-family: 'Montserrat', 'Outfit', system-ui, -apple-system, sans-serif !important;
}

/* 2. Text: Lighter-weight, all-caps geometric sans-serif typeface */
.font-caps-geometric,
.text-geometric-caps,
.eyebrow-caps,
.uppercase,
[class*="uppercase"] {
    font-family: 'Montserrat', 'Outfit', system-ui, -apple-system, sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em;
}

/* Specific Lighter-weight for badges, subtitles, labels & metadata text */
span[class*="uppercase"],
p[class*="uppercase"],
label[class*="uppercase"],
.font-lighter-caps {
    font-weight: 300 !important;
    letter-spacing: 0.12em !important;
}

/* Heading uppercase badges */
div[class*="uppercase"]:not(button):not(nav) {
    font-weight: 400;
    letter-spacing: 0.1em;
}

/* 3. Responsive Font Size Override */
@media (min-width: 1024px) {
    .lg\:text-6xl {
        font-size: 3rem !important;
        line-height: 1 !important;
    }
}

/* Global Selection Styling */
::selection {
    background-color: #00A896 !important;
    color: #ffffff !important;
}

.glassmorphism {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

/* Gradients using the exact screenshot colors */
.gradient-text {
    background: linear-gradient(135deg, #02c3ae 0%, #00A896 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.gradient-brand {
    background: linear-gradient(135deg, #0D2C54 0%, #00A896 100%) !important;
}

.gradient-teal {
    background: linear-gradient(135deg, #00A896 0%, #02c3ae 100%) !important;
}

/* ==========================================================================
   EXPLICIT CSS OVERRIDES (Guaranteed exact hex color rendering)
   ========================================================================== */

/* 1. Primary Corporate Navy Blue (#0D2C54) & its shades */
.bg-navy-950,
html.bg-navy-950,
body.bg-navy-950 {
    background-color: #07172D !important;
}

.bg-navy-950\/95,
.bg-navy-950\/90,
.bg-navy-950\/80,
.bg-navy-950\/60 {
    background-color: rgba(7, 23, 45, 0.90) !important;
}

.bg-navy-900 {
    background-color: #0D2C54 !important;
}

.bg-navy-900\/95 {
    background-color: rgba(13, 44, 84, 0.95) !important;
}

.bg-navy-900\/90 {
    background-color: rgba(13, 44, 84, 0.90) !important;
}

.bg-navy-900\/60 {
    background-color: rgba(13, 44, 84, 0.60) !important;
}

.bg-navy-900\/40 {
    background-color: rgba(13, 44, 84, 0.40) !important;
}

.bg-navy-800 {
    background-color: #133863 !important;
}

.bg-navy-800\/90 {
    background-color: rgba(19, 56, 99, 0.90) !important;
}

.text-navy-900 {
    color: #0D2C54 !important;
}

.border-navy-900 {
    border-color: #0D2C54 !important;
}

/* 2. Medblue / Primary buttons and icons */
.bg-medblue-600 {
    background-color: #0D2C54 !important;
}

.hover\:bg-medblue-700:hover,
.bg-medblue-700 {
    background-color: #09203e !important;
}

.hover\:bg-medblue-500:hover,
.bg-medblue-500 {
    background-color: #1b5a9e !important;
}

.bg-medblue-50 {
    background-color: #edf4fc !important;
}

.bg-medblue-100 {
    background-color: #d5e5f8 !important;
}

.text-medblue-600,
.text-medblue-700 {
    color: #0D2C54 !important;
}

.border-medblue-500 {
    border-color: #00A896 !important;
}

.bg-medblue-600\/30 {
    background-color: rgba(13, 44, 84, 0.3) !important;
}

.bg-medblue-600\/15 {
    background-color: rgba(13, 44, 84, 0.15) !important;
}

/* 3. Digital Teal Accent (#00A896) */
.bg-cyanAccent-500,
.bg-teal-500 {
    background-color: #00A896 !important;
}

.bg-cyanAccent-500\/20 {
    background-color: rgba(0, 168, 150, 0.20) !important;
}

.bg-cyanAccent-500\/15 {
    background-color: rgba(0, 168, 150, 0.15) !important;
}

.bg-cyanAccent-500\/10 {
    background-color: rgba(0, 168, 150, 0.10) !important;
}

.text-cyanAccent-400,
.text-teal-400 {
    color: #02c3ae !important;
}

.hover\:text-cyanAccent-400:hover,
.hover\:text-teal-400:hover {
    color: #02c3ae !important;
}

.border-cyanAccent-500,
.border-teal-500 {
    border-color: #00A896 !important;
}

.border-cyanAccent-500\/30,
.border-cyanAccent-500\/40 {
    border-color: rgba(0, 168, 150, 0.40) !important;
}

/* 4. Action Gradient Buttons: Corporate Navy Blue (#0D2C54) -> Digital Teal (#00A896) */
.from-medblue-600 {
    --tw-gradient-from: #0D2C54 var(--tw-gradient-from-position) !important;
    --tw-gradient-to: rgb(13 44 84 / 0) var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.to-cyanAccent-500 {
    --tw-gradient-to: #00A896 var(--tw-gradient-to-position) !important;
}

.hover\:from-medblue-700:hover {
    --tw-gradient-from: #09203e var(--tw-gradient-from-position) !important;
}

.shadow-medblue-600\/30 {
    --tw-shadow-color: rgba(13, 44, 84, 0.3) !important;
}

.animate-pulse-subtle {
    animation: pulseSubtle 3s ease-in-out infinite;
}

@keyframes pulseSubtle {
    0%, 100% {
        opacity: 0.9;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.02);
    }
}