
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 0;
    background: #f5f7fa;
    color: #333;
}

header {
    background: linear-gradient(90deg, #4facfe, #00f2fe);
    color: white;
    padding: 2rem 1rem;
    text-align: center;
}

main {
    max-width: 1200px;
    margin: 4rem auto;
    padding: 0 1rem;
}

button {
    background: #4facfe;
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 999px;
    color: white;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

button:hover {
    background: #00f2fe;
    transform: scale(1.05);
}

section {
    margin-bottom: 3rem;
    animation: floatIn 1s ease-out;
}

@keyframes floatIn {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

footer {
    background: #111;
    color: #ccc;
    padding: 2rem 1rem;
    text-align: center;
    border-top: 1px solid #333;
}

/* Additional styles for index.html */
body.index-html {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

nav {
    p-6 text-center bg-gradient-to-r from-blue-600 to-indigo-700 text-white shadow-xl;
}

main.index-main {
    max-width: 5xl;
    mx-auto p-8 text-center;
}

a.button {
    bg-gradient-to-r from-blue-600 to-indigo-600 text-white px-8 py-3 rounded-full shadow-lg hover:shadow-xl;
}

.policy-cards {
    grid grid-cols-1 md:grid-cols-3 gap-8;
}

.policy-card {
    bg-white rounded-2xl shadow-lg p-6 hover:shadow-2xl transform hover:-translate-y-1;
}

.policy-card svg {
    w-12 h-12 mx-auto text-blue-500;
}

footer.index-footer {
    mt-8;
    bg-gradient-to-r from-blue-600 to-indigo-600 text-white;
}

/* Tailwind-compatible animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeInUp {
    animation: fadeInUp 0.6s ease-out forwards;
}
