/* ═══════════════════════════════════════════════════════════════
   RECYCLEHELPER — Global Polish Layer
   Transitions · Hovers · Glows · Shadows
   Applied to all pages.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. Page enter / exit ──────────────────────────────────────── */
body.rh-entering {
    animation: rhPageIn 0.58s cubic-bezier(0.4, 0, 0.2, 1) both;
}
body.rh-leaving {
    opacity: 0 !important;
    transform: translateY(-10px) !important;
    pointer-events: none;
    transition: opacity 0.34s ease, transform 0.34s ease !important;
}
@keyframes rhPageIn {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── 2. Scroll-reveal utility ──────────────────────────────────── */
.rh-reveal {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.91s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.91s cubic-bezier(0.4, 0, 0.2, 1);
}
.rh-reveal.rh-visible { opacity: 1; transform: translateY(0); }

.rh-reveal:nth-child(2) { transition-delay: 0.1s; }
.rh-reveal:nth-child(3) { transition-delay: 0.2s; }
.rh-reveal:nth-child(4) { transition-delay: 0.3s; }
.rh-reveal:nth-child(5) { transition-delay: 0.4s; }

/* ══════════════════════════════════════════════════════════════
   3. NAVIGATION
══════════════════════════════════════════════════════════════ */
.nav-link {
    transition: transform 0.31s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.31s ease,
                color 0.29s ease,
                letter-spacing 0.31s ease !important;
}
.nav-link:hover {
    letter-spacing: 0.04em;
    transform: translateY(-5px) scale(1.07) !important;
    box-shadow: 0 0 72px 24px #00FF6A, 0 6px 20px rgba(0,0,0,0.2) !important;
}
.nav-link:active {
    transform: translateY(-1px) scale(0.98) !important;
    transition-duration: 0.1s !important;
}

/* ══════════════════════════════════════════════════════════════
   4. HEADINGS
══════════════════════════════════════════════════════════════ */
h1 {
    transition: none;
}
h2 {
    cursor: default;
}

/* ══════════════════════════════════════════════════════════════
   5. UNIVERSAL BUTTON BASE
══════════════════════════════════════════════════════════════ */
button:not(:disabled),
a.about-cta-btn,
a.donate-email-btn {
    transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.28s ease,
                filter 0.28s ease,
                background 0.28s ease !important;
}
button:not(:disabled):active {
    transform: scale(0.95) !important;
    filter: brightness(0.92) !important;
    transition-duration: 0.1s !important;
}

/* ══════════════════════════════════════════════════════════════
   6. SEARCH & SCAN
══════════════════════════════════════════════════════════════ */
.search-container {
    transition: box-shadow 0.36s ease, transform 0.36s ease,
                background 0.36s ease !important;
}
.search-container:focus-within {
    transform: scale(1.025) !important;
    box-shadow: 0 0 0 3px rgba(36, 228, 116, 0.4),
                0 8px 24px rgba(0, 0, 0, 0.16) !important;
    background: rgba(255, 255, 255, 0.58) !important;
}
.scan-item-btn {
    transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.28s ease,
                background 0.28s ease,
                border-color 0.28s ease !important;
}
.scan-item-btn:not(:disabled):hover {
    transform: translateY(-3px) scale(1.05) !important;
    box-shadow: 0 8px 28px rgba(36, 228, 116, 0.4),
                0 0 30px rgba(36, 228, 116, 0.22) !important;
}

/* Primary buttons */
.primary-btn {
    transition: transform 0.31s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.31s ease,
                filter 0.31s ease !important;
}
.primary-btn:not(:disabled):hover {
    transform: translateY(-4px) scale(1.06) !important;
    box-shadow: 0 12px 36px rgba(45, 168, 100, 0.55),
                0 0 36px rgba(36, 228, 116, 0.28) !important;
    filter: brightness(1.06) !important;
}

/* ══════════════════════════════════════════════════════════════
   6b. CALCULATE RECYCLING IMPACT BUTTON (#nextBtn)
══════════════════════════════════════════════════════════════ */
#nextBtn {
    position: relative;
    overflow: hidden;
    animation: nextBtnPulse 2.8s ease-in-out infinite;
    transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.42s ease,
                filter 0.42s ease,
                background 0.42s ease !important;
}

