/* Amsterdam Coffee Bar — Custom Styles */

/* Base & Typography */
body {
    font-family: 'Outfit', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4 {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
}

/* Smooth scroll offset for fixed nav */
section[id] {
    scroll-margin-top: 80px;
}

/* Selection color */
::selection {
    background: #A7F3D0;
    color: #064E3B;
}

/* Focus styles */
*:focus-visible {
    outline: 2px solid #10B981;
    outline-offset: 2px;
}

/* Image lazy loading fade */
img[loading="lazy"] {
    transition: opacity 0.3s ease;
}

/* Custom button ripple */
.btn-primary, .btn-outline {
    position: relative;
    overflow: hidden;
}

/* Card hover effects */
.menu-card {
    will-change: transform;
}

/* Mobile menu animation */
.mobile-menu-open {
    overflow: hidden;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    html {
        scroll-behavior: auto;
    }
    .card-float-1, .card-float-2, .card-float-3 {
        animation: none;
    }
}

/* Print styles */
@media print {
    nav, .animate-bounce, #contactForm, .reveal {
        display: none !important;
    }
    body {
        color: #000;
        background: #fff;
    }
    .hero-gradient {
        background: #064E3B !important;
        color: #fff !important;
    }
}

/* High contrast mode support */
@media (forced-colors: active) {
    .btn-primary {
        border: 2px solid ButtonText;
    }
    .menu-card {
        border: 1px solid ButtonText;
    }
}

/* Tablet and up adjustments */
@media (min-width: 768px) {
    .hero-gradient {
        background: linear-gradient(160deg, #064E3B 0%, #065F46 35%, #047857 70%, #059669 100%);
    }
}

/* Ultra-wide screens */
@media (min-width: 1920px) {
    .max-w-7xl {
        max-width: 80rem;
    }
}
