/* Blog Section Ornament Animations */
.blog-ornament .geometric-shape {
    animation-duration: 6s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    filter: drop-shadow(0 0 10px rgba(74, 144, 226, 0.3));
}

/* Add glow effects to specific shapes */
.blog-ornament .shape-1,
.blog-ornament .shape-2 {
    box-shadow: 0 0 20px rgba(74, 144, 226, 0.4), inset 0 0 20px rgba(74, 144, 226, 0.1);
}

.blog-ornament .shape-3,
.blog-ornament .shape-4 {
    box-shadow: 0 0 15px rgba(52, 152, 219, 0.5);
}

.blog-ornament .shape-5,
.blog-ornament .shape-6 {
    box-shadow: 0 0 12px rgba(74, 144, 226, 0.4);
}

.blog-ornament .shape-9,
.blog-ornament .shape-10,
.blog-ornament .shape-11 {
    box-shadow: 0 0 8px rgba(74, 144, 226, 0.6);
}

/* Circle animations */
.blog-ornament .shape-1 {
    animation-name: rotateSlow;
}

.blog-ornament .shape-2 {
    animation-name: floatUpDown;
}

/* Square animations */
.blog-ornament .shape-3 {
    animation-name: rotatePulse;
}

.blog-ornament .shape-4 {
    animation-name: rotateReverse;
}

/* Hexagon animations */
.blog-ornament .shape-5 {
    animation-name: hexagonFloat;
}

.blog-ornament .shape-6 {
    animation-name: hexagonRotate;
}

/* Line animations */
.blog-ornament .shape-7 {
    animation-name: lineSlide;
}

.blog-ornament .shape-8 {
    animation-name: lineSlideVertical;
}

/* Dot animations */
.blog-ornament .shape-9 {
    animation-name: dotPulse;
}

.blog-ornament .shape-10 {
    animation-name: dotFloat;
}

.blog-ornament .shape-11 {
    animation-name: dotBounce;
}

/* Triangle animations */
.blog-ornament .shape-12 {
    animation-name: triangleFloat;
}

.blog-ornament .shape-13 {
    animation-name: triangleRotate;
}

/* Keyframe animations */
@keyframes rotateSlow {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(180deg); }
}

@keyframes floatUpDown {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-30px); }
}

@keyframes rotatePulse {
    0%, 100% { transform: rotate(45deg) scale(1); opacity: 0.6; }
    50% { transform: rotate(225deg) scale(1.2); opacity: 0.9; }
}

@keyframes rotateReverse {
    0%, 100% { transform: rotate(-45deg) scale(1); }
    50% { transform: rotate(-225deg) scale(0.8); }
}

@keyframes hexagonFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(60deg); }
}

@keyframes hexagonRotate {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(120deg); }
}

@keyframes lineSlide {
    0%, 100% { transform: translateX(-50px); opacity: 0; }
    50% { transform: translateX(0px); opacity: 0.8; }
}

@keyframes lineSlideVertical {
    0%, 100% { transform: translateY(-50px); opacity: 0; }
    50% { transform: translateY(0px); opacity: 0.7; }
}

@keyframes dotPulse {
    0%, 100% { transform: scale(1); opacity: 0.9; }
    50% { transform: scale(1.5); opacity: 0.6; }
}

@keyframes dotFloat {
    0%, 100% { transform: translateY(0px) translateX(0px); }
    25% { transform: translateY(-15px) translateX(10px); }
    50% { transform: translateY(0px) translateX(20px); }
    75% { transform: translateY(15px) translateX(10px); }
}

@keyframes dotBounce {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-25px); }
}

@keyframes triangleFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(180deg); }
}

@keyframes triangleRotate {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(180deg); }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .blog-ornament .geometric-shape {
        display: none;
    }
}

/* HOW IT WORK Section Ornament Animations */
.how-it-work-ornament .work-shape {
    animation-duration: 8s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    filter: drop-shadow(0 0 8px rgba(255, 193, 7, 0.4));
}