/* Shimmer sweep on hover */
#nextBtn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -120%;
    width: 70%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent 0%,
        rgba(255, 255, 255, 0.38) 50%,
        transparent 100%
    );
    transition: left 0.65s ease;
    pointer-events: none;
}
#nextBtn:hover::before { left: 160%; }

#nextBtn:not(:disabled):hover {
    transform: translateY(-6px) scale(1.09) !important;
    box-shadow:
        0 16px 48px rgba(45, 168, 100, 0.65),
        0 0 60px rgba(36, 228, 116, 0.45),
        0 0 110px rgba(0, 255, 100, 0.22) !important;
    filter: brightness(1.1) !important;
    animation-play-state: paused;
}
#nextBtn:active {
    transform: scale(0.97) translateY(-2px) !important;
    transition-duration: 0.1s !important;
}

@keyframes nextBtnPulse {
    0%, 100% {
        box-shadow: 0 6px 24px rgba(45, 168, 100, 0.35),
                    0 0 18px rgba(36, 228, 116, 0.15);
    }
    50% {
        box-shadow: 0 8px 32px rgba(45, 168, 100, 0.58),
                    0 0 44px rgba(36, 228, 116, 0.38),
                    0 0 80px rgba(0, 255, 100, 0.16);
    }
}

[data-theme="dark"] #nextBtn {
    animation: nextBtnPulseDark 2.8s ease-in-out infinite;
}
[data-theme="dark"] #nextBtn:not(:disabled):hover {
    box-shadow:
        0 16px 48px rgba(0, 255, 106, 0.65),
        0 0 70px rgba(0, 255, 106, 0.5),
        0 0 130px rgba(123, 47, 255, 0.25) !important;
    animation-play-state: paused;
}
@keyframes nextBtnPulseDark {
    0%, 100% {
        box-shadow: 0 6px 24px rgba(0, 255, 106, 0.38),
                    0 0 24px rgba(0, 255, 106, 0.2);
    }
    50% {
        box-shadow: 0 8px 36px rgba(0, 255, 106, 0.62),
                    0 0 55px rgba(0, 255, 106, 0.42),
                    0 0 90px rgba(123, 47, 255, 0.2);
    }
}

[data-theme="sky"] #nextBtn {
    animation: nextBtnPulseSky 2.8s ease-in-out infinite;
}
[data-theme="sky"] #nextBtn:not(:disabled):hover {
    box-shadow:
        0 16px 48px rgba(80, 130, 255, 0.6),
        0 0 65px rgba(80, 130, 255, 0.45),
        0 0 120px rgba(80, 58, 203, 0.2) !important;
    animation-play-state: paused;
}
@keyframes nextBtnPulseSky {
    0%, 100% {
        box-shadow: 0 6px 24px rgba(80, 130, 255, 0.35),
                    0 0 20px rgba(80, 130, 255, 0.18);
    }
    50% {
        box-shadow: 0 8px 36px rgba(80, 130, 255, 0.58),
                    0 0 50px rgba(80, 130, 255, 0.38),
                    0 0 85px rgba(80, 58, 203, 0.18);
    }
}

/* ══════════════════════════════════════════════════════════════
   7. INDEX PAGE — info cards
══════════════════════════════════════════════════════════════ */
.info-card {
    transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.42s ease !important;
    position: relative;
}
.info-card:hover {
    transform: translateY(-12px) scale(1.025) !important;
    box-shadow: 0 24px 56px rgba(0, 0, 0, 0.17),
                0 0 48px rgba(0, 220, 90, 0.32),
                0 0 90px rgba(0, 200, 80, 0.12) !important;
}
.info-card:active {
    transform: translateY(-5px) scale(1.01) !important;
    transition-duration: 0.1s !important;
}
.card-img {
    transition: transform 0.46s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.46s ease !important;
}
.info-card:hover .card-img {
    transform: scale(1.08) rotate(-3deg);
    filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.28));
}

