/* Mobile performance layer: keeps all controls and content intact while
   avoiding effects that trigger continuous, full-screen GPU repaints. */

@media (max-width: 820px), (pointer: coarse) {
    html {
        scroll-behavior: auto !important;
    }

    body::before,
    body::after,
    .hero::before,
    .hero::after,
    .main-content::before,
    .main-content::after {
        animation: none !important;
        transform: none !important;
    }

    /* Decorative particles are the main source of mobile scroll jank. */
    .particles,
    .particle-field,
    .particle,
    .glow-particle,
    .glow-orb,
    .energy-orb,
    .floating-music-note {
        display: none !important;
        animation: none !important;
        filter: none !important;
        box-shadow: none !important;
    }

    /* Backdrop blur is particularly expensive on fixed and scrolling layers. */
    .navbar,
    .nav-menu,
    .fixed-player,
    .player-card,
    .content-section,
    .notification,
    .notification-inner,
    .modal,
    .modal-content,
    .glass,
    [class$="-card"],
    [class*="-card "] {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    .navbar,
    .nav-menu {
        background-color: rgba(10, 15, 31, 0.97) !important;
    }

    .fixed-player,
    .notification,
    .notification-inner {
        background-color: rgba(15, 23, 42, 0.97) !important;
    }

    /* Preserve the glow look as a static effect instead of repainting it. */
    .glow-text,
    .section-title,
    .live-dot,
    .online-dot,
    .status-dot,
    .download-icon,
    .logo {
        animation: none !important;
    }

    main > section,
    .content-section,
    .feature-grid,
    .team-grid,
    .timeline,
    footer {
        content-visibility: auto;
        contain-intrinsic-size: 1px 500px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}


/* GlowFM 1 Jahr — mobile anniversary system */
.anniversary-page-badge { will-change:transform; transform:translateZ(0); contain:layout paint style; }
@media (max-width:768px){
  html::before{text-wrap:balance}
  body{background-attachment:scroll !important}
  .navbar{backdrop-filter:blur(14px) saturate(130%) !important}
  .hero,.page-hero,.page-header{border-radius:1.35rem !important}
  .hero-title,.glow-text,.page-title,.section-title{text-wrap:balance}
  .card,.feature-card,.player-card,.schedule-card,.contact-card,.download-card,.update-card{backdrop-filter:blur(10px) saturate(120%)}
  .anniversary-page-badge{backdrop-filter:none;box-shadow:0 10px 28px rgba(0,0,0,.38),0 0 20px rgba(255,79,216,.23)}
}
@media (max-width:420px){.anniversary-page-badge{bottom:4.7rem}}
@media (prefers-reduced-motion:reduce),(update:slow){.anniversary-page-badge{will-change:auto}}
