/* Custom styles for smooth scrolling and effects */
    body {
        font-family: 'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif;
    }

    .bg-parallax {
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    @media (max-width: 768px) {
        .bg-parallax {
            background-attachment: scroll;
        }
    }

    .navbar-transparent {
        background: transparent;
        transition: background-color 0.3s ease;
    }

    .navbar-solid {
        background: rgba(0, 0, 0, 0.5);
    }

    .gold-accent {
        background: linear-gradient(90deg, #8c6a12 0%, #FFBB19 100%);
    }

    .gold-border {
        border-color: linear-gradient(90deg, #8c6a12 0%, #FFBB19 100%);
    }

    .white-button {
        background: linear-gradient(135deg, #fff 0%, #fff 100%);
        /* background: white;             */
        color:#555;
        transition: all 0.3s ease;
    }

    .gold-button {
        background: linear-gradient(135deg, #8c6a12 0%, #FFBB19 100%);
        color:white;
        transition: all 0.3s ease;
    }

    .gold-button:hover, .white-button:hover  {
        background: linear-gradient(135deg, #FFBB19 0%, #FFBB19 100%);
        /* linear-gradient(135deg,  0%, #8c6a12 100%); */
        /* transform: scale(1.05); */
    }
    .overlay {
        background-image: url('/assets/img/hdr-cover-75a.png');
        background-repeat: repeat;
        background-size: auto;
    }

    .overlay-gold {
        background-image: url('/assets/img/hdr-cover-gold.png') !important;
    }

    .hero-logo {
        image-rendering: crisp-edges;
        image-rendering: -webkit-optimize-contrast;
    }

    /* Modal Styles */
    .modal-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.7);
        z-index: 9998;
        animation: fadeIn 0.3s ease;
    }

    .modal-overlay.active {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .modal-content {
        background: white;
        border-radius: 12px;
        padding: 2rem;
        max-width: 600px;
        width: 90%;
        max-height: 90vh;
        overflow-y: auto;
        position: relative;
        animation: slideUp 0.3s ease;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    }

    .modal-close {
        position: absolute;
        top: 1rem;
        right: 1rem;
        background: none;
        border: none;
        font-size: 1.5rem;
        cursor: pointer;
        color: #666;
        transition: color 0.3s ease;
    }

    .modal-close:hover {
        color: #000;
    }

    /* Alert Bar Styles */
    .alert-bar {
        position: fixed;
        bottom: -100px;
        left: 0;
        right: 0;
        background: linear-gradient(135deg, #0F5F3A 0%, #2ECC71 100%);
        color: white;
        padding: 1rem 2rem;
        text-align: center;
        z-index: 9999;
        transition: bottom 0.5s ease;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.2);
    }

    .alert-bar.show {
        bottom: 0;
    }

    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    @keyframes slideUp {
        from {
            opacity: 0;
            transform: translateY(50px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }