/* ============================================================
   MOBILE PERFORMANCE LAYER
   Phones keep the visual language but drop the expensive parts:
   backdrop filters, blurred aurora, bubble fields, orbit rings
   and continuous animations. Loaded last, mobile only.
   ============================================================ */

@media (max-width: 900px) {
    /* Phones use zero backdrop filters: the sticky header alone would
       otherwise blur the whole page on every scroll frame. */
    *,
    *::before,
    *::after {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    html body .nc-navbar,
    html body .nc-header.is-scrolled .nc-navbar,
    html body .nc-topbar__cut {
        background: #ffffff !important;
    }

    html body .acto-subnav {
        background: #ffffff !important;
    }

    html body .ac-language-dialog,
    html body .ac-language-grid {
        background: #ffffff !important;
    }

    /* Fixed backgrounds and backdrop blur are the main scroll costs. */
    html body {
        background-attachment: scroll !important;
    }

    html body .ac-product,
    html body .rh-products__card,
    html body .rh-categories .rh-categories__card,
    html body .acto-stats .acto-stats__item,
    html body .acto-brands .acto-brands__item,
    html body .rh-areas .rh-areas__entry,
    html body .rh-areas .rh-areas__entry:nth-child(n),
    html body .actorein-catalog .eds-container.ac-catalog-toolbar,
    html body .actorein-catalog .ac-brand-filter__panel,
    html body .actorein-catalog .ac-catalog-view,
    html body .actorein-catalog .ac-filter-chip,
    html body .actorein-catalog .ac-filter-search,
    html body .actorein-catalog .ac-catalog-toolbar .ac-brand-filter summary {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    /* Opaque-enough surfaces so the removed blur is not missed. */
    html body .rh-categories .rh-categories__card {
        background: rgba(255, 255, 255, 0.9) !important;
    }

    html body .acto-stats .acto-stats__item {
        background: rgba(255, 255, 255, 0.9) !important;
    }

    html body .acto-brands .acto-brands__item {
        background: rgba(255, 255, 255, 0.9) !important;
    }

    html body .rh-areas .rh-areas__entry:nth-child(n) {
        background: rgba(255, 255, 255, 0.9) !important;
    }

    html body .rh-areas .rh-areas__entry[open] {
        background: rgba(245, 253, 255, 0.96) !important;
    }

    html body .actorein-catalog .eds-container.ac-catalog-toolbar {
        background: rgba(255, 255, 255, 0.94) !important;
    }

    html body .actorein-catalog .ac-brand-filter__panel {
        background: #ffffff !important;
    }

    html body .actorein-catalog .ac-catalog-view {
        background: rgba(255, 255, 255, 0.82) !important;
    }

    html body .actorein-catalog .ac-brand-filter summary {
        background: rgba(255, 255, 255, 0.86) !important;
    }

    html body .actorein-catalog .ac-filter-chip {
        background: rgba(0, 113, 227, 0.08) !important;
    }

    /* No ambient fields or sparkles on phones. */
    .ac-bubbles,
    .ac-bubbles::before,
    .ac-bubbles::after,
    .ac-bubbles .ac-sparkle {
        display: none !important;
    }

    /* Kill continuous paint-heavy animations. */
    html body .nc-header::after,
    html body #content .rh-hero .rh-hero__visual img,
    html body #content .rh-hero .rh-hero__visual::before,
    html body #content .rh-hero .rh-hero__tag::before,
    html body #content .rh-hero .rh-hero__cta,
    html body #content .rh-hero .rh-hero__dots button[aria-current="true"],
    html body .rh-categories .rh-categories__icon,
    html body .rh-categories h2::after,
    html body .rh-products h2::after,
    html body .rh-areas h2::after,
    html body .rh-areas .rh-areas__illustration svg,
    html body .rh-areas .rh-areas__entry[open] .rh-areas__number,
    html body .acto-stats__head::before,
    html body .acto-stats__num,
    html body .acto-brands .acto-brands__row,
    html body .acto-brands .acto-brands__item img,
    html body .ac-product__visual::after,
    html body .rh-products__media::after,
    html body .ac-product__visual::before,
    html body .rh-products__media::before,
    html body .actorein-catalog .ac-product__badge::before,
    html body .acto-page-hero::before,
    html body .acto-page-hero::after,
    html body .acto-page-hero .eds-container::before {
        animation: none !important;
    }

    /* The reveal effect is nice on desktop, wasted work on a phone. */
    [data-ac-reveal].ac-inview {
        animation: none !important;
    }

    /* Lighter shadows keep the depth without repainting large areas. */
    .ac-product,
    .rh-products__card,
    .rh-categories__card,
    .acto-stats__item,
    .acto-brands__item,
    .rh-areas__entry,
    html body .actorein-catalog .eds-container.ac-catalog-toolbar {
        box-shadow:
            0 8px 18px -14px rgba(10, 37, 64, 0.45),
            inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
    }

    .ac-product,
    .rh-products__card {
        box-shadow:
            0 18px 34px -24px rgba(2, 12, 20, 0.65),
            inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    }

    /* Decorative orbit rings are static/no-op here. */
    .ac-product__visual::after,
    .rh-products__media::after {
        border-color: rgba(127, 231, 255, 0.2);
    }

    /* Keep images decoding work predictable. */
    .ac-product__visual img,
    .rh-products__media img {
        transform: none !important;
        mix-blend-mode: normal !important;
    }
}

/* Small phones: even fewer paint layers. */
@media (max-width: 620px) {
    html body .rh-categories h2::after,
    html body .rh-products h2::after,
    html body .rh-areas h2::after {
        background-size: 100% 100% !important;
    }

    .ac-product,
    .rh-products__card {
        box-shadow: 0 12px 24px -20px rgba(2, 12, 20, 0.6) !important;
    }
}