/* ===== style.css ===== */


body {
scroll-behavior: smooth;
}


.hero {
background: linear-gradient(135deg, #f9fbff 0%, #e8f1ff 100%);
animation: fadeIn 1.2s ease;
}


.animate-fade {
opacity: 0;
transform: translateY(20px);
transition: all 0.8s ease;
}


.animate-fade.visible {
opacity: 1;
transform: translateY(0);
}


.btn-primary {
background-color: #0078d7;
border-color: #0078d7;
transition: 0.3s;
}


.btn-primary:hover {
background-color: #005fa3;
border-color: #005fa3;
}


section {
animation: fadeSection 0.6s ease;
}


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


@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}