/* ===== HERO ENTRANCE ===== */
@keyframes fadeSlideUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeSlideRight {
    from { opacity: 0; transform: translateX(-30px); }
    to { opacity: 1; transform: translateX(0); }
}

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

@keyframes scaleIn {
    from { opacity: 0; transform: scale(0.8); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-20px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ===== ROTATING / FLOATING ===== */
@keyframes rotateCircle {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes floatY {
    0% { transform: translateY(0); }
    100% { transform: translateY(-12px); }
}

@keyframes floatNode {
    0% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-8px) scale(1.05); }
    100% { transform: translateY(0) scale(1); }
}

@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(46, 134, 222, 0.4); }
    70% { box-shadow: 0 0 0 15px rgba(46, 134, 222, 0); }
    100% { box-shadow: 0 0 0 0 rgba(46, 134, 222, 0); }
}

@keyframes pulseGlow {
    0% { box-shadow: 0 0 30px rgba(46, 134, 222, 0.3); }
    50% { box-shadow: 0 0 60px rgba(46, 134, 222, 0.5); }
    100% { box-shadow: 0 0 30px rgba(46, 134, 222, 0.3); }
}

/* ===== APPLY HERO ANIMATIONS ===== */
.hero-badge {
    animation: fadeSlideUp 0.6s ease forwards;
    animation-delay: 0.2s;
    opacity: 0;
}

.hero-content h1 {
    animation: fadeSlideUp 0.6s ease forwards;
    animation-delay: 0.4s;
    opacity: 0;
}

.hero-content > p {
    animation: fadeSlideUp 0.6s ease forwards;
    animation-delay: 0.6s;
    opacity: 0;
}

.hero-buttons {
    animation: fadeSlideUp 0.6s ease forwards;
    animation-delay: 0.8s;
    opacity: 0;
}

.hero-visual {
    animation: fadeSlideLeft 0.8s ease forwards;
    animation-delay: 0.5s;
    opacity: 0;
}

/* ===== TECH GRID ANIMATIONS ===== */
.tech-circle-1 {
    animation: rotateCircle 30s linear infinite;
}

.tech-circle-2 {
    animation: rotateCircle 25s linear infinite reverse;
}

.tech-circle-3 {
    animation: rotateCircle 20s linear infinite;
}

.tech-center {
    animation: pulseGlow 3s ease-in-out infinite;
}

.tech-node-1 { animation: floatNode 3s ease-in-out infinite; }
.tech-node-2 { animation: floatNode 3.5s ease-in-out infinite 0.3s; }
.tech-node-3 { animation: floatNode 2.8s ease-in-out infinite 0.6s; }
.tech-node-4 { animation: floatNode 3.2s ease-in-out infinite 0.9s; }
.tech-node-5 { animation: floatNode 3.8s ease-in-out infinite 1.2s; }
.tech-node-6 { animation: floatNode 2.5s ease-in-out infinite 1.5s; }

/* ===== HOVER EFFECTS ===== */
.btn-accent:hover {
    animation: pulse 1s ease;
}

.service-icon {
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.service-card:hover .service-icon {
    transform: scale(1.1) rotate(5deg);
}

.why-icon {
    transition: all 0.4s ease;
}

.why-card:hover .why-icon {
    transform: scale(1.1);
}

/* ===== NAVBAR ===== */
.navbar {
    animation: slideDown 0.5s ease;
}

/* ===== CEO PHOTO ===== */
.ceo-photo {
    transition: all 0.4s ease;
}

.ceo-photo:hover {
    transform: scale(1.05);
    box-shadow: 0 15px 40px rgba(46, 134, 222, 0.4);
}

/* ===== CONTACT CARDS ===== */
.contact-info-card {
    transition: all 0.3s ease;
}

/* ===== FOOTER SOCIAL ===== */
.footer-social a {
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.footer-social a:hover {
    transform: translateY(-3px) scale(1.1);
}

/* ===== PROJECT CARD ===== */
.project-preview .project-icon {
    transition: all 0.4s ease;
}

.project-card:hover .project-preview .project-icon {
    transform: scale(1.1);
}