/* Add colorful glow effects */
.how-it-work-ornament .shape-1,
.how-it-work-ornament .shape-2 {
    box-shadow: 0 0 25px rgba(255, 193, 7, 0.5), inset 0 0 15px rgba(255, 152, 0, 0.2);
}

.how-it-work-ornament .shape-3,
.how-it-work-ornament .shape-4 {
    box-shadow: 0 0 20px rgba(156, 39, 176, 0.4);
}

.how-it-work-ornament .shape-5,
.how-it-work-ornament .shape-6 {
    box-shadow: 0 0 15px rgba(255, 87, 34, 0.5);
}

.how-it-work-ornament .shape-9,
.how-it-work-ornament .shape-10,
.how-it-work-ornament .shape-11,
.how-it-work-ornament .shape-12 {
    box-shadow: 0 0 10px rgba(76, 175, 80, 0.6);
}

/* Geometric shape animations */
.how-it-work-ornament .shape-1 {
    animation-name: workRotateBounce;
}

.how-it-work-ornament .shape-2 {
    animation-name: workFloatCircle;
}

.how-it-work-ornament .shape-3 {
    animation-name: workDiamondSpin;
}

.how-it-work-ornament .shape-4 {
    animation-name: workDiamondReverse;
}

.how-it-work-ornament .shape-5 {
    animation-name: workStarTwinkle;
}

.how-it-work-ornament .shape-6 {
    animation-name: workStarRotate;
}

.how-it-work-ornament .shape-7 {
    animation-name: workWaveSlide;
}

.how-it-work-ornament .shape-8 {
    animation-name: workWaveVertical;
}

.how-it-work-ornament .shape-9 {
    animation-name: workParticleFloat;
}

.how-it-work-ornament .shape-10 {
    animation-name: workParticleBounce;
}

.how-it-work-ornament .shape-11 {
    animation-name: workParticleOrbit;
}

.how-it-work-ornament .shape-12 {
    animation-name: workParticlePulse;
}

.how-it-work-ornament .shape-13 {
    animation-name: workArrowFloat;
}

.how-it-work-ornament .shape-14 {
    animation-name: workArrowRotate;
}

.how-it-work-ornament .shape-15 {
    animation-name: workZigzagSlide;
}

.how-it-work-ornament .shape-16 {
    animation-name: workZigzagReverse;
}

/* Keyframe animations for HOW IT WORK */
@keyframes workRotateBounce {
    0%, 100% { transform: rotate(45deg) scale(1); }
    25% { transform: rotate(135deg) scale(1.1); }
    50% { transform: rotate(225deg) scale(0.9); }
    75% { transform: rotate(315deg) scale(1.05); }
}

@keyframes workFloatCircle {
    0%, 100% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-25px) scale(1.1); }
}

@keyframes workDiamondSpin {
    0%, 100% { transform: rotate(45deg) scale(1); opacity: 0.6; }
    50% { transform: rotate(225deg) scale(1.2); opacity: 0.9; }
}

@keyframes workDiamondReverse {
    0%, 100% { transform: rotate(-45deg) scale(1); }
    50% { transform: rotate(-225deg) scale(0.8); }
}

@keyframes workStarTwinkle {
    0%, 100% { transform: scale(1) rotate(0deg); opacity: 0.6; }
    25% { transform: scale(1.2) rotate(90deg); opacity: 0.9; }
    50% { transform: scale(0.8) rotate(180deg); opacity: 0.7; }
    75% { transform: scale(1.1) rotate(270deg); opacity: 0.8; }
}

@keyframes workStarRotate {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(180deg); }
}

@keyframes workWaveSlide {
    0%, 100% { transform: translateX(-60px); opacity: 0; }
    50% { transform: translateX(0px); opacity: 0.8; }
}

@keyframes workWaveVertical {
    0%, 100% { transform: translateY(-40px); opacity: 0; }
    50% { transform: translateY(0px); opacity: 0.7; }
}