/* ══════════════════════════════════════════════════════════════
   8. ABOUT US PAGE
══════════════════════════════════════════════════════════════ */
.about-hero-img {
    transition: transform 0.52s ease, filter 0.52s ease !important;
}
.about-hero-img:hover {
    filter: drop-shadow(0 8px 28px rgba(0, 160, 100, 0.6)) !important;
}

.about-card {
    border-radius: 20px;
    padding: 20px 16px;
}
.about-card-icon {
    transition: transform 0.46s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.46s ease !important;
}
.about-card:hover .about-card-icon {
    transform: scale(1.2) rotate(-6deg) !important;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.3))
            drop-shadow(0 0 16px rgba(36, 228, 116, 0.4)) !important;
}

.about-stat {
    border-radius: 18px;
}
.about-stat-num {
    display: block;
}

.about-value-row {
    border-radius: 14px;
    padding-left: 8px;
}
.about-value-icon {
    transition: transform 0.46s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.46s ease !important;
}
.about-value-row:hover .about-value-icon {
    transform: scale(1.18) rotate(-6deg) !important;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.25))
            drop-shadow(0 0 12px rgba(36, 228, 116, 0.45)) !important;
}

/* ══════════════════════════════════════════════════════════════
   9. MISSION PAGE
══════════════════════════════════════════════════════════════ */
.mission-card {
    border-radius: 18px;
    padding: 14px 10px !important;
}
.mission-card-icon {
    transition: transform 0.46s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.46s ease !important;
}
.mission-card:hover .mission-card-icon {
    transform: scale(1.2) rotate(-6deg) !important;
    filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.3))
            drop-shadow(0 0 14px rgba(36, 228, 116, 0.42)) !important;
}

.hashtag-pill {
    transition: transform 0.39s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.39s ease,
                border-color 0.39s ease !important;
}
.hashtag-pill:hover {
    transform: translateX(10px) scale(1.03) !important;
    box-shadow: 0 10px 32px rgba(0, 160, 80, 0.3),
                0 0 28px rgba(0, 220, 100, 0.22) !important;
    border-color: rgba(0, 200, 100, 0.7) !important;
}
.insta-profile-link {
    transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.42s ease !important;
}
.insta-profile-link:hover { transform: scale(1.12) rotate(-4deg) !important; }
.insta-logo { transition: filter 0.42s ease !important; }
.insta-profile-link:hover .insta-logo {
    filter: drop-shadow(0 6px 22px rgba(200, 60, 150, 0.7)) !important;
}

/* ══════════════════════════════════════════════════════════════
   10. DONATE PAGE
══════════════════════════════════════════════════════════════ */
.donate-reason {
    border-radius: 18px;
    padding: 10px 12px 10px 8px;
    cursor: default;
}
.donate-reason-icon {
    transition: transform 0.49s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.49s ease !important;
}
.donate-email-btn {
    transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.42s ease !important;
}
.donate-email-btn:not(:disabled):hover {
    transform: scale(1.08) translateY(-6px) !important;
    filter: brightness(1.05) !important;
}
.donate-email-img { transition: filter 0.46s ease !important; }
.donate-email-btn:hover .donate-email-img {
    filter: drop-shadow(0 14px 44px rgba(0, 150, 255, 0.7))
            drop-shadow(0 4px 16px rgba(0, 0, 0, 0.24)) !important;
}

