﻿/*
Theme Name: Dien Dan Tu Landing Page
Description: Theme Landing Page Tuyen Sinh Dien Dien Tu - CĐ Phuong Dong
Version: 2.0 Pro Design
Author: Prompted AI
*/

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Montserrat:wght@400;500;600;700;800;900&display=swap");

body {
    font-family: "Inter", sans-serif;
    color: #1f2937;
    background-color: #f8fafc;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, .font-heading {
    font-family: "Montserrat", sans-serif;
}

/* Typography Enhancements */
.text-gradient {
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(to right, #1d4ed8, #2563eb); /* Blue 700 to 600 */
}
.text-gradient-red {
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(to right, #dc2626, #ef4444); /* Red 600 to 500 */
}

/* Glassmorphism */
.glass {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.07);
}
.glass-dark {
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Animations */
@keyframes pulse-red-glow {
    0% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.7); }
    70% { box-shadow: 0 0 0 20px rgba(220, 38, 38, 0); }
    100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0); }
}

.btn-blinking {
    animation: pulse-red-glow 2s infinite;
    background-image: linear-gradient(to right, #dc2626, #b91c1c);
    border: 1px solid #f87171;
}

.btn-blinking:hover {
    background-image: linear-gradient(to right, #b91c1c, #991b1b);
}

/* Fade in up effect */
.fade-in-up {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.fade-in-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.stagger-1 { transition-delay: 100ms; }
.stagger-2 { transition-delay: 200ms; }
.stagger-3 { transition-delay: 300ms; }
.stagger-4 { transition-delay: 400ms; }

/* Custom Hover Effects */
.hover-card-pro {
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
}

.hover-card-pro:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 25px 50px -12px rgba(29, 78, 216, 0.15); /* Blue-tinted shadow */
    z-index: 10;
}

/* Custom Gradients */
.bg-gradient-blue-red {
    background: linear-gradient(135deg, #1e3a8a 0%, #1d4ed8 50%, #dc2626 100%);
}