@keyframes workParticleFloat {
    0%, 100% { transform: translateY(0px) translateX(0px); }
    25% { transform: translateY(-20px) translateX(15px); }
    50% { transform: translateY(0px) translateX(30px); }
    75% { transform: translateY(20px) translateX(15px); }
}

@keyframes workParticleBounce {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-30px); }
}

@keyframes workParticleOrbit {
    0%, 100% { transform: rotate(0deg) translateX(20px) rotate(0deg); }
    50% { transform: rotate(180deg) translateX(20px) rotate(-180deg); }
}

@keyframes workParticlePulse {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50% { transform: scale(1.5); opacity: 0.9; }
}

@keyframes workArrowFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(180deg); }
}

@keyframes workArrowRotate {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(180deg); }
}

@keyframes workZigzagSlide {
    0%, 100% { transform: rotate(45deg) translateX(-30px); opacity: 0; }
    50% { transform: rotate(45deg) translateX(0px); opacity: 0.6; }
}

@keyframes workZigzagReverse {
    0%, 100% { transform: rotate(-45deg) translateX(30px); opacity: 0; }
    50% { transform: rotate(-45deg) translateX(0px); opacity: 0.7; }
}

/* Responsive adjustments for HOW IT WORK */
@media (max-width: 768px) {
    .how-it-work-ornament .work-shape {
        display: none;
    }
}

/* Banner Section Ornament Animations */
.banner-ornament .banner-shape {
    animation-duration: 12s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    filter: drop-shadow(0 0 8px rgba(59, 130, 246, 0.4));
}

/* Enhanced glow effects for banner */
.banner-ornament .shape-1 {
    box-shadow: 0 0 25px rgba(59, 130, 246, 0.5), inset 0 0 15px rgba(59, 130, 246, 0.2);
}

.banner-ornament .shape-2 {
    box-shadow: 0 0 25px rgba(16, 185, 129, 0.4), inset 0 0 15px rgba(16, 185, 129, 0.2);
}

.banner-ornament .shape-3 {
    box-shadow: 0 0 20px rgba(99, 102, 241, 0.4);
}

.banner-ornament .shape-4 {
    box-shadow: 0 0 20px rgba(236, 72, 153, 0.4);
}

.banner-ornament .shape-5 {
    box-shadow: 0 0 15px rgba(59, 130, 246, 0.5);
}

.banner-ornament .shape-6 {
    box-shadow: 0 0 15px rgba(16, 185, 129, 0.4);
}

.banner-ornament .shape-7 {
    box-shadow: 0 0 12px rgba(59, 130, 246, 0.6);
}

.banner-ornament .shape-8 {
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.5);
}

.banner-ornament .shape-9 {
    box-shadow: 0 0 10px rgba(99, 102, 241, 0.7);
}

.banner-ornament .shape-10 {
    box-shadow: 0 0 10px rgba(236, 72, 153, 0.6);
}

.banner-ornament .shape-11 {
    box-shadow: 0 0 15px rgba(59, 130, 246, 0.4);
}

.banner-ornament .shape-12 {
    box-shadow: 0 0 15px rgba(16, 185, 129, 0.4);
}

.banner-ornament .shape-13 {
    box-shadow: 0 0 12px rgba(99, 102, 241, 0.4);
}

.banner-ornament .shape-14 {
    box-shadow: 0 0 12px rgba(236, 72, 153, 0.4);
}

.banner-ornament .shape-15 {
    box-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
}

.banner-ornament .shape-16 {
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.4);
}

/* Banner shape animations */
.banner-ornament .shape-1 {
    animation-name: bannerCircleFloat;
}

.banner-ornament .shape-2 {
    animation-name: bannerCircleSlow;
}

.banner-ornament .shape-3 {
    animation-name: bannerSquareRotate;
}

.banner-ornament .shape-4 {
    animation-name: bannerSquareReverse;
}

.banner-ornament .shape-5 {
    animation-name: bannerLineSlide;
}

.banner-ornament .shape-6 {
    animation-name: bannerLineVertical;
}

.banner-ornament .shape-7 {
    animation-name: bannerDotFloat;
}

