/* Custom animations not covered by Tailwind CDN defaults */

@keyframes fade-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
    animation: fade-in 0.4s ease both;
}

/* Navbar scroll state */
#main-nav.nav-scrolled {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid #e2e8f0;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

#main-nav.nav-transparent {
    background-color: transparent;
    border-bottom: none;
    box-shadow: none;
}

/* Service card active state (managed by JS) */
.service-card-active {
    background-color: #fff !important;
    border-color: rgb(59 130 246) !important;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,.1), 0 0 0 1px rgb(59 130 246) !important;
}

.service-card-active .icon-wrap {
    background-color: rgb(37 99 235) !important;
    color: #fff !important;
    box-shadow: 0 10px 15px -3px rgba(59,130,246,.2) !important;
    border: none !important;
}

.service-card-active .card-title {
    color: rgb(37 99 235) !important;
}

/* Markdown-rendered prose in diag result */
#diag-result-text h3 {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    margin-top: 1rem;
    margin-bottom: 0.25rem;
}

#diag-result-text ul {
    list-style: disc;
    padding-left: 1.25rem;
    margin-top: 0.5rem;
}

#diag-result-text li {
    margin-bottom: 0.25rem;
}

#diag-result-text strong {
    color: #1e293b;
}

#diag-result-text p {
    margin-bottom: 0.5rem;
}

/* Smooth focus styles */
textarea:focus, input:focus {
    outline: none;
}

/* Clip long text gracefully */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}