/* ══════════════════════════════════════════════════════════════
   11. RECYCLE PAGE
══════════════════════════════════════════════════════════════ */
.lifehack-card {
    transition: opacity 0.46s ease,
                transform 0.46s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.46s ease !important;
}
.lifehack-card:hover {
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.22),
                0 0 52px rgba(0, 255, 106, 0.32),
                0 0 100px rgba(36, 228, 116, 0.14) !important;
}
.stat-item {
    border-radius: 10px;
    padding: 3px 6px;
    transition: transform 0.28s ease, filter 0.28s ease !important;
    cursor: default;
}
.stat-item:hover {
    transform: scale(1.04) !important;
}
.stat-item:hover .stat-value { filter: drop-shadow(0 0 10px rgba(82,109,168,0.7)); }
.stat-item:hover .stat-label,
.stat-item:hover .stat-colon { filter: drop-shadow(0 0 10px rgba(97,171,192,0.8)); }
.calc-img {
    transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1),
                filter 0.42s ease !important;
}
.stat-item:hover .calc-img {
    transform: scale(1.14) rotate(-6deg) !important;
    filter: drop-shadow(-6px 6px 18px rgba(0,0,0,0.45)) !important;
}
.glass-panel.calculator {
    transition: box-shadow 0.47s ease, border-color 0.47s ease !important;
}
.glass-panel.calculator:hover {
    box-shadow: 0 14px 44px rgba(0,0,0,0.2),
                0 0 38px rgba(97,171,192,0.32) !important;
    border-color: rgba(97,171,192,0.52) !important;
}
.map-section { transition: filter 0.46s ease !important; }
.map-section:hover { filter: drop-shadow(0 12px 36px rgba(0,100,200,0.18)); }

/* ══════════════════════════════════════════════════════════════
   12. CONTAINERS PAGE
══════════════════════════════════════════════════════════════ */
.container-card {
    border-radius: 22px;
    padding: 8px !important;
    transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.42s ease !important;
}
.container-card:hover {
    transform: translateY(-12px) scale(1.04) !important;
    box-shadow: 0 20px 52px rgba(0,0,0,0.2),
                0 0 44px rgba(0,220,80,0.3) !important;
}
.container-card.active {
    transform: translateY(-6px) scale(1.025) !important;
    box-shadow: 0 10px 36px rgba(0,0,0,0.22),
                0 0 60px rgba(0,255,106,0.65) !important;
}
.container-img {
    transition: filter 0.46s ease, transform 0.46s ease !important;
}
.container-card:hover .container-img {
    transform: scale(1.04);
    filter: drop-shadow(0 16px 32px rgba(0,0,0,0.25))
            drop-shadow(0 0 18px rgba(0,200,80,0.28)) !important;
}
.country-select {
    transition: box-shadow 0.39s ease, transform 0.36s ease !important;
}
.country-select:hover {
    transform: scale(1.02) !important;
    box-shadow: 0 0 52px 14px rgba(0,255,106,0.55) !important;
}
.country-select:focus {
    transform: scale(1.025) !important;
    box-shadow: 0 0 62px 18px rgba(0,255,106,0.7) !important;
}
.container-info-panel { transition: box-shadow 0.46s ease !important; }
.container-info-panel:hover {
    box-shadow: 0 12px 40px rgba(0,0,0,0.14),
                0 0 32px rgba(36,228,116,0.18) !important;
}
.quiz-col-btn {
    transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1),
                box-shadow 0.28s ease, background 0.28s ease !important;
}
.quiz-col-btn:not(:disabled):hover {
    transform: translateY(-3px) scale(1.04) !important;
    box-shadow: 0 8px 24px rgba(36,228,116,0.35),
                0 0 24px rgba(36,228,116,0.2) !important;
}

/* ══════════════════════════════════════════════════════════════
   13. WHICHITEMS PAGE
══════════════════════════════════════════════════════════════ */
.wi-tile-grid > * {
    transition: transform 0.34s cubic-bezier(0.34,1.56,0.64,1),
                box-shadow 0.34s ease, filter 0.34s ease !important;
}
.wi-tile-grid > *:hover {
    transform: translateY(-5px) scale(1.06) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.16),
                0 0 24px rgba(76,175,130,0.3) !important;
    z-index: 2;
}

