.site-footer{background:#111;padding:80px 20px;text-align:center;border-top:1px solid #333;position:relative}
.contact-box{position:fixed !important;left:20px !important;top:460px !important;width:250px;padding:10px 12px;background:rgba(10,10,10,.95);border-radius:16px;color:white;text-align:left;min-height: auto !important;
    height: auto !important;box-shadow:0 15px 40px rgba(0,0,0,.8);z-index:9999}
.contact-box h3{color:#ff8800;margin:0 0 6px 0;text-align:left}.contact-box p{margin:4px 0;line-height:1.4}.contact-box a{color:white;text-decoration:none}
@keyframes contactSlide{to{transform:translateX(0);opacity:1}}
.social-section{text-align:center;max-width:900px;margin:auto}.social-section h2{color:#ff8800;margin-bottom:30px;font-size:32px}
.social-links{display:flex;justify-content:center;gap:40px;flex-wrap:wrap}.social-icon{text-decoration:none;color:#ff8800;text-align:center}.social-icon img{width:72px;height:72px;margin-bottom:6px;transition:transform .4s ease;transform-style:preserve-3d}
.social-icon:hover img{animation:dance .8s ease-in-out infinite}.social-icon:hover div{animation:text-bounce .8s ease-in-out infinite}
@keyframes dance{0%,100%{transform:translateY(0) rotateX(0) rotate(0)}25%{transform:translateY(-12px) rotateX(18deg) rotate(8deg)}50%{transform:translateY(0) rotateX(-18deg) rotate(-8deg)}75%{transform:translateY(-10px) rotateX(12deg) rotate(6deg)}}
@keyframes text-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.footer-registration{max-width:900px;margin:2rem auto 1rem;padding:1rem;background:#222;border-radius:8px;text-align:center;color:#fff;border:1px solid #ff8800}.registration-title{margin:0 0 .5rem 0;font-weight:bold}.registration-text{margin:0;font-size:1rem;text-transform:uppercase;color:#ff8800}
.footer-brand{margin-top:1rem}.footer-brand a,.footer-links a{color:orange;transition:.3s;font-weight:bold}.footer-links a:hover,.footer-brand a:hover{color:orange;font-weight:bold;text-decoration:underline}
.footer-links{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap}
.ssl-seal{position:fixed;bottom:3px;left:20px;z-index:9999}
.floating-qr-unit{position:fixed !important;right:30px !important;top:310px !important;width:230px !important;z-index:9999 !important;background:rgba(10,10,10,.95) !important;backdrop-filter:blur(8px) !important;-webkit-backdrop-filter:blur(8px) !important;border-radius:16px !important;padding:16px 16px 12px 16px !important;box-shadow:0 15px 40px rgba(0,0,0,.8),0 0 0 1px rgba(255,136,0,.3) !important;border:none !important;transition:transform .3s ease,box-shadow .3s ease !important;text-align:center !important;pointer-events:auto !important;margin:0 !important;display:block !important}
.floating-qr-unit:hover{transform:scale(1.03) !important;box-shadow:0 20px 50px rgba(0,0,0,.9),0 0 0 2px #ff8800 !important}.floating-qr-unit a{text-decoration:none !important;display:block !important;color:inherit !important}
.floating-qr-unit img{width:100% !important;height:auto !important;display:block !important;border-radius:12px !important;border:2px solid #ff8800 !important;box-shadow:0 4px 10px rgba(0,0,0,.5) !important}
.qr-caption{margin-top:12px !important;color:#ff8800 !important;font-size:1rem !important;font-weight:700 !important;text-align:center !important;padding:6px 0 2px 0 !important;letter-spacing:.5px !important;text-transform:uppercase !important}
.qr-caption span{color:#ffffff !important;font-weight:400 !important;display:block !important;font-size:.85rem !important;margin-top:4px !important;text-transform:none !important;letter-spacing:normal !important;opacity:.9 !important}
.phone-container{text-align:center;margin-bottom:12px;padding:8px 0;}.phone-vanity{color:#ff8800;font-size:1.3rem;font-weight:700;letter-spacing:1px}.phone-vanity a{color:#ff8800 !important;text-decoration:none !important;display:inline-block !important}.phone-numeric{color:#ffffff;font-size:1rem;font-weight:400;opacity:.9;margin-top:4px}.phone-numeric a{color:#ffffff !important;text-decoration:none !important;display:inline-block !important}.phone-vanity a:hover,.phone-numeric a:hover{text-decoration:underline !important;opacity:1}
.donation-option {
    margin-top: 12px;
    text-align: center;
}

.donation-option img {
    width: 100%;
    max-width: 120px;
    height: auto;
    border-radius: 12px;
    border: 2px solid #ff8800;
}

.donation-link {
    text-decoration: none;
    display: block;
}
/* ===== MOBILE FIXES ===== */
@media (max-width: 768px) {
    /* Collapsible QR unit — small circle, expands on tap */
    .floating-qr-unit {
        width: 56px !important;
        height: 56px !important;
        right: 10px !important;
        top: 60px !important;
        padding: 0 !important;
        border-radius: 28px !important;
        overflow: hidden;
        transition: width 0.3s ease, height 0.3s ease, border-radius 0.3s ease;
        cursor: pointer;
        background: rgba(10, 10, 10, 0.95) !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important;
    }
    
    /* Expand when tapped (class toggled by JavaScript) */
    .floating-qr-unit.tapped {
        width: 180px !important;
        height: auto !important;
        padding: 12px !important;
        border-radius: 16px !important;
    }
    
    /* Hide extra content initially */
    .floating-qr-unit .phone-container,
    .floating-qr-unit .qr-caption {
        display: none;
    }
    
    /* Show when expanded */
    .floating-qr-unit.tapped .phone-container,
    .floating-qr-unit.tapped .qr-caption {
        display: block;
    }
    
    /* QR image size when collapsed */
    .floating-qr-unit img {
        width: 156px !important;
        height: 156px !important;
        margin: 0 auto;
        transition: width 0.3s ease;
        border: 1px solid #ff8800 !important;
    }
    
    /* Image size when expanded */
    .floating-qr-unit.tapped img {
        width: 100% !important;
        height: auto !important;
    }
    
    /* Hide contact box on mobile */
    .contact-box {
        display: none !important;
    }
    
    /* Adjust gallery grid */
    .gallery-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    
    /* Make main content padding smaller */
    main {
        margin: 1rem !important;
        padding: 1.5rem !important;
    }
    
    /* Adjust hero text */
    .tagline {
        font-size: 1.2rem !important;
        bottom: 20px !important;
    }
    
    /* Card header adjustment */
    .memorial-card .card-header {
        min-height: 100px !important;
        padding: 1rem !important;
    }
}