:root {
    --bg-dark: #121417;
    --bg-card: #1b1e23;
    --accent-cyan: #06b6d4;
    --accent-blue: #3b82f6;
    --border: #2d333b;
}
body { font-family: 'Inter', sans-serif; background-color: var(--bg-dark); color: #e5e7eb; }
.glass-panel { background: var(--bg-card); border: 1px solid var(--border); }
.cyan-text { color: var(--accent-cyan); }
.bg-cyan { background-color: var(--accent-cyan); }
.border-cyan { border-color: var(--accent-cyan); }
.gradient-cyan { background: linear-gradient(90deg, #06b6d4, #3b82f6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--bg-dark); }
::-webkit-scrollbar-thumb { background: #2d333b; border-radius: 5px; }

#home .glass-panel img {
    filter: none !important;
    -webkit-filter: none !important;
    opacity: 1 !important;
    transition: transform 0.5s ease, filter 0.5s ease;
}

/* Responsive tweaks for tablet */
@media (max-width: 768px) {
    nav { padding-left: 1rem; padding-right: 1rem; }
    #home { padding-top: 6rem; padding-bottom: 4rem; }
    #home h1 { font-size: 2.25rem; }
    #home p { font-size: 1rem; }
    .glass-panel.p-12, .glass-panel.p-10 { padding: 1.25rem; }
    .grid.md\:grid-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Responsive tweaks for phone */
@media (max-width: 480px) {
    #home { padding-top: 5rem; padding-bottom: 3rem; }
    #home h1 { font-size: 1.75rem; }
    #home p { font-size: 0.95rem; }
    .text-5xl { font-size: 2rem; }
    .text-4xl { font-size: 1.5rem; }
    .max-w-7xl { padding-left: 1rem; padding-right: 1rem; }
    .mt-24 { margin-top: 1.5rem; }
}