/* ══════════════════════════════════════════════════════════════
   14. ITEM PAGE
══════════════════════════════════════════════════════════════ */
.item-left-side img,
.recycle-img-col img {
    transition: transform 0.52s cubic-bezier(0.34,1.56,0.64,1),
                filter 0.52s ease !important;
}
.item-left-side img:hover,
.recycle-img-col img:hover {
    transform: scale(1.05) rotate(-1.5deg) !important;
    filter: drop-shadow(0 16px 40px rgba(0,0,0,0.32))
            drop-shadow(0 0 32px rgba(76,175,130,0.38)) !important;
}
.tips-panel {
    transition: box-shadow 0.46s ease, transform 0.46s ease !important;
}
.tips-panel:hover {
    transform: scale(1.006) !important;
    box-shadow: 0 14px 44px rgba(0,0,0,0.24),
                0 0 36px rgba(29,222,81,0.25) !important;
}
.tips-col {
    transition: background 0.36s ease,
                box-shadow 0.36s ease, transform 0.33s ease !important;
}
.materials-grid img {
    transition: transform 0.36s cubic-bezier(0.34,1.56,0.64,1),
                filter 0.36s ease !important;
    cursor: pointer;
}
.materials-grid img:hover {
    transform: scale(1.12) !important;
    filter: drop-shadow(0 4px 16px rgba(0,0,0,0.32))
            drop-shadow(0 0 16px rgba(0,200,255,0.42)) !important;
}
.bin-card-img {
    transition: transform 0.42s cubic-bezier(0.34,1.56,0.64,1),
                filter 0.42s ease !important;
}
.bin-card-img:hover {
    transform: scale(1.08) !important;
    filter: drop-shadow(0 6px 20px rgba(0,0,0,0.28))
            drop-shadow(0 0 20px rgba(0,255,106,0.35)) !important;
}
.bin-country-select {
    transition: box-shadow 0.39s ease, transform 0.34s ease !important;
}
.bin-country-select:hover {
    transform: scale(1.02) !important;
    box-shadow: 0 0 28px 7px rgba(0,255,106,0.5) !important;
}

/* ══════════════════════════════════════════════════════════════
   15. BENEFITS / GAME PAGE
══════════════════════════════════════════════════════════════ */
.g-btn-start {
    transition: transform 0.31s cubic-bezier(0.34,1.56,0.64,1),
                box-shadow 0.31s ease, filter 0.31s ease !important;
}
.g-btn-start:hover {
    transform: translateY(-5px) scale(1.08) !important;
    filter: brightness(1.1) !important;
    box-shadow: 0 14px 44px rgba(39,174,96,0.55),
                0 0 50px rgba(0,255,106,0.35) !important;
}
.g-btn {
    transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1),
                box-shadow 0.28s ease, filter 0.28s ease,
                background 0.28s ease !important;
}
#g-btn-recycle:hover {
    transform: translateY(-5px) scale(1.07) !important;
    box-shadow: 0 12px 38px rgba(0,200,80,0.5),
                0 0 48px rgba(0,255,100,0.32) !important;
    filter: brightness(1.1) !important;
}
#g-btn-ignore:hover {
    transform: translateY(-5px) scale(1.07) !important;
    box-shadow: 0 12px 38px rgba(220,60,50,0.5),
                0 0 48px rgba(255,80,60,0.3) !important;
    filter: brightness(1.1) !important;
}
.g-btn-again {
    transition: transform 0.31s cubic-bezier(0.34,1.56,0.64,1),
                box-shadow 0.31s ease, filter 0.31s ease !important;
}
.g-btn-again:hover {
    transform: translateY(-4px) scale(1.07) !important;
    filter: brightness(1.1) !important;
    box-shadow: 0 10px 36px rgba(39,174,96,0.5),
                0 0 44px rgba(0,255,106,0.3) !important;
}

