/* Ocean Blue Theme Throughout Website - Force Override */

/* Add blue tint to white sections */
.about,
.why-choose,
.membership,
.faq,
.downloads,
.news {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%) !important;
}

/* Enhance existing blue sections */
.services {
    background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
}

/* Add blue accents to stats section */
.stats {
    background: linear-gradient(135deg, #0c4a6e 0%, #075985 100%) !important;
}

.stat-item {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 2px solid rgba(255, 255, 255, 0.2) !important;
}

.stats .stat-item h3,
.stats .stat-item p {
    color: #ffffff !important;
}

.stats .stat-item i {
    color: #ffffff !important;
}

/* Section headers with blue accent */
.section-header h2::after {
    content: '' !important;
    display: block !important;
    width: 80px !important;
    height: 4px !important;
    background: linear-gradient(90deg, #0284c7 0%, #f97316 100%) !important;
    margin: 20px auto 0 !important;
    border-radius: 2px !important;
}

/* Enhance testimonials background */
.testimonials {
    background: linear-gradient(135deg, #e0f2fe 0%, #f0f9ff 100%) !important;
}

/* Add blue tint to contact section */
.contact {
    background: linear-gradient(135deg, #f0f9ff 0%, #ffffff 100%) !important;
}

/* Service cards blue background on hover */
.service-card:hover {
    background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
    color: white !important;
    transform: translateY(-8px) scale(1.02) !important;
}

.service-card:hover h3,
.service-card:hover p {
    color: white !important;
}

.service-card:hover i {
    color: white !important;
    background: rgba(255, 255, 255, 0.2) !important;
}

/* Why choose section cards with blue accents */
.benefit-card {
    background: #ffffff !important;
    border-left: 4px solid #0284c7 !important;
}

.benefit-card:hover {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%) !important;
    border-left-color: #f97316 !important;
}

/* Calculator section blue gradient background */
.calculator {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 50%, #f0f9ff 100%) !important;
}

/* Team section background */
.team {
    background: linear-gradient(135deg, #e0f2fe 0%, #f0f9ff 100%) !important;
}

/* Add blue gradient to page for overall ocean theme */
body {
    background: linear-gradient(to bottom, #f0f9ff 0%, #ffffff 50%, #f0f9ff 100%) !important;
    background-attachment: fixed !important;
}

/* Enhance buttons with stronger blue */
.btn-primary {
    background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
    box-shadow: 0 4px 15px rgba(2, 132, 199, 0.3) !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #0369a1 0%, #075985 100%) !important;
    box-shadow: 0 6px 25px rgba(2, 132, 199, 0.4) !important;
}

/* Add subtle blue border to all major sections */
section {
    border-top: 1px solid rgba(2, 132, 199, 0.1) !important;
}

/* Blue accents on links */
a {
    transition: color 0.3s ease !important;
}

a:hover {
    color: #0284c7 !important;
}

/* Scrollbar blue theme */
::-webkit-scrollbar {
    width: 12px !important;
}

::-webkit-scrollbar-track {
    background: #e0f2fe !important;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #0284c7 0%, #0369a1 100%) !important;
    border-radius: 6px !important;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #0369a1 0%, #075985 100%) !important;
}