/* Central theme variables and safe overrides to harmonize site colors */
:root {
    --primary: #14B8A6; /* teal */
    --primary-2: #06b6d4; /* cyan */
    --accent: #0f766e; /* darker teal */
    --muted-text: #334155;
    --ui-bg: #ffffff;
    --ui-contrast: rgba(255,255,255,0.9);
}

/* Replace site-wide gradient utility with clinic palette */
.gradient-primary {
    background: linear-gradient(135deg, var(--primary-2) 0%, var(--primary) 100%) !important;
}

/* Hero primary buttons use clinic gradient */
.hero-modern .btn-primary,
.shine-btn {
    background: linear-gradient(135deg, var(--primary-2), var(--primary)) !important;
    color: var(--ui-contrast) !important;
    box-shadow: 0 14px 40px rgba(20,184,166,0.18) !important;
    border-color: rgba(255,255,255,0.14) !important;
}

/* Subtle accent for small badges and highlights */
.badge-accent {
    background: linear-gradient(90deg, var(--primary-2), var(--primary));
    color: #fff;
}

/* Progress bar accent */
.progress-bar {
    background: linear-gradient(90deg, var(--primary-2), var(--primary)) !important;
}

/* Slider arrows and bullets match contrast */
.hero-modern .slider-arrow {
    background: rgba(255,255,255,0.06);
    color: var(--ui-contrast);
}
.hero-modern .slide-bullet.active {
    background: var(--primary) !important;
}

/* Keep everything else intact—these are gentle overrides only */