/* Custom styles for Growth Hackers redesign */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&family=Outfit:wght@300;400;600&display=swap');

:root {
    --accent: #4fa456;
    --accent-light: #61ce70;
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: #000000;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #000000;
}

::-webkit-scrollbar-thumb {
    background: #1b1b1b;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--accent);
}

/* Animations */
.animate-in {
    opacity: 1;
    transform: translateY(0);
}

/* Scrollytelling transitions */
[data-process-image] {
    transition: opacity 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Custom Utilities */
.rounded-tab {
    border-radius: 0px 32px 0px 0px;
}

/* Grid Layout for Services */
.grid-cols-1px {
    grid-template-columns: repeat(auto-fit, minmax(1px, 1fr));
}

/* Form Styles */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus {
    -webkit-text-fill-color: white;
    -webkit-box-shadow: 0 0 0px 1000px #000000 inset;
    transition: background-color 5000s ease-in-out 0s;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .rounded-tab {
        border-radius: 0px 24px 0px 0px;
    }
}