/* Base styles */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    line-height: 1.6;
    color: #333;
    margin-left: 5%;
    margin-right: 0;
}

.container {
    padding-left: 2rem;
    padding-right: 0;
    margin-left: 0;
    margin-right: auto;
}
/* Custom animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.hero {
    animation: fadeIn 0.8s ease-out forwards;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.feature-card,
.showcase-item {
    animation: fadeIn 0.8s ease-out forwards;
    animation-delay: calc(var(--order) * 0.1s);
    opacity: 0;
}

.animate-fadeIn {
    animation: fadeIn 0.8s ease-out forwards;
}
/* Checkout page styles */
.payment-method-tab {
    transition: all 0.3s ease;
}

.payment-method-tab.active {
    border-bottom: 2px solid #ef4444;
    color: #ef4444;
}

.mollie-method img {
    max-height: 24px;
    object-fit: contain;
}

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

::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
    background: #10b981;
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #059669;
}
/* Navbar active state */
.nav-link.active {
    color: #10b981;
}

.nav-link.active::after {
    transform: scaleX(1) !important;
}
/* Get Started Guide styles */
.step-card {
    transition: all 0.3s ease;
}

.step-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(239, 68, 68, 0.1);
}
details {
    border-bottom: 1px solid #e5e7eb;
    padding: 1rem 0;
}

details[open] {
    padding-bottom: 1rem;
}

details summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 500;
    padding-right: 1rem;
}

details summary::-webkit-details-marker {
    display: none;
}

details summary:after {
    content: "+";
    font-size: 1.5rem;
    color: #ef4444;
    transition: transform 0.3s ease;
    line-height: 1;
}

details[open] summary:after {
    transform: rotate(45deg);
}

details > div {
    padding-top: 1rem;
    padding-left: 1rem;
    animation: fadeIn 0.3s ease-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}
/* Custom button styles */
.btn-primary {
    background-color: #10b981;
color: white;
    transition: all 0.3s ease;
}
.btn-primary:hover {
    background-color: #059669;
transform: translateY(-2px);
}
.btn-secondary {
    background-color: #059669;
color: white;
    transition: all 0.3s ease;
}

.btn-secondary:hover {
    background-color: #047857;
transform: translateY(-2px);
}

/* Responsive tweaks */
@media (max-width: 768px) {
    .hero-content {
        text-align: center;
    }
    
    .hero-buttons {
        justify-content: center;
    }
}