/* Custom styles for Blend Nutrition */

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #faf6ed;
}
::-webkit-scrollbar-thumb {
    background: #9dc5a3;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #70a576;
}

/* Selection color */
::selection {
    background: #9dc5a3;
    color: #1f3823;
}

/* Geometric floating animations */
@keyframes float {
    0%, 100% { transform: rotate(45deg) translateY(0px); }
    50% { transform: rotate(45deg) translateY(-12px); }
}

@keyframes float-reverse {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-16px); }
}

.geo-shape.diamond-deco {
    animation: float 6s ease-in-out infinite;
}

.geo-shape.circle-deco {
    animation: float-reverse 8s ease-in-out infinite;
}

/* Subtle pulse for hero badge */
@keyframes subtle-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Image hover zoom for product cards */
.card-hover .aspect-\[4\/3\] img {
    transition: transform 0.5s ease;
}

/* Form focus states */
input:focus,
textarea:focus {
    box-shadow: 0 0 0 3px rgba(79, 138, 85, 0.15);
}

/* Mobile menu transitions */
#mobile-menu {
    transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
    opacity: 0;
}
#mobile-menu.open {
    max-height: 400px;
    opacity: 1;
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
    .geo-shape,
    .card-hover,
    .card-hover .aspect-\[4\/3\] img,
    .btn-primary,
    .btn-secondary {
        animation: none;
        transition: none;
    }
    html {
        scroll-behavior: auto;
    }
}