.banner-ornament .shape-8 {
    animation-name: bannerDotPulse;
}

.banner-ornament .shape-9 {
    animation-name: bannerDotOrbit;
}

.banner-ornament .shape-10 {
    animation-name: bannerDotTwinkle;
}

.banner-ornament .shape-11 {
    animation-name: bannerTriangleFloat;
}

.banner-ornament .shape-12 {
    animation-name: bannerTriangleRotate;
}

.banner-ornament .shape-13 {
    animation-name: bannerHexagonFloat;
}

.banner-ornament .shape-14 {
    animation-name: bannerHexagonRotate;
}

.banner-ornament .shape-15 {
    animation-name: bannerCurveSlide;
}

.banner-ornament .shape-16 {
    animation-name: bannerCurveReverse;
}

/* Keyframe animations for Banner */
@keyframes bannerCircleFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.6; }
    50% { transform: translateY(-15px) scale(1.05); opacity: 0.8; }
}

@keyframes bannerCircleSlow {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.5; }
    50% { transform: translateY(10px) scale(0.95); opacity: 0.7; }
}

@keyframes bannerSquareRotate {
    0%, 100% { transform: rotate(45deg) scale(1); opacity: 0.4; }
    50% { transform: rotate(225deg) scale(1.1); opacity: 0.6; }
}

@keyframes bannerSquareReverse {
    0%, 100% { transform: rotate(-45deg) scale(1); opacity: 0.4; }
    50% { transform: rotate(-225deg) scale(0.9); opacity: 0.6; }
}

@keyframes bannerLineSlide {
    0%, 100% { transform: translateX(-50px); opacity: 0; }
    50% { transform: translateX(0px); opacity: 0.7; }
}

@keyframes bannerLineVertical {
    0%, 100% { transform: translateY(-40px); opacity: 0; }
    50% { transform: translateY(0px); opacity: 0.6; }
}

@keyframes bannerDotFloat {
    0%, 100% { transform: translateY(0px) translateX(0px); opacity: 0.7; }
    25% { transform: translateY(-10px) translateX(5px); opacity: 0.9; }
    50% { transform: translateY(0px) translateX(10px); opacity: 0.8; }
    75% { transform: translateY(10px) translateX(5px); opacity: 1; }
}

@keyframes bannerDotPulse {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50% { transform: scale(1.3); opacity: 0.8; }
}

@keyframes bannerDotOrbit {
    0%, 100% { transform: rotate(0deg) translateX(15px) rotate(0deg); opacity: 0.8; }
    50% { transform: rotate(180deg) translateX(15px) rotate(-180deg); opacity: 0.6; }
}

@keyframes bannerDotTwinkle {
    0%, 100% { transform: scale(1); opacity: 0.7; }
    25% { transform: scale(1.2); opacity: 1; }
    50% { transform: scale(0.8); opacity: 0.5; }
    75% { transform: scale(1.1); opacity: 0.9; }
}

@keyframes bannerTriangleFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); opacity: 0.4; }
    50% { transform: translateY(-10px) rotate(180deg); opacity: 0.6; }
}

@keyframes bannerTriangleRotate {
    0%, 100% { transform: rotate(0deg); opacity: 0.4; }
    50% { transform: rotate(180deg); opacity: 0.6; }
}

@keyframes bannerHexagonFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); opacity: 0.3; }
    50% { transform: translateY(-8px) rotate(60deg); opacity: 0.5; }
}

@keyframes bannerHexagonRotate {
    0%, 100% { transform: rotate(0deg); opacity: 0.3; }
    50% { transform: rotate(120deg); opacity: 0.5; }
}

@keyframes bannerCurveSlide {
    0%, 100% { transform: rotate(45deg) translateX(-30px); opacity: 0; }
    50% { transform: rotate(45deg) translateX(0px); opacity: 0.6; }
}

@keyframes bannerCurveReverse {
    0%, 100% { transform: rotate(-45deg) translateX(30px); opacity: 0; }
    50% { transform: rotate(-45deg) translateX(0px); opacity: 0.5; }
}