/* ══════════════════════════════════════════════════════════════
   16. DARK THEME ENHANCEMENTS
══════════════════════════════════════════════════════════════ */
[data-theme="dark"] h1 {
    filter: none;
}
[data-theme="dark"] .nav-link:hover {
    box-shadow: 0 0 90px 28px #00FF6A,
                0 0 160px 10px rgba(0,255,106,0.3) !important;
}
[data-theme="dark"] .info-card:hover {
    box-shadow: 0 24px 64px rgba(0,0,0,0.65),
                0 0 64px rgba(0,255,106,0.38),
                0 0 130px rgba(0,200,80,0.16) !important;
}
[data-theme="dark"] .hashtag-pill:hover {
    box-shadow: 0 10px 32px rgba(0,0,0,0.5),
                0 0 36px rgba(123,47,255,0.38),
                0 0 60px rgba(0,255,106,0.2) !important;
    border-color: rgba(0,255,106,0.45) !important;
}
[data-theme="dark"] .lifehack-card:hover {
    box-shadow: 0 20px 60px rgba(0,0,0,0.5),
                0 0 70px rgba(0,255,106,0.42),
                0 0 120px rgba(36,228,116,0.18) !important;
}
[data-theme="dark"] .container-card:hover {
    box-shadow: 0 20px 56px rgba(0,0,0,0.55),
                0 0 55px rgba(0,255,106,0.42) !important;
}
[data-theme="dark"] .container-card.active {
    box-shadow: 0 10px 36px rgba(0,0,0,0.5),
                0 0 80px rgba(0,255,106,0.8) !important;
}
[data-theme="dark"] .glass-panel.calculator:hover {
    box-shadow: 0 14px 44px rgba(0,0,0,0.55),
                0 0 52px rgba(0,160,255,0.42) !important;
    border-color: rgba(0,160,255,0.6) !important;
}
[data-theme="dark"] .scan-item-btn:not(:disabled):hover {
    box-shadow: 0 8px 28px rgba(36,228,116,0.5),
                0 0 44px rgba(36,228,116,0.3) !important;
}
[data-theme="dark"] .primary-btn:not(:disabled):hover {
    box-shadow: 0 12px 36px rgba(0,255,106,0.5),
                0 0 60px rgba(0,200,80,0.28) !important;
}
[data-theme="dark"] .about-cta-btn:hover {
    box-shadow: 0 0 60px rgba(0,255,106,0.75),
                0 8px 32px rgba(123,47,255,0.45) !important;
}
[data-theme="dark"] #g-btn-recycle:hover {
    box-shadow: 0 12px 38px rgba(0,255,100,0.6),
                0 0 65px rgba(0,255,106,0.42) !important;
}
[data-theme="dark"] #g-btn-ignore:hover {
    box-shadow: 0 12px 38px rgba(255,50,50,0.6),
                0 0 65px rgba(255,60,60,0.38) !important;
}
[data-theme="dark"] .g-btn-start:hover,
[data-theme="dark"] .g-btn-again:hover {
    box-shadow: 0 14px 44px rgba(0,255,106,0.55),
                0 0 70px rgba(123,47,255,0.4) !important;
}

/* ══════════════════════════════════════════════════════════════
   17. SKY THEME ENHANCEMENTS
══════════════════════════════════════════════════════════════ */
[data-theme="sky"] h1 {
    filter: none;
}
[data-theme="sky"] .nav-link:hover {
    box-shadow: 0 0 64px 20px rgba(80,130,255,0.62),
                0 6px 20px rgba(0,0,0,0.14) !important;
}
[data-theme="sky"] .info-card:hover {
    box-shadow: 0 24px 56px rgba(80,160,240,0.24),
                0 0 52px rgba(80,130,255,0.3) !important;
}
[data-theme="sky"] .about-card:hover {
    filter: drop-shadow(0 8px 28px rgba(80,130,255,0.28)) !important;
}
[data-theme="sky"] .mission-card:hover {
    filter: drop-shadow(0 8px 22px rgba(80,130,255,0.22)) !important;
}
[data-theme="sky"] .hashtag-pill:hover {
    box-shadow: 0 10px 32px rgba(80,130,255,0.32),
                0 0 30px rgba(80,160,240,0.22) !important;
    border-color: rgba(80,130,255,0.55) !important;
}

