.modal-footer .btn-gold {
            display: inline-block;
            padding: 8px 18px;
            border-radius: 6px;
            background: linear-gradient(135deg, #FFD700, #A27702);
            /* ไล่เฉดทอง */
            color: #fff !important;
            font-weight: 600;
            text-decoration: none;
            transition: all 0.3s ease;
            border: none;
        }

        .modal-footer .btn-gold:hover {
            background: linear-gradient(135deg, #FFE55C, #C49000);
            color: #fff !important;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
            transform: translateY(-2px);
        }

        /* ===========================
                                                                        Luxury Theme Tokens
                                                                        =========================== */
        :root {
            --lux-bg: #0d0d0f;
            /* velvet black */
            --lux-bg-2: #15151a;
            /* deep charcoal */
            --lux-gold: #d4af37;
            /* champagne gold */
            --lux-gold-2: #f5e2a7;
            /* soft highlight gold */
            --lux-gold-dim: #9c7d26;
            /* dim gold for shadows */
            --lux-white: #f8f7f3;
            /* warm white */
        }

        body.no-scroll {
            overflow: hidden;
            height: 100vh;
            /* กันกรณีมือถือยังเลื่อน */
        }

        /* ===========================
                                                                        Splash Container
                                                                        =========================== */
        .duck-splash {
            position: fixed;
            inset: 0;
            z-index: 9999;
            display: grid;
            place-items: center;
            opacity: 1;
            transition: opacity .35s ease;
            pointer-events: none;
        }

        /* Luxury background: deep gradient + subtle vignette + noise */
        .duck-splash--luxury {
            /* multi-layer background */
            background:
                radial-gradient(1200px 600px at 50% 40%, rgba(245, 226, 167, 0.06), transparent 60%),
                radial-gradient(900px 500px at 50% 70%, rgba(212, 175, 55, 0.08), transparent 65%),
                linear-gradient(180deg, var(--lux-bg), var(--lux-bg-2));
            /* a very subtle noise using gradients (no external assets) */
            background-blend-mode: screen, screen, normal;
        }

        .duck-splash.is-hidden {
            opacity: 0;
            pointer-events: none;
            animation: duckRemove .4s forwards;
            animation-delay: .35s;
        }

        @keyframes duckRemove {
            to {
                visibility: hidden;
            }
        }

        /* ===========================
                                                                        Logo Wrap (Luxury motion)
                                                                        =========================== */
        .duck-splash__wrap {
            position: relative;
            width: clamp(112px, 22svw, 420px);
            box-sizing: content-box;
            aspect-ratio: 1 / 1;
            opacity: 0;
            transform: translateY(16px) scale(.985);
            animation: duckFadeIn 1000ms cubic-bezier(.22, .61, .36, 1) forwards 120ms;
            filter: drop-shadow(0 8px 40px rgba(212, 175, 55, .12)) drop-shadow(0 2px 14px rgba(0, 0, 0, .6));
            /* ป้องกัน overscale หาก container ใหญ่เกิน */
            max-width: min(90svw, 520px);
            max-height: 90svh;
        }

        /* Gold halo ring (subtle, slow shimmer) */
        .duck-splash__wrap::before {
            content: "";
            position: absolute;
            inset: -10%;
            border-radius: 999px;
            background:
                conic-gradient(from 0deg,
                    rgba(212, 175, 55, 0) 0%,
                    rgba(212, 175, 55, .25) 15%,
                    rgba(245, 226, 167, .35) 28%,
                    rgba(212, 175, 55, .2) 40%,
                    rgba(212, 175, 55, 0) 55%,
                    rgba(156, 125, 38, .18) 70%,
                    rgba(212, 175, 55, 0) 100%);
            filter: blur(18px);
            animation: haloSpin 6.5s linear infinite;
            pointer-events: none;
        }

        @keyframes haloSpin {
            to {
                transform: rotate(360deg);
            }
        }

        @keyframes duckFadeIn {
            0% {
                transform: translateY(16px) scale(.985);
                opacity: 0;
            }

            100% {
                transform: translateY(0) scale(1);
                opacity: 1;
            }
        }

        /* ===========================
                                                                        Logo Image
                                                                        =========================== */
        .duck-splash__img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
            /* subtle sheen passing over logo */
            -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 70%, transparent 100%);
            mask-image: radial-gradient(circle at 50% 50%, #000 70%, transparent 100%);
        }

        /* Subtle sheen using overlay gradient */
        .duck-splash__img::selection {
            background: transparent;
        }

        .duck-closed {
            animation: none;
        }

        /* Optional: add a live sheen sweep via pseudo overlay */
        .duck-splash__img+.sheen {
            display: none;
        }

        .modal-body img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.modal-body {
  min-height: 300px;  /* กันเด้งตอนโหลดรูป */
  display: flex;
  justify-content: center;
  align-items: center;
}

        /* reserved if you want to add extra layer */

        /* ===========================
             Reduce Motion
      =========================== */
        @media (prefers-reduced-motion: reduce) {

            .duck-splash,
            .duck-splash.is-hidden,
            .duck-splash__wrap,
            .duck-splash__img,
            .duck-closed {
                animation: none !important;
                transition: none !important;
            }
        }