/* Warm & Professional Scientific Design System — Soft Palette */

:root {
    --color-base: #F7F5F0;
    --color-surface: #EBE6DB;
    --color-surface-alt: #DFD6C5;
    --color-warm-dark: #1E1A16;
    --color-brand-600: #29437A;
    --color-brand-500: #3D5E9E;
    --color-brand-400: #5F82C4;
    --color-accent-red: #E61919;
    --color-accent-eco: #12642B;
    --color-text-primary: #1E1A16;
    --color-text-secondary: #423A30;
    --color-text-muted: #595042;
    --glass-background: linear-gradient(135deg, rgba(247, 245, 240, 0.92), rgba(235, 230, 219, 0.88));
    --glass-border: 1px solid rgba(41, 67, 122, 0.12);
}

/* Softer Warm Background */
body {
    background-color: var(--color-base);
    background-image:
        radial-gradient(circle at 15% 15%, rgba(61, 94, 158, 0.05) 0%, transparent 45%),
        radial-gradient(circle at 85% 25%, rgba(230, 25, 25, 0.04) 0%, transparent 50%),
        radial-gradient(circle at 50% 60%, rgba(15, 139, 141, 0.03) 0%, transparent 55%);
    background-size: 100% 100%;
    background-attachment: fixed;
}

/* ──── Premium Header ──── */
.glass-nav {
    background: rgba(44, 37, 32, 0.95);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-bottom: none;
    box-shadow: 0 4px 30px -8px rgba(0, 0, 0, 0.2);
}

/* ──── Cards ──── */
.glass-card {
    background: var(--glass-background);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: var(--glass-border);
    box-shadow: 0 8px 32px -12px rgba(26, 35, 50, 0.1);
}

.glass-card-hover {
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.glass-card-hover:hover {
    transform: translateY(-8px) scale(1.01);
    border-color: rgba(15, 139, 141, 0.35);
    box-shadow: 0 20px 48px -12px rgba(15, 139, 141, 0.15);
}

/* Cursor Follower for Desktop */
.cursor-follower {
    width: 36px;
    height: 36px;
    border: 1.5px solid rgba(15, 139, 141, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    border-radius: 50%;
    pointer-events: none;
    z-index: 9999;
    transform: translate(-50%, -50%);
    transition: width 0.2s, height 0.2s, border-color 0.2s, background-color 0.2s;
    transition-timing-function: ease-out;
}

/* Warm Gradient Text */
.text-gradient {
    background: linear-gradient(135deg, #0D7377 0%, #0F8B8D 40%, #14A3A8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gradient-gold {
    background: linear-gradient(135deg, #C28B30 0%, #D4A04A 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 9px;
}
::-webkit-scrollbar-track {
    background: #E4DED4;
}
::-webkit-scrollbar-thumb {
    background: #C4BAA8;
    border-radius: 5px;
    border: 1px solid rgba(15, 139, 141, 0.15);
}
::-webkit-scrollbar-thumb:hover {
    background: #0F8B8D;
    box-shadow: 0 0 10px rgba(15, 139, 141, 0.4);
}

/* Scroll Reveal Animations */
.reveal {
    opacity: 0;
    transform: translateY(35px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

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

.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }

/* Preloader */
#preloader {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: #EDE8E0;
    z-index: 10000;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.4s ease;
}

.loader-ring {
    width: 75px;
    height: 75px;
    border: 3px solid rgba(15, 139, 141, 0.15);
    border-radius: 50%;
    border-top-color: #0F8B8D;
    animation: spin 0.85s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Warm Accent Badges & Buttons */
.glow-badge {
    box-shadow: 0 2px 16px rgba(41, 67, 122, 0.15);
}

.glow-btn {
    box-shadow: 0 4px 20px rgba(41, 67, 122, 0.2);
    transition: all 0.3s ease;
}

.glow-btn:hover {
    box-shadow: 0 6px 28px rgba(41, 67, 122, 0.35);
    transform: translateY(-2px);
}

/* Responsive Device Adaptations & Accessibility */
@media (max-width: 640px) {
    .glass-card {
        padding: 1.25rem !important;
    }
    #chat-window {
        width: calc(100vw - 2rem) !important;
        right: -1rem !important;
        bottom: 4.5rem !important;
    }
}

/* Floating CSS Shape Animation */
@keyframes floatShape {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    25% { transform: translateY(-18px) rotate(3deg); }
    50% { transform: translateY(-8px) rotate(-2deg); }
    75% { transform: translateY(-22px) rotate(1deg); }
}

/* Ensure page sections stack above the 3D canvas */
header, main, footer, #preloader {
    position: relative;
    z-index: 1;
}

/* ──── Premium Footer ──── */
.footer-dark {
    background: linear-gradient(180deg, #2C2520 0%, #1A1510 100%);
}

.footer-dark a {
    transition: color 0.2s ease;
}

/* Header nav link hover underline animation */
.nav-link-dark {
    position: relative;
    padding-bottom: 2px;
}
.nav-link-dark::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: #14A3A8;
    transition: width 0.3s ease;
}
.nav-link-dark:hover::after {
    width: 100%;
}