/* Responsive adjustments for Banner */
@media (max-width: 768px) {
    .banner-ornament .banner-shape {
        display: none;
    }
}

/* JOB POST Section Ornament Animations */
.job-post-ornament .job-shape {
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    filter: drop-shadow(0 0 6px rgba(37, 99, 235, 0.3));
}

/* Professional glow effects for job post */
.job-post-ornament .shape-1 {
    box-shadow: 0 0 20px rgba(37, 99, 235, 0.4), inset 0 0 12px rgba(37, 99, 235, 0.15);
}

.job-post-ornament .shape-2 {
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.3), inset 0 0 12px rgba(16, 185, 129, 0.15);
}

.job-post-ornament .shape-3 {
    box-shadow: 0 0 15px rgba(99, 102, 241, 0.3);
}

.job-post-ornament .shape-4 {
    box-shadow: 0 0 15px rgba(245, 158, 11, 0.3);
}

.job-post-ornament .shape-5 {
    box-shadow: 0 0 12px rgba(37, 99, 235, 0.4);
}

.job-post-ornament .shape-6 {
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.3);
}

.job-post-ornament .shape-7 {
    box-shadow: 0 0 10px rgba(37, 99, 235, 0.5);
}

.job-post-ornament .shape-8 {
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.4);
}

.job-post-ornament .shape-9 {
    box-shadow: 0 0 8px rgba(99, 102, 241, 0.6);
}

.job-post-ornament .shape-10 {
    box-shadow: 0 0 8px rgba(245, 158, 11, 0.5);
}

.job-post-ornament .shape-11 {
    box-shadow: 0 0 12px rgba(37, 99, 235, 0.3);
}

.job-post-ornament .shape-12 {
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.3);
}

.job-post-ornament .shape-13 {
    box-shadow: 0 0 10px rgba(99, 102, 241, 0.3);
}

.job-post-ornament .shape-14 {
    box-shadow: 0 0 10px rgba(245, 158, 11, 0.3);
}

.job-post-ornament .shape-15 {
    box-shadow: 0 0 8px rgba(37, 99, 235, 0.4);
}

.job-post-ornament .shape-16 {
    box-shadow: 0 0 8px rgba(16, 185, 129, 0.3);
}

.job-post-ornament .shape-17 {
    box-shadow: 0 0 10px rgba(37, 99, 235, 0.3);
}

.job-post-ornament .shape-18 {
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.3);
}

/* Job post shape animations */
.job-post-ornament .shape-1 {
    animation-name: jobCircleFloat;
}

.job-post-ornament .shape-2 {
    animation-name: jobCircleSlow;
}

.job-post-ornament .shape-3 {
    animation-name: jobSquareRotate;
}

.job-post-ornament .shape-4 {
    animation-name: jobSquareReverse;
}

.job-post-ornament .shape-5 {
    animation-name: jobLineSlide;
}

.job-post-ornament .shape-6 {
    animation-name: jobLineVertical;
}

.job-post-ornament .shape-7 {
    animation-name: jobDotFloat;
}

.job-post-ornament .shape-8 {
    animation-name: jobDotPulse;
}

.job-post-ornament .shape-9 {
    animation-name: jobDotOrbit;
}

.job-post-ornament .shape-10 {
    animation-name: jobDotTwinkle;
}

.job-post-ornament .shape-11 {
    animation-name: jobArrowFloat;
}

.job-post-ornament .shape-12 {
    animation-name: jobArrowRotate;
}

.job-post-ornament .shape-13 {
    animation-name: jobHexagonFloat;
}

.job-post-ornament .shape-14 {
    animation-name: jobHexagonRotate;
}

.job-post-ornament .shape-15 {
    animation-name: jobPathSlide;
}

.job-post-ornament .shape-16 {
    animation-name: jobPathReverse;
}

.job-post-ornament .shape-17 {
    animation-name: jobBadgeFloat;
}

.job-post-ornament .shape-18 {
    animation-name: jobBadgeRotate;
}

