/* Prose styles for blog content */
.prose h2 { margin-top: 2em; margin-bottom: 0.75em; font-size: 1.5em; font-weight: 700; }
.prose h3 { margin-top: 1.5em; margin-bottom: 0.5em; font-size: 1.25em; font-weight: 600; }
.prose p { margin-bottom: 1.25em; line-height: 1.8; }
.prose ul, .prose ol { margin-bottom: 1.25em; padding-left: 1.5em; }
.prose li { margin-bottom: 0.5em; line-height: 1.7; }
.prose ul li { list-style-type: disc; }
.prose ol li { list-style-type: decimal; }
.prose a { color: #016099; text-decoration: underline; }
.prose a:hover { color: #014366; }

/* Tables in blog content */
.prose table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1.5em;
    margin-bottom: 1.5em;
    font-size: 0.925em;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.prose thead {
    background: #016099;
    color: #fff;
}
.prose thead th {
    padding: 0.75em 1em;
    font-weight: 600;
    text-align: left;
    letter-spacing: 0.01em;
}
.prose tbody td {
    padding: 0.65em 1em;
    border-bottom: 1px solid #e5e7eb;
}
.prose tbody tr:nth-child(even) {
    background: #f8fafc;
}
.prose tbody tr:hover {
    background: #eff6ff;
}
.prose tbody tr:last-child td {
    border-bottom: none;
}

/* Responsive tables */
@media (max-width: 640px) {
    .prose table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .prose thead th,
    .prose tbody td {
        padding: 0.5em 0.75em;
        white-space: nowrap;
    }
}

/* Line clamp */
.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* FAQ accordion */
details summary { list-style: none; }
details summary::-webkit-details-marker { display: none; }

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* ===== Hero Section ===== */

/* Animated grid */
.hero-grid {
    background-size: 60px 60px;
    background-image:
        linear-gradient(to right, rgba(255,255,255,0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255,255,255,0.03) 1px, transparent 1px);
}

/* Floating orbs */
@keyframes heroFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(30px, -20px) scale(1.05); }
    66% { transform: translate(-20px, 15px) scale(0.95); }
}
.hero-float { animation: heroFloat 15s ease-in-out infinite; }
.hero-float-delayed { animation: heroFloat 18s ease-in-out 3s infinite; }
.hero-float-slow { animation: heroFloat 22s ease-in-out 6s infinite; }

/* Lion — 3D depth effect */
.hero-lion {
    opacity: 0.25;
    filter: blur(3px) drop-shadow(0 0 80px rgba(1, 96, 153, 0.35)) drop-shadow(0 0 150px rgba(1, 96, 153, 0.2));
    animation: heroFloat 25s ease-in-out infinite;
    transform-origin: center center;
}

/* CTA shine sweep */
@keyframes ctaShine {
    0% { transform: translateX(-100%) skewX(-15deg); }
    100% { transform: translateX(300%) skewX(-15deg); }
}
.hero-cta-shine {
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
    animation: ctaShine 4s ease-in-out infinite;
}

/* Fade-in on load */
@keyframes heroFadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.hero-fade-in { animation: heroFadeIn 0.8s ease-out both; }
.hero-fade-in-delay-1 { animation: heroFadeIn 0.8s ease-out 0.15s both; }
.hero-fade-in-delay-2 { animation: heroFadeIn 0.8s ease-out 0.3s both; }
.hero-fade-in-delay-3 { animation: heroFadeIn 0.8s ease-out 0.45s both; }
.hero-fade-in-delay-4 { animation: heroFadeIn 0.8s ease-out 0.6s both; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .hero-float, .hero-float-delayed, .hero-float-slow, .hero-lion { animation: none; }
    .hero-cta-shine { animation: none; }
    .hero-fade-in, .hero-fade-in-delay-1, .hero-fade-in-delay-2,
    .hero-fade-in-delay-3, .hero-fade-in-delay-4 { animation: none; opacity: 1; }
}
