/* style.css */

/* Dark Mode (Default) */
:root {
    --accent: #325bcb;
    --bg-primary: #121212; /* Modern Dark Grey */
    --bg-secondary: #18181b; /* Slightly lighter grey for contrast */
    --text-primary: #ffffff;
    --text-secondary: #d1d5db; /* gray-300 */
    --border-color: rgba(255, 255, 255, 0.1);
    --input-border: #333333;
    --logo-filter: none;
    --nav-bg: rgba(18, 18, 18, 0.85);
    --card-hover-bg: rgba(255, 255, 255, 0.05);
}

/* Light Mode Theme */
.light-mode {
    --bg-primary: #ffffff;
    --bg-secondary: #f8f9fa;
    --text-primary: #0a0a0a;
    --text-secondary: #4b5563; /* gray-600 */
    --border-color: rgba(0, 0, 0, 0.1);
    --input-border: #e5e7eb;
    --logo-filter: invert(1);
    --nav-bg: rgba(255, 255, 255, 0.85);
    --card-hover-bg: rgba(50, 91, 203, 0.05);
}

/* Base Transition for Smooth Theme Switching */
body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
    font-family: 'Inter', sans-serif;
    overflow-x: hidden;
    transition: background-color 0.3s ease, color 0.3s ease;
}

h1, h2, h3, .display-font {
    font-family: 'Space Grotesk', sans-serif;
    letter-spacing: -0.03em;
}

/* Utility Colors */
.text-accent { color: var(--accent); }
.bg-accent { background-color: var(--accent); }
.border-accent { border-color: var(--accent); }
.fill-accent { fill: var(--accent); }

/* Theme-dependent Utility Classes */
.theme-text-primary { color: var(--text-primary); }
.theme-text-secondary { color: var(--text-secondary); }
.theme-bg-primary { background-color: var(--bg-primary); }
.theme-bg-secondary { background-color: var(--bg-secondary); }
.theme-border { border-color: var(--border-color); }
.theme-logo { filter: var(--logo-filter); transition: filter 0.3s ease; }
.theme-nav-bg { background-color: var(--nav-bg); }

/* Custom Selection */
::selection {
    background-color: var(--accent);
    color: white;
}

/* Gradients */
.text-gradient-colorful {
    background: linear-gradient(to right, #a855f7, #ec4899, #f43f5e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Animations */
.reveal {
    opacity: 0;
    transform: translateY(20px);
    animation: revealAnim 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.reveal-delay-1 { animation-delay: 0.1s; }
.reveal-delay-2 { animation-delay: 0.2s; }
.reveal-delay-3 { animation-delay: 0.3s; }

@keyframes revealAnim {
    to { opacity: 1; transform: translateY(0); }
}

.geo-spin {
    animation: spin-slow 10s linear infinite;
}
@keyframes spin-slow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Swiss Form Inputs */
.swiss-input {
    background-color: transparent;
    border-bottom: 1px solid var(--input-border);
    color: var(--text-primary);
    padding: 1rem 0;
    width: 100%;
    transition: all 0.3s ease;
    font-family: 'Inter', sans-serif;
    font-weight: 300;
}
.swiss-input:focus {
    outline: none;
    border-bottom-color: var(--accent);
}
.swiss-input::placeholder { color: var(--text-secondary); }

/* Checkbox/Tag Styling */
.expertise-checkbox:checked + div {
    background-color: var(--accent);
    border-color: var(--accent);
    color: white;
}

/* --- Modal Logic --- */
.modal-overlay {
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Inner content scaling animation */
.modal-content {
    transform: scale(0.95) translateY(20px);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.modal-overlay.active .modal-content {
    transform: scale(1) translateY(0);
    opacity: 1;
}

/* Custom Scrollbar for Modals */
.custom-scrollbar::-webkit-scrollbar { width: 8px; }
.custom-scrollbar::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.05); }
.custom-scrollbar::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.2); border-radius: 4px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.3); }