/* ==========================================================================
   Premium Medical Background Animations
   ========================================================================== */
#auranix-medical-decorations {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.auranix-med-deco {
    position: absolute;
    opacity: 0.05;
    pointer-events: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    will-change: transform, opacity;
}

/* Specific colors */
.auranix-med-color-blue { color: #2563EB; }
.auranix-med-color-cyan { color: #06B6D4; }
.auranix-med-color-green { color: #10B981; }
.auranix-med-color-orange { color: #F59E0B; }
.auranix-med-color-gray { color: rgba(15, 23, 42, 0.4); }

/* Animations */
@keyframes auranixFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-30px) rotate(5deg); }
}
@keyframes auranixFloatReverse {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(25px) rotate(-5deg); }
}
@keyframes auranixRotateSlow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes auranixPulseGlow {
    0%, 100% { opacity: 0.03; transform: scale(0.98); }
    50% { opacity: 0.08; transform: scale(1.03); }
}

/* Apply animations */
.anim-float { animation: auranixFloat 12s ease-in-out infinite; }
.anim-float-reverse { animation: auranixFloatReverse 14s ease-in-out infinite; }
.anim-rotate { animation: auranixRotateSlow 50s linear infinite; }
.anim-pulse { animation: auranixPulseGlow 7s ease-in-out infinite; }

/* Positions */
.med-pos-1 { top: 15%; left: 5%; width: 120px; height: 120px; }
.med-pos-2 { top: 25%; right: 8%; width: 80px; height: 80px; }
.med-pos-3 { top: 60%; left: 10%; width: 100px; height: 100px; }
.med-pos-4 { top: 75%; right: 5%; width: 150px; height: 150px; }
.med-pos-5 { top: 10%; right: 25%; width: 90px; height: 90px; }
.med-pos-6 { top: 85%; left: 20%; width: 110px; height: 110px; }
.med-pos-7 { top: 45%; right: 15%; width: 70px; height: 70px; }

/* Responsive adjustments */
@media (max-width: 1200px) {
    .auranix-med-deco.hide-tablet { display: none; }
}

@media (max-width: 768px) {
    .auranix-med-deco {
        opacity: 0.03; /* Less distracting on mobile */
    }
    .auranix-med-deco.hide-mobile { display: none; }
    
    /* Disable expensive transforms on mobile for core web vitals */
    .anim-rotate { animation: none; }
    .anim-float { animation: auranixFloat 20s ease-in-out infinite; }
    .anim-float-reverse { animation: auranixFloatReverse 22s ease-in-out infinite; }
}
