/* Custom Styles & Overrides */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Background Patterns used across the site */
.tech-pattern-dots {
    background-image: radial-gradient(circle, currentColor 1px, transparent 1px);
    background-size: 20px 20px;
}

.tech-pattern-lines {
    background-image: repeating-linear-gradient(45deg, currentColor, currentColor 1px, transparent 1px, transparent 10px);
}

.technical-pattern {
    background-image: radial-gradient(#8e7164 1px, transparent 1px);
    background-size: 20px 20px;
}

.tech-pattern {
    background-image: radial-gradient(#002A5B 0.5px, transparent 0.5px);
    background-size: 16px 16px;
}

/* Base custom text colors specific to DESIGN.md */
.text-primary { color: #FF6B00; }
.bg-primary { background-color: #FF6B00; }
.border-primary { border-color: #FF6B00; }
.bg-primary-container { background-color: #FF6B00; }
.bg-deep-blue { background-color: #002A5B; }
.text-deep-blue { color: #002A5B; }

/* Global Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Prevent layout shift during transitions */
body {
    overflow-x: hidden;
}

/* Scroll Animations */
.animate-on-scroll {
    opacity: 0;
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.animate-on-scroll.is-visible {
    opacity: 1;
    transform: none;
}

.fade-in {
    /* opacidad 0 por defecto */
}

.slide-up {
    transform: translateY(40px);
}

.slide-left {
    transform: translateX(40px);
}

.slide-right {
    transform: translateX(-40px);
}