@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Poppins:wght@400;500;600&display=swap');

/* ---------------------------------------
   BODY & BACKGROUND
--------------------------------------- */
body {
    background: #1b0015 
        url("../images/backgrounds/theme/pink-glam/neon-glam.jpg") 
        center/cover fixed no-repeat;
    font-family: "Poppins", sans-serif;
    color: #ffd6f0;
}

/* Glam glow overlay */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at 50% 50%, rgba(255,0,150,0.25), transparent 70%),
        radial-gradient(circle at 20% 20%, rgba(255,100,200,0.15), transparent 65%);
    pointer-events: none;
    z-index: 1;
}

/* ---------------------------------------
   MODAL
--------------------------------------- */
.sale-modal {
    position: relative;
    z-index: 2;
    padding: 3rem;
    border-radius: 20px;

    background: rgba(60, 0, 50, 0.65);
    backdrop-filter: blur(16px) saturate(1.4);
    border: 1px solid rgba(255, 50, 180, 0.5);

    box-shadow:
        0 0 35px rgba(255, 20, 180, 0.55),
        inset 0 0 25px rgba(255, 100, 200, 0.25);
}
.sale-modal .domain-name {
    font-size:3rem;
    background:linear-gradient(45deg,#ffeedf,#ffd0f6,#fff3c8,#ffd4ed);
    -webkit-background-clip:text;
    color:transparent;
    text-shadow:0 0 20px rgba(255,200,230,0.6);
    animation:pulse-glow 1.8s infinite alternate ease-in-out;
}

/* ---------------------------------------
   TYPOGRAPHY
--------------------------------------- */
.sale-modal h1 {
    font-family: "Great Vibes", cursive;
    font-size: 2.2rem;
    color: #ff33cc;
    text-shadow: 
        0 0 16px #ff66dd88,
        0 0 28px #ff99ee55;
    margin-top: 0;
}

.sale-modal p {
    font-size: 1.15rem;
    color: #ffc0f0;
    opacity: 0.95;
}

.sale-price {
    font-size: 1.8rem;
    font-weight: 700;
    color: #ff00aa;
    text-shadow: 0 0 18px #ff77cc77, 0 0 28px #ff99ee33;
}

/* ---------------------------------------
   BUTTON
--------------------------------------- */
a.contact-btn {
    display: inline-block;
    padding: 0.9rem 1.6rem;
    margin-top: 1rem;
    font-weight: 600;
    border-radius: 14px;
    text-decoration: none;
    color: #1b0015;

    background: linear-gradient(135deg, #ff33cc, #ff66ee, #ff99ff);
    box-shadow: 0 0 20px #ff66ccaa, 0 0 35px #ff33ee77;
    transition: 0.18s ease-out;
}

a.contact-btn:hover {
    transform: scale(1.08);
    box-shadow: 0 0 32px #ff66ccff, 0 0 50px #ff33eeaa;
}

/* ---------------------------------------
   QR CODE
--------------------------------------- */
#qr, img[alt="QR code"] {
    filter: drop-shadow(0 0 14px #ff33eecc);
}
