@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css');

:root {
  --primary-color: #0A141E; /* Deep Deep Blue */
  --secondary-color: #202020; /* Dark Neutral */
  --accent-color: #00B5E2; /* Cyan */
  --light-color: #F0F2F5; /* Neutral Light Gray */
  --dark-color: #000000; /* Pure Black */
  --gradient-primary: linear-gradient(135deg, #0A141E 0%, #202020 100%);
  --hover-color: #007DA1; /* Deep Cyan */
  --background-color: #050A10; /* Extra Deep Dark */
  --text-color: #E0E4E8; /* Light Neutral Gray */
  --border-color: rgba(0, 181, 226, 0.3); /* Cyan Border */
  --divider-color: rgba(240, 242, 245, 0.1); /* Neutral Light Border */
  --shadow-color: rgba(0, 0, 0, 0.8); /* Dark Shadow */
  --highlight-color: #FAFAFA; /* Bright Light Highlight */
  --main-font: 'Roboto Slab', serif;
  --alt-font: 'Montserrat', sans-serif;
}

html {
    scroll-behavior: smooth;
}

.feature-item:hover {
    transform: translateY(-5px);
    border-color: var(--accent-color);
    box-shadow: 0 10px 20px var(--shadow-color);
    transition: all 0.4s ease;
}

input:focus, textarea:focus {
    outline: none;
    border-color: var(--highlight-color) !important;
    box-shadow: 0 0 10px rgba(250, 250, 250, 0.5);
}

::placeholder {
    color: rgba(255, 255, 255, 0.4);
}