/* Custom styles that complement Tailwind and the inline styles in index.html */

/* Ensure smooth rendering on all devices */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Selection color */
::selection {
    background: rgba(212, 154, 42, 0.3);
    color: #f5f5f5;
}

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

/* Reduced motion - ensure content is always visible */
@media (prefers-reduced-motion: reduce) {
    .reveal {
        opacity: 1 !important;
        transform: none !important;
    }
    .cta-pulse {
        animation: none;
    }
    .gold-shimmer {
        animation: none;
        background: linear-gradient(135deg, #e5b03f 0%, #d49a2a 50%, #b87a1e 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
}

/* Print styles */
@media print {
    .nav-glass, .mobile-menu, #menuOverlay {
        display: none !important;
    }
    body {
        background: white;
        color: black;
    }
    .gold-gradient, .gold-shimmer {
        -webkit-text-fill-color: #b87a1e;
        color: #b87a1e;
    }
}

/* Mobile-specific adjustments */
@media (max-width: 640px) {
    #hero h1 {
        font-size: 2rem;
    }
    #hero h1 span:last-child {
        font-size: 1.25rem;
    }
}

/* Smooth focus for anchor links */
:target {
    scroll-margin-top: 80px;
}