/* Keyframe animations for JOB POST */
@keyframes jobCircleFloat {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.5; }
    50% { transform: translateY(-12px) scale(1.03); opacity: 0.7; }
}

@keyframes jobCircleSlow {
    0%, 100% { transform: translateY(0px) scale(1); opacity: 0.4; }
    50% { transform: translateY(8px) scale(0.97); opacity: 0.6; }
}

@keyframes jobSquareRotate {
    0%, 100% { transform: rotate(45deg) scale(1); opacity: 0.4; }
    50% { transform: rotate(225deg) scale(1.08); opacity: 0.6; }
}

@keyframes jobSquareReverse {
    0%, 100% { transform: rotate(-45deg) scale(1); opacity: 0.4; }
    50% { transform: rotate(-225deg) scale(0.92); opacity: 0.6; }
}

@keyframes jobLineSlide {
    0%, 100% { transform: translateX(-45px); opacity: 0; }
    50% { transform: translateX(0px); opacity: 0.6; }
}

@keyframes jobLineVertical {
    0%, 100% { transform: translateY(-35px); opacity: 0; }
    50% { transform: translateY(0px); opacity: 0.5; }
}

@keyframes jobDotFloat {
    0%, 100% { transform: translateY(0px) translateX(0px); opacity: 0.6; }
    25% { transform: translateY(-8px) translateX(4px); opacity: 0.8; }
    50% { transform: translateY(0px) translateX(8px); opacity: 0.7; }
    75% { transform: translateY(8px) translateX(4px); opacity: 0.9; }
}

@keyframes jobDotPulse {
    0%, 100% { transform: scale(1); opacity: 0.5; }
    50% { transform: scale(1.25); opacity: 0.7; }
}

@keyframes jobDotOrbit {
    0%, 100% { transform: rotate(0deg) translateX(12px) rotate(0deg); opacity: 0.7; }
    50% { transform: rotate(180deg) translateX(12px) rotate(-180deg); opacity: 0.5; }
}

@keyframes jobDotTwinkle {
    0%, 100% { transform: scale(1); opacity: 0.7; }
    25% { transform: scale(1.15); opacity: 0.9; }
    50% { transform: scale(0.85); opacity: 0.4; }
    75% { transform: scale(1.05); opacity: 0.8; }
}

@keyframes jobArrowFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); opacity: 0.4; }
    50% { transform: translateY(-8px) rotate(180deg); opacity: 0.6; }
}

@keyframes jobArrowRotate {
    0%, 100% { transform: rotate(0deg); opacity: 0.4; }
    50% { transform: rotate(180deg); opacity: 0.6; }
}

@keyframes jobHexagonFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); opacity: 0.3; }
    50% { transform: translateY(-6px) rotate(60deg); opacity: 0.5; }
}

@keyframes jobHexagonRotate {
    0%, 100% { transform: rotate(0deg); opacity: 0.3; }
    50% { transform: rotate(120deg); opacity: 0.5; }
}

@keyframes jobPathSlide {
    0%, 100% { transform: rotate(45deg) translateX(-25px); opacity: 0; }
    50% { transform: rotate(45deg) translateX(0px); opacity: 0.5; }
}

@keyframes jobPathReverse {
    0%, 100% { transform: rotate(-45deg) translateX(25px); opacity: 0; }
    50% { transform: rotate(-45deg) translateX(0px); opacity: 0.4; }
}

@keyframes jobBadgeFloat {
    0%, 100% { transform: rotate(45deg) translateY(0px); opacity: 0.4; }
    50% { transform: rotate(45deg) translateY(-6px); opacity: 0.6; }
}

@keyframes jobBadgeRotate {
    0%, 100% { transform: rotate(-45deg) translateY(0px); opacity: 0.4; }
    50% { transform: rotate(-45deg) translateY(6px); opacity: 0.6; }
}

/* Responsive adjustments for JOB POST */
@media (max-width: 768px) {
    .job-post-ornament .job-shape {
        display: none;
    }
}
