@import "tailwindcss";

@theme {
  --color-primary: #CC2128;
  --color-secondary: #1A1A1A;
}

/* Scroll Reveal Animations */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Delayed reveals for children */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* Scale Animation */
.scale-in {
    opacity: 0;
    transform: scale(0.9);
    transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.scale-in.active {
    opacity: 1;
    transform: scale(1);
}

/* Custom Gradients */
.bg-gradient-industrial {
    background: linear-gradient(135deg, #1a1a1a 0%, #333 100%);
}

.text-gradient-red {
    background: linear-gradient(90deg, #CC2128 0%, #ff4d4d 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Timeline Dotted Line */
.timeline-line {
    width: 2px;
    background-image: linear-gradient(to bottom, #CC2128 50%, transparent 50%);
    background-size: 2px 10px;
    background-repeat: repeat-y;
}

/* Angled Overlay */
.angled-overlay {
    clip-path: polygon(0 0, 100% 0, 90% 100%, 0% 100%);
}

/* Floating Trust Card */
.trust-card {
    background: #1A1A1A;
    border-top: 4px solid #CC2128;
    box-shadow: 0 30px 60px -12px rgba(0,0,0,0.25);
}

/* White Dotted Separator */
.dotted-separator-white {
    width: 1px;
    background-image: linear-gradient(to bottom, white 50%, transparent 50%);
    background-size: 1px 8px;
    background-repeat: repeat-y;
}

/* Professional Swiper/Carousel Customization (Simple CSS based) */
.custom-scrollbar::-webkit-scrollbar {
    height: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #CC2128;
    border-radius: 10px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: #f1f1f1;
}