[data-theme="sky"] .container-card:hover {
    box-shadow: 0 20px 52px rgba(80,160,240,0.24),
                0 0 50px rgba(80,130,255,0.32) !important;
}
[data-theme="sky"] .glass-panel.calculator:hover {
    box-shadow: 0 14px 44px rgba(80,160,240,0.22),
                0 0 40px rgba(80,130,255,0.28) !important;
    border-color: rgba(80,130,255,0.42) !important;
}
[data-theme="sky"] .scan-item-btn:not(:disabled):hover {
    box-shadow: 0 8px 28px rgba(80,130,255,0.4),
                0 0 36px rgba(80,160,240,0.24) !important;
}
[data-theme="sky"] .primary-btn:not(:disabled):hover {
    box-shadow: 0 12px 36px rgba(80,130,255,0.45),
                0 0 52px rgba(80,160,240,0.24) !important;
}
[data-theme="sky"] .about-cta-btn:hover {
    box-shadow: 0 0 52px rgba(80,130,255,0.55),
                0 8px 28px rgba(80,58,203,0.38) !important;
}
[data-theme="sky"] .g-btn-start:hover,
[data-theme="sky"] .g-btn-again:hover {
    box-shadow: 0 14px 44px rgba(80,130,255,0.48),
                0 0 60px rgba(80,58,203,0.32) !important;
}

/* ══════════════════════════════════════════════════════════════
   18. MISC
══════════════════════════════════════════════════════════════ */
.scanner-close-btn {
    transition: background 0.18s ease, color 0.18s ease,
                border-color 0.18s ease,
                transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.scanner-close-btn:hover { transform: rotate(90deg) scale(1.1) !important; }

.lang-btn {
    transition: background 0.28s ease, color 0.28s ease,
                transform 0.28s cubic-bezier(0.34,1.56,0.64,1),
                box-shadow 0.28s ease !important;
}
.lang-btn:hover {
    transform: scale(1.1) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.15) !important;
}

.theme-dot {
    transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1),
                box-shadow 0.28s ease !important;
}
.theme-dot:hover {
    transform: scale(1.3) !important;
    box-shadow: 0 0 14px 4px currentColor !important;
}

.about-cta-btn img {
    transition: transform 0.39s cubic-bezier(0.34,1.56,0.64,1) !important;
}
.about-cta-btn:hover img { transform: rotate(360deg) scale(1.15) !important; }

.cloud { will-change: transform; }

/* ══════════════════════════════════════════════════════════════
   19. SELECTION
══════════════════════════════════════════════════════════════ */
::selection                { background: rgba(36,228,116,0.32); color: inherit; }
[data-theme="dark"] ::selection { background: rgba(0,255,106,0.28); }
[data-theme="sky"]  ::selection { background: rgba(80,130,255,0.28); }

/* ══════════════════════════════════════════════════════════════
   20. FOCUS RING
══════════════════════════════════════════════════════════════ */
:focus-visible {
    outline: 3px solid rgba(36,228,116,0.7);
    outline-offset: 3px;
    border-radius: 6px;
    transition: outline-color 0.39s ease !important;
}
[data-theme="dark"] :focus-visible { outline-color: rgba(0,255,106,0.8); }
[data-theme="sky"]  :focus-visible { outline-color: rgba(80,130,255,0.75); }

/* ══════════════════════════════════════════════════════════════
   21. NO-BACKGROUND-ON-HOVER SAFETY NET
   Locks background to "no change" on text/row/pill elements
   by explicitly inheriting the base value on hover.
══════════════════════════════════════════════════════════════ */
.about-value-row:hover,
.about-stat:hover,
.donate-reason:hover,
.stat-item:hover,
.g-stat-row:hover {
    background-color: transparent !important;
}