/* ═══════════════════════════════════════════════════
   Dark Theme — targeted overrides for hardcoded colors
   Applied when html[data-theme="dark"]
   ═══════════════════════════════════════════════════ */

/* ── Header — glassmorphism ────────────────────────── */

[data-theme="dark"] .header_section {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.72) 0%,
        rgba(28, 28, 36, 0.65) 50%,
        rgba(20, 20, 24, 0.72) 100%
    );
    backdrop-filter: blur(24px) saturate(1.4);
    -webkit-backdrop-filter: blur(24px) saturate(1.4);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 28px;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 60px 0 rgba(255, 255, 255, 0.012),
        0 0 80px 10px rgba(100, 120, 160, 0.015),
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 -1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .scroll .header_section {
    background: linear-gradient(
        135deg,
        rgba(16, 16, 20, 0.82) 0%,
        rgba(24, 24, 32, 0.78) 50%,
        rgba(16, 16, 20, 0.82) 100%
    );
    border-radius: 0 0 28px 28px;
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

[data-theme="dark"] .nav_list li a:hover {
    background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .nav_list .current-menu-item a {
    position: relative;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
    color: rgba(255, 255, 255, 0.9);
}

[data-theme="dark"] .nav_list .current-menu-item a::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .nav_list .current-menu-item a:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.09) 0%,
        rgba(255, 255, 255, 0.04) 100%
    );
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.25),
        inset 1px 1px 8px rgba(255, 255, 255, 0.09),
        inset -1px -1px 8px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] .theme-toggle {
    color: #f0c040;
    border-color: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .theme-toggle:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.25);
}

[data-theme="dark"] .nav_calc-link {
    border-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme="dark"] .header_dropdown-btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(16px) saturate(1.4);
    -webkit-backdrop-filter: blur(16px) saturate(1.4);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 4px 16px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .header_dropdown-btn span {
    background-color: rgba(255, 255, 255, 0.85);
}

[data-theme="dark"] .header_dropdown-btn:hover {
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .header_dropdown-btn:active {
    background: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .scroll .header_buy-btn {
    color: #f0c040;
}

[data-theme="dark"] .scroll .header_buy-btn:hover {
    color: #f5d060;
}

[data-theme="dark"] .scroll .header_buy-btn:active {
    color: var(--typograph-black);
}

/* ── Language switcher ────────────────────────────── */

[data-theme="dark"] .lang-sw__dropdown {
    background: #1e1e1e;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.4),
        0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .lang-sw__option--active {
    background: rgba(74, 144, 232, 0.1);
}

/* ── Light buttons / Slider nav ───────────────────── */

[data-theme="dark"] .light_btn,
[data-theme="dark"] .slider_prev,
[data-theme="dark"] .slider_next {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .slider_prev img,
[data-theme="dark"] .slider_prev svg,
[data-theme="dark"] .slider_next img,
[data-theme="dark"] .slider_next svg {
    filter: invert(1);
}

[data-theme="dark"] .light_btn:hover,
[data-theme="dark"] .slider_prev:hover,
[data-theme="dark"] .slider_next:hover {
    border-color: rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .light_btn:active,
[data-theme="dark"] .slider_prev:active,
[data-theme="dark"] .slider_next:active {
    background: rgba(255, 255, 255, 0.24);
}

/* ── Mini-cart dropdown ───────────────────────────── */

[data-theme="dark"] .mini-cart {
    background: rgba(22, 22, 28, 0.9);
    backdrop-filter: blur(60px) saturate(1.8);
    -webkit-backdrop-filter: blur(60px) saturate(1.8);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 12px 48px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .mini-cart__kit-list li .material-symbols-rounded {
    color: #2dd65e;
}

[data-theme="dark"] .mini-cart__kit-link {
    color: #8dcfff;
}

[data-theme="dark"] .mini-cart__footer {
    border-top-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .mini-cart__qty {
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .mini-cart__qty-btn:hover {
    background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .mini-cart__remove:hover {
    background: rgba(220, 50, 50, 0.15);
}

/* ── Cookie popup ─────────────────────────────────── */

[data-theme="dark"] .cookie_popup__dialog {
    background: rgba(10, 10, 14, 0.98);
    backdrop-filter: blur(40px) saturate(1.6);
    -webkit-backdrop-filter: blur(40px) saturate(1.6);
    box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.5),
        0 0 0 1px rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .cookie_popup__title {
    color: #fff;
}

[data-theme="dark"] .cookie_popup__desc {
    color: rgba(255, 255, 255, 0.55);
}

[data-theme="dark"] .cookie_popup__pill {
    color: rgba(255, 255, 255, 0.92);
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .cookie_popup__pill--muted {
    color: rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .cookie_btn--reject {
    color: rgba(255, 255, 255, 0.86);
}

[data-theme="dark"] .cookie_btn--reject:hover {
    color: #fff;
}

/* ── Breadcrumbs ──────────────────────────────────── */

[data-theme="dark"] .breadcrumb-list::after {
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0) 60%
    );
}

/* ── Hero section ─────────────────────────────────── */

/* Blue accent text — shinier, brighter gradient with glow */
[data-theme="dark"] .hero_title-accent {
    background: linear-gradient(
        135deg,
        #4d9aff 0%,
        #6db8ff 30%,
        #8dcfff 60%,
        #a8e0ff 100%
    );
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 18px rgba(77, 154, 255, 0.4))
        drop-shadow(0 0 40px rgba(77, 154, 255, 0.15));
}

/* Badge ("5-minute setup") — brighter blue on dark */
[data-theme="dark"] .hero_badge {
    color: #7dbdff;
    background: linear-gradient(
        135deg,
        rgba(77, 154, 255, 0.15) 0%,
        rgba(141, 207, 255, 0.1) 100%
    );
    border: 1px solid rgba(77, 154, 255, 0.15);
    text-shadow: 0 0 12px rgba(77, 154, 255, 0.3);
}

/* All section badges — web3.0 glass glow on dark */
[data-theme="dark"] .sensor_badge,
[data-theme="dark"] .eb__badge,
[data-theme="dark"] .hero_steps-badge,
[data-theme="dark"] .why-nilm__badge,
[data-theme="dark"] .how-nilm__badge,
[data-theme="dark"] .science__badge,
[data-theme="dark"] .metrics__badge,
[data-theme="dark"] .partners__badge,
[data-theme="dark"] .hv__badge,
[data-theme="dark"] .earn-hero__badge,
[data-theme="dark"] .earn-form__badge,
[data-theme="dark"] .team-hero__badge {
    color: #7dbdff;
    background: linear-gradient(
        135deg,
        rgba(77, 154, 255, 0.14) 0%,
        rgba(141, 207, 255, 0.07) 100%
    );
    border: 1px solid rgba(77, 154, 255, 0.2);
    box-shadow:
        0 0 24px rgba(77, 154, 255, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    text-shadow: 0 0 16px rgba(77, 154, 255, 0.5);
}

[data-theme="dark"] .testi__badge {
    color: #ffcc4d;
    background: linear-gradient(
        135deg,
        rgba(245, 166, 35, 0.14) 0%,
        rgba(255, 204, 77, 0.06) 100%
    );
    border: 1px solid rgba(245, 166, 35, 0.22);
    box-shadow:
        0 0 24px rgba(245, 166, 35, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    text-shadow: 0 0 16px rgba(245, 166, 35, 0.5);
}

[data-theme="dark"] .hero_steps-badge {
    color: #ffcc4d;
    background: linear-gradient(
        135deg,
        rgba(245, 166, 35, 0.14) 0%,
        rgba(255, 204, 77, 0.06) 100%
    );
    border: 1px solid rgba(245, 166, 35, 0.22);
    box-shadow:
        0 0 24px rgba(245, 166, 35, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    text-shadow: 0 0 16px rgba(245, 166, 35, 0.5);
}

[data-theme="dark"] .tf__badge {
    color: #34d769;
    background: linear-gradient(
        135deg,
        rgba(52, 215, 105, 0.14) 0%,
        rgba(52, 215, 105, 0.06) 100%
    );
    border: 1px solid rgba(52, 215, 105, 0.22);
    box-shadow:
        0 0 24px rgba(52, 215, 105, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    text-shadow: 0 0 16px rgba(52, 215, 105, 0.5);
}

[data-theme="dark"] .roadmap__badge {
    color: #c9a0ff;
    background: linear-gradient(
        135deg,
        rgba(155, 109, 215, 0.14) 0%,
        rgba(185, 150, 235, 0.06) 100%
    );
    border: 1px solid rgba(155, 109, 215, 0.22);
    box-shadow:
        0 0 24px rgba(155, 109, 215, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    text-shadow: 0 0 16px rgba(155, 109, 215, 0.5);
}

/* All section title accents — unified bright blue gradient on dark */
[data-theme="dark"] .eb__title-accent,
[data-theme="dark"] .why-nilm__title-accent,
[data-theme="dark"] .science__title-accent,
[data-theme="dark"] .tech-inside__title-accent,
[data-theme="dark"] .comparison__title-accent,
[data-theme="dark"] .sensor_title-accent,
[data-theme="dark"] .hero_steps-title-accent,
[data-theme="dark"] .how-nilm__title-accent,
[data-theme="dark"] .st-hero__title-accent,
[data-theme="dark"] .application_title-accent,
[data-theme="dark"] .controls_title-accent {
    background: linear-gradient(
        135deg,
        #4d9aff 0%,
        #6db8ff 30%,
        #8dcfff 60%,
        #a8e0ff 100%
    );
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 18px rgba(77, 154, 255, 0.4))
        drop-shadow(0 0 40px rgba(77, 154, 255, 0.15));
}

/* Price gradients — bright blue on dark, no glow */
[data-theme="dark"] .st-card__price-now,
[data-theme="dark"] .pd__price-now {
    background: linear-gradient(135deg, #4d9aff 0%, #6db8ff 40%, #8dcfff 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Home/Business toggle — glassmorphic style */
[data-theme="dark"] .hero_toggle {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.03) 100%
    );
    backdrop-filter: blur(12px) saturate(1.2);
    -webkit-backdrop-filter: blur(12px) saturate(1.2);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .hero_toggle-btn {
    color: rgba(255, 255, 255, 0.4);
    border: 1px solid transparent;
}

[data-theme="dark"] .hero_toggle-btn.active {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.15) 0%,
        rgba(255, 255, 255, 0.08) 100%
    );
    color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .hero_toggle-btn:not(.active):hover {
    color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .hero_cta-desc {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .hero_cta-price-old {
    color: rgba(255, 255, 255, 0.3);
}

[data-theme="dark"] .hero_cta-price-new {
    background: linear-gradient(
        135deg,
        #4d9aff 0%,
        #6db8ff 30%,
        #8dcfff 60%,
        #a8e0ff 100%
    );
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Feature pills — glassmorphic with subtle glow */
[data-theme="dark"] .hero_cta-feat {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.07) 0%,
        rgba(255, 255, 255, 0.03) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .hero_cta-feat:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.1) 0%,
        rgba(255, 255, 255, 0.05) 100%
    );
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.09);
    transform: translateY(-1px);
}

[data-theme="dark"] .hero_cta-feat .material-symbols-rounded {
    color: #7dbdff;
    filter: drop-shadow(0 0 6px rgba(77, 154, 255, 0.3));
}

/* Primary CTA — inherits global .blue_element diagonal border + glow */

/* Secondary CTA "See specifications" — glassmorphic with diagonal border */
[data-theme="dark"] .hero_cta-secondary {
    position: relative;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
}

[data-theme="dark"] .hero_cta-secondary::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .hero_cta-secondary:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.09) 0%,
        rgba(255, 255, 255, 0.04) 100%
    );
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.25),
        inset 1px 1px 8px rgba(255, 255, 255, 0.09),
        inset -1px -1px 8px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] .hero_cta-secondary .material-symbols-rounded {
    color: rgba(255, 255, 255, 0.5);
}

/* ── Technology page hero ──────────────────────────── */

/* Blue accent text — matching home hero shiny treatment */
[data-theme="dark"] .tech-hero__title-accent {
    background: linear-gradient(
        135deg,
        #4d9aff 0%,
        #6db8ff 30%,
        #8dcfff 60%,
        #a8e0ff 100%
    );
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 18px rgba(77, 154, 255, 0.4))
        drop-shadow(0 0 40px rgba(77, 154, 255, 0.15));
}

[data-theme="dark"] .tech-hero__desc {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .tech-hero__price-old {
    color: rgba(255, 255, 255, 0.25);
}

/* Feature pills — glassmorphic */
[data-theme="dark"] .tech-hero__feat {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.07) 0%,
        rgba(255, 255, 255, 0.03) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .tech-hero__feat:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.1) 0%,
        rgba(255, 255, 255, 0.05) 100%
    );
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.09);
    transform: translateY(-1px);
}

[data-theme="dark"] .tech-hero__feat .material-symbols-rounded {
    color: #7dbdff;
    filter: drop-shadow(0 0 6px rgba(77, 154, 255, 0.3));
}

/* Primary CTA — inherits global .blue_element diagonal border + glow */

/* Secondary CTA — glassmorphic with diagonal border */
[data-theme="dark"] .tech-hero__cta-secondary {
    position: relative;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
}

[data-theme="dark"] .tech-hero__cta-secondary::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .tech-hero__cta-secondary:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.09) 0%,
        rgba(255, 255, 255, 0.04) 100%
    );
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.25),
        inset 1px 1px 8px rgba(255, 255, 255, 0.09),
        inset -1px -1px 8px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] .tech-hero__cta-secondary .material-symbols-rounded {
    color: rgba(255, 255, 255, 0.5);
}

/* ── Tech hero plot — "Monisensa AI" badge glassmorphic ─────────── */

[data-theme="dark"] .tech-hero__plot-ai-badge {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
    text-shadow: none;
    color: rgba(255, 255, 255, 0.85);
}

[data-theme="dark"] .tech-hero__plot-ai-badge::before {
    display: none;
}

[data-theme="dark"] .tech-hero__plot-ai-badge::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .tech-hero__plot-ai-logo {
    filter: brightness(0) invert(1)
        drop-shadow(0 0 4px rgba(255, 255, 255, 0.2)) !important;
}

[data-theme="dark"] .tech-hero__plot-ai-arrow-wrap .chevron {
    color: rgba(255, 255, 255, 0.35);
}

/* Plot widget — subtle inner padding for dark theme */
[data-theme="dark"] .tech-hero__plot {
    padding: 24px;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* ── Global blue_element — enhanced glow + diagonal shine for dark ── */

[data-theme="dark"] .blue_element {
    background:
        radial-gradient(
            ellipse 60% 60% at 15% 15%,
            rgba(255, 255, 255, 0.12) 0%,
            transparent 50%
        ),
        radial-gradient(
            60% 80% at 85% 20%,
            rgba(141, 207, 255, 0.5) 0%,
            transparent 100%
        ),
        radial-gradient(
            95.6% 92.05% at 17.92% 13.75%,
            #5ba8f5 0%,
            #0b57db 100%
        ),
        var(--background-accent-button);
    box-shadow:
        0 4px 24px rgba(11, 87, 219, 0.35),
        0 8px 40px rgba(11, 87, 219, 0.2),
        0 0 60px -10px rgba(77, 154, 255, 0.25),
        inset 2px 2px 8px rgba(255, 255, 255, 0.12),
        inset -2px -2px 8px rgba(0, 0, 0, 0.18);
    border: none;
}

/* Corner glow border — bright at top-left & bottom-right corners (iOS-style) */
[data-theme="dark"] .blue_element::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1.5px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(180, 220, 255, 0.6) 0%,
            rgba(141, 207, 255, 0.2) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(141, 207, 255, 0.45) 0%,
            rgba(91, 168, 245, 0.15) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 0;
}

[data-theme="dark"] .blue_element:hover {
    box-shadow:
        0 4px 28px rgba(11, 87, 219, 0.45),
        0 8px 50px rgba(11, 87, 219, 0.3),
        0 0 80px -10px rgba(77, 154, 255, 0.35),
        inset 2px 2px 10px rgba(255, 255, 255, 0.15),
        inset -2px -2px 10px rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

/* ── Global hardcoded rgba(0,0,0) text → white equivalents ─── */

[data-theme="dark"] .hero_cta-secondary {
    color: var(--typograph-black);
}

[data-theme="dark"] .cart__label {
    color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] .earn-form__field input::placeholder,
[data-theme="dark"] .earn-form__field textarea::placeholder {
    color: rgba(255, 255, 255, 0.3);
}

/* ── Hero play button mobile ──────────────────────── */

[data-theme="dark"] .hero_play-btn-mb {
    background: var(--background-cream-primary);
}

[data-theme="dark"] .hero_play-btn-mb:hover {
    background: #333;
}

[data-theme="dark"] .hero_play-btn-mb:active {
    background: #3a3a3a;
}

[data-theme="dark"] .play_btn-wrap-mb svg {
    filter: brightness(0) invert(1);
}

/* ── Energy Breakdown ─────────────────────────────── */

[data-theme="dark"] .eb__item {
    background: #1e1e1e;
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .eb__item:hover,
[data-theme="dark"] .eb__item.eb--active {
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(255, 255, 255, 0.08);
}

/* ── Hero Impact stats — dark-first, no overrides needed ── */

/* ── Why NILM cards ───────────────────────────────── */

[data-theme="dark"] .why-nilm__card {
    background: #1a1a1a;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.15);
}

[data-theme="dark"] .why-nilm__card:hover {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

/* ── Hero step cards ──────────────────────────────── */

[data-theme="dark"] .hero_step-card-title {
    color: rgba(255, 255, 255, 0.85);
}

[data-theme="dark"] .hero_step-card-desc {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .hero_steps-pdf {
    color: var(--typograph-black);
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
}

[data-theme="dark"] .hero_steps-pdf::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .hero_steps-pdf:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.09) 0%,
        rgba(255, 255, 255, 0.04) 100%
    );
    box-shadow:
        0 6px 24px rgba(0, 0, 0, 0.3),
        inset 1px 1px 6px rgba(255, 255, 255, 0.05),
        inset -1px -1px 6px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] .hero_steps-pdf-text {
    color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .hero_steps-pdf-arrow {
    color: rgba(255, 255, 255, 0.35);
}

/* ── Sensor section ───────────────────────────────── */

[data-theme="dark"] .sensor_subtitle {
    color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] .sensor_cat::before {
    background:
        radial-gradient(
            ellipse at 20% 0%,
            rgba(255, 255, 255, 0.1) 0%,
            transparent 50%
        ),
        radial-gradient(
            ellipse at 80% 20%,
            rgba(255, 255, 255, 0.05) 0%,
            transparent 40%
        );
}

[data-theme="dark"] .sensor_cat--climate {
    background: linear-gradient(
        165deg,
        rgba(110, 165, 240, 0.3) 0%,
        rgba(70, 120, 200, 0.14) 100%
    );
    border: 1px solid rgba(120, 170, 240, 0.25);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 28px -5px rgba(100, 160, 240, 0.2);
}

[data-theme="dark"] .sensor_cat--kitchen {
    background: linear-gradient(
        165deg,
        rgba(240, 180, 110, 0.3) 0%,
        rgba(200, 140, 70, 0.14) 100%
    );
    border: 1px solid rgba(240, 180, 110, 0.25);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 28px -5px rgba(240, 180, 110, 0.2);
}

[data-theme="dark"] .sensor_cat--home {
    background: linear-gradient(
        165deg,
        rgba(90, 220, 155, 0.3) 0%,
        rgba(50, 180, 115, 0.14) 100%
    );
    border: 1px solid rgba(90, 220, 155, 0.25);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 28px -5px rgba(90, 220, 155, 0.2);
}

[data-theme="dark"] .sensor_cat--electronics {
    background: linear-gradient(
        165deg,
        rgba(180, 140, 230, 0.3) 0%,
        rgba(140, 100, 190, 0.14) 100%
    );
    border: 1px solid rgba(180, 140, 230, 0.25);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 28px -5px rgba(180, 140, 230, 0.2);
}

[data-theme="dark"] .sensor_cat-title {
    color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .sensor_cat-bg-icon {
    color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .sensor_device {
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

[data-theme="dark"] .sensor_device:hover {
    background: rgba(255, 255, 255, 0.16);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .sensor_device .material-symbols-rounded {
    color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .sensor_device-name {
    color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .sensor_ask {
    color: var(--typograph-black);
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
}

[data-theme="dark"] .sensor_ask::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .sensor_ask:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.09) 0%,
        rgba(255, 255, 255, 0.04) 100%
    );
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.25),
        inset 1px 1px 8px rgba(255, 255, 255, 0.09),
        inset -1px -1px 8px rgba(0, 0, 0, 0.1);
}

[data-theme="dark"] .sensor_popup-wrapper {
    background: rgba(10, 10, 14, 0.99);
    backdrop-filter: blur(40px) saturate(1.6);
    -webkit-backdrop-filter: blur(40px) saturate(1.6);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .sensor_popup-wrapper::after {
    background: linear-gradient(
        to top,
        rgba(10, 10, 14, 1) 30%,
        rgba(10, 10, 14, 0) 100%
    );
}

[data-theme="dark"] .sensor_popup-top::after {
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0) 100%
    );
}

[data-theme="dark"] .sensor_popup-content {
    border-bottom-color: rgba(255, 255, 255, 0.16);
}

/* ── Application tabs ─────────────────────────────── */

[data-theme="dark"] .tab-progress .bg {
    stroke: rgba(255, 255, 255, 0.1);
}

/* ── Controls cards ───────────────────────────────── */

[data-theme="dark"] .controls_card-item:nth-child(1) {
    background: linear-gradient(
        165deg,
        rgba(90, 220, 155, 0.3) 0%,
        rgba(50, 180, 115, 0.14) 100%
    ) !important;
    border: 1px solid rgba(90, 220, 155, 0.25);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 28px -5px rgba(90, 220, 155, 0.2);
}

[data-theme="dark"] .controls_card-item:nth-child(2) {
    background: linear-gradient(
        165deg,
        rgba(110, 165, 240, 0.3) 0%,
        rgba(70, 120, 200, 0.14) 100%
    ) !important;
    border: 1px solid rgba(120, 170, 240, 0.25);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 28px -5px rgba(100, 160, 240, 0.2);
}

[data-theme="dark"] .controls_card-item:nth-child(3) {
    background: linear-gradient(
        165deg,
        rgba(255, 198, 92, 0.28) 0%,
        rgba(245, 166, 35, 0.16) 58%,
        rgba(221, 137, 14, 0.12) 100%
    ) !important;
    border: 1px solid rgba(255, 198, 92, 0.26);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 28px -5px rgba(245, 166, 35, 0.24);
}

[data-theme="dark"] .controls_card-item::before {
    background:
        radial-gradient(
            ellipse at 20% 0%,
            rgba(255, 255, 255, 0.1) 0%,
            transparent 50%
        ),
        radial-gradient(
            ellipse at 80% 20%,
            rgba(255, 255, 255, 0.05) 0%,
            transparent 40%
        );
}

[data-theme="dark"] .controls_card-descript {
    color: rgba(255, 255, 255, 0.55);
}

/* ── Controls "Demo" button — glassmorphic like "See specifications" ── */

[data-theme="dark"] .controls_apps-demo.blue_element {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
    color: rgba(255, 255, 255, 0.85);
    text-shadow: none;
}

[data-theme="dark"] .controls_apps-demo.blue_element::before {
    display: none;
}

[data-theme="dark"] .controls_apps-demo.blue_element::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .controls_apps-demo.blue_element:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.09) 0%,
        rgba(255, 255, 255, 0.04) 100%
    );
    box-shadow:
        0 6px 20px rgba(0, 0, 0, 0.25),
        inset 1px 1px 8px rgba(255, 255, 255, 0.09),
        inset -1px -1px 8px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
}

[data-theme="dark"] .controls_apps-appstore,
[data-theme="dark"] .controls_apps-rustore {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
}

[data-theme="dark"] .controls_apps-appstore:hover,
[data-theme="dark"] .controls_apps-rustore:hover {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.09) 0%,
        rgba(255, 255, 255, 0.04) 100%
    );
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .controls_apps-appstore:active,
[data-theme="dark"] .controls_apps-rustore:active {
    background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .controls_apps-appstore img,
[data-theme="dark"] .controls_apps-rustore img {
    filter: brightness(0) invert(1);
}

/* ── Apps download buttons ────────────────────────── */

[data-theme="dark"] .apps_btn {
    background: #1e1e1e;
}

[data-theme="dark"] .appmonisensa_apps-appstore {
    background: #2a2a2a;
    color: var(--typograph-black);
}

[data-theme="dark"] .appmonisensa_apps-rustore {
    background: #1e2540;
    color: var(--typograph-black);
}

[data-theme="dark"] .appmonisensa_apps-appstore:active {
    background: #333;
}

[data-theme="dark"] .appmonisensa_apps-rustore:active {
    background: #262e4a;
}

/* ── Slider nav pseudo-elements ───────────────────── */

[data-theme="dark"] .hero_slider__button-prev::before,
[data-theme="dark"] .hero_slider__button-next::before,
[data-theme="dark"] .appmonisensa_slider-prev:before,
[data-theme="dark"] .appmonisensa_slider-next:before {
    background: rgba(18, 18, 18, 0.5);
}

/* ── Footer ───────────────────────────────────────── */

[data-theme="dark"] .footer_top {
    background: linear-gradient(90deg, rgba(26, 26, 26, 0) 0%, #1a1a1a 100%);
}

[data-theme="dark"] .value-banner-section {
    border-bottom: none;
}

[data-theme="dark"] .footer_btn:hover {
    background: #d4a07a;
}

[data-theme="dark"] .footer_btn:active {
    background: #c4906a;
}

/* ── Forms ────────────────────────────────────────── */

[data-theme="dark"] .form-group label {
    background: var(--typograph-white-primary);
}

[data-theme="dark"] .form-group input {
    background: transparent;
    color: var(--typograph-black);
}

[data-theme="dark"] .form-group input:hover {
    border-color: rgba(255, 255, 255, 0.3);
}

[data-theme="dark"] .form-checkbox-input {
    background: transparent;
}

[data-theme="dark"] .form-checkbox-input:hover {
    border-color: rgba(255, 255, 255, 0.3);
}

[data-theme="dark"] .form-checkbox-input input {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .form-checkbox-input input:checked {
    background: var(--typograph-blue);
    border-color: var(--typograph-blue);
}

[data-theme="dark"] .form-checkbox a:hover {
    color: var(--typograph-black);
}

[data-theme="dark"] .btn-submit.blue_element {
    position: relative;
    color: #fff;
    overflow: hidden;
}

/* ── Search page ──────────────────────────────────── */

[data-theme="dark"] .search {
    background:
        radial-gradient(
            ellipse 40% 60% at 15% 40%,
            rgba(74, 144, 232, 0.07) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 35% 50% at 80% 60%,
            rgba(155, 109, 215, 0.05) 0%,
            transparent 100%
        ),
        var(--background-page);
}

[data-theme="dark"] .search__form {
    background: rgba(10, 10, 14, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(40px) saturate(1.6);
    -webkit-backdrop-filter: blur(40px) saturate(1.6);
}

[data-theme="dark"] .search__suggestions li a {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .search__suggestions li a:hover {
    color: #6db3f8;
    border-color: rgba(74, 144, 232, 0.4);
    background: rgba(74, 144, 232, 0.08);
}

[data-theme="dark"] .search__result-item a {
    background: rgba(255, 255, 255, 0.03);
}

[data-theme="dark"] .search__result-item a:hover {
    background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .search__dropdown {
    box-shadow: 0 15px 40px 0 rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .search__dropdown::after {
    background: linear-gradient(
        to top,
        rgba(10, 10, 14, 1) 30%,
        rgba(10, 10, 14, 0) 100%
    );
}

[data-theme="dark"] .search__input {
    background: transparent;
    color: var(--typograph-black);
}

/* ── Help page / Blog ─────────────────────────────── */

[data-theme="dark"] .help_archive {
    border-bottom-color: rgba(255, 255, 255, 0.16);
}

[data-theme="dark"] .current-cat.help_sidebar-item a {
    position: relative;
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: none;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.2),
        inset 1px 1px 6px rgba(255, 255, 255, 0.07),
        inset -1px -1px 6px rgba(0, 0, 0, 0.08);
    color: rgba(255, 255, 255, 0.9);
}

[data-theme="dark"] .current-cat.help_sidebar-item a::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.18) 0%,
            rgba(255, 255, 255, 0.05) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .current-cat.help_sidebar-item a .category-icon path {
    fill: rgba(255, 255, 255, 0.9);
}

[data-theme="dark"] .help_sidebar-item a:hover {
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.9);
}

[data-theme="dark"] .help_archive-content {
    background: transparent;
    border-radius: 0;
}

[data-theme="dark"] .archive_content-top {
    border-bottom-color: rgba(255, 255, 255, 0.16);
}

[data-theme="dark"] .help_archive-item a:hover {
    background: rgba(255, 255, 255, 0.06);
}

/* .help_article-content.section_wht — inherits glass from .section_wht */

[data-theme="dark"] .help_article-top {
    border-bottom: none;
    border-image: linear-gradient(
            90deg,
            transparent 0%,
            rgba(74, 144, 232, 0.2) 25%,
            rgba(170, 0, 255, 0.15) 50%,
            rgba(20, 194, 79, 0.2) 75%,
            transparent 100%
        )
        1;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

[data-theme="dark"] .help_article-author {
    border-bottom: none;
    border-image: linear-gradient(
            90deg,
            transparent 0%,
            rgba(74, 144, 232, 0.2) 25%,
            rgba(170, 0, 255, 0.15) 50%,
            rgba(20, 194, 79, 0.2) 75%,
            transparent 100%
        )
        1;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

[data-theme="dark"] .article_back {
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
}

[data-theme="dark"] .article_back svg path {
    fill: rgba(255, 255, 255, 0.6);
}

[data-theme="dark"] .article_post-time svg path {
    fill: rgba(255, 255, 255, 0.35);
}

[data-theme="dark"] .article_like .light_btn {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.16);
}

[data-theme="dark"] .article_like .light_btn svg path {
    fill: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .article_content li,
[data-theme="dark"] .article_content ol li::marker {
    color: var(--typograph-black);
}

[data-theme="dark"] .article_content blockquote {
    background:
        repeating-linear-gradient(
            135deg,
            rgba(30, 30, 30, 1) -2px,
            rgba(30, 30, 30, 1) 9px,
            transparent 10px,
            transparent 16px
        ),
        rgba(60, 50, 20, 0.3);
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .wp-block-table {
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .blog-filter-select select,
[data-theme="dark"] .blog-search input {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.16);
    color: var(--typograph-black);
}

[data-theme="dark"] .blog-filter-select select:hover,
[data-theme="dark"] .blog-search input:hover {
    border-color: rgba(255, 255, 255, 0.25);
}

[data-theme="dark"] .blog-filter-select select:focus,
[data-theme="dark"] .blog-search input:focus {
    border-color: var(--typograph-blue);
    box-shadow: 0 0 0 3px rgba(74, 144, 232, 0.12);
}

[data-theme="dark"] .blog-articles__divider {
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.12),
        transparent
    );
}

/* ── Blog featured carousel — dark nav buttons ────── */

[data-theme="dark"] .blog-featured__prev,
[data-theme="dark"] .blog-featured__next {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.16);
}

[data-theme="dark"] .blog-featured__prev svg path,
[data-theme="dark"] .blog-featured__next svg path {
    fill: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .blog-featured__pagination .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"]
    .blog-featured__pagination
    .swiper-pagination-bullet-active {
    background: #e05a33;
}

/* ── Sidebar category icons — lighten for dark ─────── */

[data-theme="dark"] .help_sidebar-item .category-icon img {
    filter: brightness(0) invert(0.7);
}

[data-theme="dark"] .current-cat.help_sidebar-item .category-icon img {
    filter: brightness(0) invert(0.9);
}

[data-theme="dark"] .help_sidebar-item a:hover .category-icon img {
    filter: brightness(0) invert(0.9);
}

[data-theme="dark"] .help_sidebar-item a:hover .category-icon path {
    fill: rgba(255, 255, 255, 0.9);
}

/* ── Help Q&A cards ───────────────────────────────── */

[data-theme="dark"] .help-page {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .qa-card:hover {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .qa-card__vote-btn {
    border-color: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .qa-card__vote-btn:hover {
    background: rgba(74, 144, 232, 0.12);
    color: #6db3f8;
    border-color: rgba(74, 144, 232, 0.4);
}

[data-theme="dark"] .qa-card__vote-btn.active {
    background: #094bba;
    border-color: #094bba;
    color: #fff;
}

[data-theme="dark"] .qa-card__badge {
    background: rgba(74, 144, 232, 0.12);
    color: #6db3f8;
}

/* ── Category grid (help page) ────────────────────── */

[data-theme="dark"] .catgrid__card-desc {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .catgrid__subtitle {
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] .catgrid__icon-wrap {
    border-radius: 14px;
}

[data-theme="dark"] .catgrid__icon-wrap--1 {
    background: linear-gradient(135deg, #5a9ef0 0%, #2d6fd4 100%);
    box-shadow: 0 4px 14px rgba(74, 144, 232, 0.35);
}
[data-theme="dark"] .catgrid__icon-wrap--2 {
    background: linear-gradient(135deg, #ffb84d 0%, #e09010 100%);
    box-shadow: 0 4px 14px rgba(245, 166, 35, 0.35);
}
[data-theme="dark"] .catgrid__icon-wrap--3 {
    background: linear-gradient(135deg, #b080e0 0%, #7b4db8 100%);
    box-shadow: 0 4px 14px rgba(155, 109, 215, 0.35);
}
[data-theme="dark"] .catgrid__icon-wrap--4 {
    background: linear-gradient(135deg, #f06868 0%, #c43030 100%);
    box-shadow: 0 4px 14px rgba(232, 84, 84, 0.35);
}
[data-theme="dark"] .catgrid__icon-wrap--5 {
    background: linear-gradient(135deg, #4dd87a 0%, #1aae40 100%);
    box-shadow: 0 4px 14px rgba(52, 199, 89, 0.35);
}

[data-theme="dark"] .catgrid__card-arrow {
    background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .catgrid__card-arrow .material-symbols-rounded {
    color: rgba(255, 255, 255, 0.35);
}

/* ── Contacts — styles now in contacts.css ────────── */

/* ── Scroll to top ────────────────────────────────── */

[data-theme="dark"] .scroll-top:hover {
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .scroll-top:active {
    background: #3a3a3a;
}

/* ── Section scroll-down arrow ─────────────────────── */

[data-theme="dark"] .section-scroll-down {
    border-color: rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .section-scroll-down:hover {
    border-color: rgba(255, 255, 255, 0.35);
    color: rgba(255, 255, 255, 0.8);
    background: rgba(255, 255, 255, 0.14);
}

/* ── Popups / modals ──────────────────────────────── */

[data-theme="dark"] .sensor_popup-wrap {
    background: rgba(0, 0, 0, 0.9);
}

[data-theme="dark"] .hero_contact-popup-wrapper {
    background: rgba(10, 10, 14, 0.99);
    backdrop-filter: blur(40px) saturate(1.6);
    -webkit-backdrop-filter: blur(40px) saturate(1.6);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .hero_contact-close {
    color: rgba(255, 255, 255, 0.6);
}

[data-theme="dark"] .hero_contact-close:hover {
    color: #fff;
}

[data-theme="dark"] .hero_contact-form .form-success__btn path {
    fill: #fff;
}

/* ── SVG / icon adjustments ───────────────────────── */

[data-theme="dark"] .header_dropdown-btn span {
    background-color: rgba(255, 255, 255, 0.85);
}

/* ── FAQ accordion ────────────────────────────────── */

[data-theme="dark"] .answer_show-more:hover {
    background: #333;
}

[data-theme="dark"] .answer_show-more:active {
    background: #3a3a3a;
}

[data-theme="dark"] .answer_accord-arrow img {
    filter: invert(1);
}

[data-theme="dark"] .answer-active .answer_accord-btn,
[data-theme="dark"] .answer_accord-btn:hover {
    background: rgba(186, 177, 122, 0.08);
}

[data-theme="dark"] .answer-active .answer_accord-title,
[data-theme="dark"] .answer-active:hover .answer_accord-title,
[data-theme="dark"] .answer_accord-btn:hover .answer_accord-title {
    color: #bab17a;
}

/* ── Swiper pagination ────────────────────────────── */

[data-theme="dark"] .swiper-pagination-bullet {
    background: #333;
}

/* ── Value banner (blog) — green tint handled in glassmorphism block below ──── */

/* ── Form success message ─────────────────────────── */

[data-theme="dark"] .form-success__message {
    background: #1e1e1e;
}

/* ── No results block ─────────────────────────────── */

[data-theme="dark"] .no-results-block a {
    color: #2dd65e;
}

/* ── App page — sidebar items ─────────────────────── */

[data-theme="dark"] .appmonisensa_sidebar-item {
    background: #1e1e1e;
}

/* ── Technology page — seamless sections ─────────── */

[data-theme="dark"] .science__examples,
[data-theme="dark"] .science__plot,
[data-theme="dark"] .comparison__table-wrap {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 50%,
        rgba(20, 20, 24, 0.65) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border: 2px solid #2c2c2e;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        0 0 80px 0 rgba(255, 255, 255, 0.015),
        0 0 120px 20px rgba(100, 120, 160, 0.02),
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        inset 0 -1px 0 rgba(255, 255, 255, 0.02);
}

[data-theme="dark"] .tech-inside.section_wht {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: none;
    box-shadow: none;
}

[data-theme="dark"] .tech-inside__card {
    background:
        radial-gradient(
            ellipse 80% 60% at 50% 0%,
            rgba(74, 144, 232, 0.06) 0%,
            transparent 100%
        ),
        #1a1a1a;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .tech-inside__card::after {
    content: none;
}

[data-theme="dark"] .tech-inside__card:hover {
    border-color: rgba(74, 144, 232, 0.15);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(74, 144, 232, 0.15),
        0 0 20px -5px rgba(74, 144, 232, 0.1);
}

[data-theme="dark"] .tech-inside__card-text {
    color: rgba(255, 255, 255, 0.5);
}

/* Section dividers — gradient instead of solid lines */
[data-theme="dark"] .product,
[data-theme="dark"] .earn-hero,
[data-theme="dark"] .earn-cards,
[data-theme="dark"] .earn-section,
[data-theme="dark"] .earn-form,
[data-theme="dark"] .search,
[data-theme="dark"] .catgrid,
[data-theme="dark"] .why-nilm,
[data-theme="dark"] .eb,
[data-theme="dark"] .comparison,
[data-theme="dark"] .tf,
[data-theme="dark"] .sensor,
[data-theme="dark"] .hero_steps,
[data-theme="dark"] .controls,
[data-theme="dark"] .testi {
    border-bottom: none;
    border-image: linear-gradient(
            90deg,
            transparent 0%,
            rgba(74, 144, 232, 0.2) 25%,
            rgba(170, 0, 255, 0.15) 50%,
            rgba(20, 194, 79, 0.2) 75%,
            transparent 100%
        )
        1;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

[data-theme="dark"] .parameters_block-item {
    border-bottom-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .comparison__table th {
    background: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .comparison__table thead th {
    background:
        linear-gradient(180deg, transparent 0%, rgba(245, 166, 35, 0.06) 100%),
        #1e1e1e !important;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .comparison__table thead th:first-child {
    border-left: 1px solid rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .comparison__table thead th:last-child {
    border-right: 1px solid rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .comparison__th--highlight {
    background:
        linear-gradient(180deg, rgba(20, 194, 79, 0.1) 0%, transparent 100%),
        #1e1e1e !important;
    color: #34d769 !important;
}

[data-theme="dark"] .comparison__td--highlight {
    background: rgba(20, 194, 79, 0.06);
    color: #34d769;
}

[data-theme="dark"] .comparison__cross {
    color: rgba(255, 255, 255, 0.25);
}

[data-theme="dark"] .comparison__table td {
    border-bottom-color: rgba(255, 255, 255, 0.14);
}

/* removed stale override */

[data-theme="dark"] .product__guarant {
    background: rgba(45, 214, 94, 0.12);
}

[data-theme="dark"] .product__thumb-img:hover,
[data-theme="dark"] .swiper-slide-thumb-active .product__thumb-img {
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .product_button-prev::before,
[data-theme="dark"] .product_button-next::before {
    background: rgba(18, 18, 18, 0.5);
}

/* ── Preorder stepper (shared across all preorder pages) ── */

[data-theme="dark"] .ck--preorder .ck__pip--clickable:hover {
    background: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .ck--preorder .ck__pip-icon {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .ck--preorder .ck__pip--done {
    opacity: 1;
}

[data-theme="dark"] .ck--preorder .ck__pip--active .ck__pip-icon {
    background: linear-gradient(135deg, #5a9ef0 0%, #2d6fd4 100%);
    border-color: rgba(74, 144, 232, 0.4);
    box-shadow: 0 4px 14px rgba(74, 144, 232, 0.4);
}

[data-theme="dark"] .ck--preorder .ck__pip--done .ck__pip-icon {
    background: linear-gradient(135deg, #4dd87a 0%, #1aae40 100%);
    border-color: rgba(52, 199, 89, 0.4);
    box-shadow: 0 4px 14px rgba(52, 199, 89, 0.4);
}

[data-theme="dark"] .ck--preorder .ck__pip-bar {
    background: rgba(255, 255, 255, 0.08);
}

/* ── Cart page — glass cards ───────────────────────── */

/* Header — transparent for preorder shell */
[data-theme="dark"] .ck--preorder .ck__header {
    background: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: none;
}
[data-theme="dark"] .ck--preorder .ck__stepper {
    background: linear-gradient(
        165deg,
        rgba(255, 255, 255, 0.06) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 100px;
    padding: 6px 12px;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* ── Glass cards ── */
[data-theme="dark"] .ck--preorder-cart .ck__card {
    background: linear-gradient(
        165deg,
        rgba(255, 255, 255, 0.06) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* Summary card */
[data-theme="dark"] .ck--preorder-cart .ck__card--summary {
    background: linear-gradient(
        165deg,
        rgba(255, 255, 255, 0.07) 0%,
        rgba(255, 255, 255, 0.03) 100%
    );
    border-color: rgba(255, 255, 255, 0.12);
}

/* Card title icon */
[data-theme="dark"]
    .ck--preorder-cart
    .ck__card-title
    .material-symbols-rounded {
    color: #8dcfff;
}

/* ── Options ── */
[data-theme="dark"] .ck--preorder-cart .ck__opt {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .ck--preorder-cart .ck__opt:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .ck--preorder-cart .ck__opt--active,
[data-theme="dark"] .ck--preorder-cart .ck__opt:has(input:checked) {
    background: rgba(74, 144, 232, 0.08);
    border-color: rgba(74, 144, 232, 0.3);
    box-shadow: 0 0 16px -4px rgba(74, 144, 232, 0.2);
}

[data-theme="dark"] .ck--preorder-cart .ck__opt-icon {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .ck--preorder-cart .ck__opt--active .ck__opt-icon {
    background: rgba(74, 144, 232, 0.15);
    border-color: rgba(74, 144, 232, 0.2);
}

[data-theme="dark"] .ck--preorder-cart .ck__opt-check {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .ck--preorder-cart .ck__opt--active .ck__opt-check {
    background: rgba(74, 144, 232, 0.15);
    border-color: rgba(74, 144, 232, 0.2);
}

/* ── Product image ── */
[data-theme="dark"] .ck--preorder-cart .ck__product-img,
[data-theme="dark"] .ck--preorder-cart .ck__sm-thumb {
    background: linear-gradient(
        165deg,
        rgba(74, 144, 232, 0.15) 0%,
        rgba(74, 144, 232, 0.06) 100%
    );
    border: 1px solid rgba(74, 144, 232, 0.12);
}

[data-theme="dark"] .ck--preorder-cart .ck__product-row {
    border-top-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .ck--preorder-cart .ck__kit {
    border-top-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"]
    .ck--preorder-cart
    .ck__kit-list
    li
    .material-symbols-rounded {
    color: #2dd65e;
}

[data-theme="dark"] .ck--preorder-cart .ck__kit-link {
    color: #8dcfff;
}

/* ── Counter ── */
[data-theme="dark"] .ck--preorder-cart .ck__counter {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .ck--preorder-cart .ck__counter-btn:hover {
    background: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .ck--preorder-cart .ck__counter-btn:active {
    background: rgba(255, 255, 255, 0.12);
}

/* ── Material inputs on glass cards ── */
[data-theme="dark"] .ck--preorder-cart .mi input,
[data-theme="dark"] .ck--preorder-cart .mi textarea,
[data-theme="dark"] .ck--preorder-cart .mi select {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.12);
    color: var(--typograph-black);
}

[data-theme="dark"] .ck--preorder-cart .mi select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%23666' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 12px;
}

[data-theme="dark"] .ck--preorder-cart .mi select option {
    background: #1a1a1a;
    color: #fff;
}

[data-theme="dark"] .ck--preorder-cart .mi input:focus,
[data-theme="dark"] .ck--preorder-cart .mi textarea:focus,
[data-theme="dark"] .ck--preorder-cart .mi select:focus {
    border-color: rgba(74, 144, 232, 0.5);
    box-shadow: 0 0 0 3px rgba(74, 144, 232, 0.12);
}

[data-theme="dark"] .ck--preorder-cart .mi input:hover:not(:focus),
[data-theme="dark"] .ck--preorder-cart .mi textarea:hover:not(:focus),
[data-theme="dark"]
    .ck--preorder-cart
    .mi
    select:hover:not(:focus):not(:disabled) {
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .ck--preorder-cart .mi label {
    color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] .ck--preorder-cart .mi input:focus + label,
[data-theme="dark"] .ck--preorder-cart .mi textarea:focus + label,
[data-theme="dark"] .ck--preorder-cart .mi select:focus + label,
[data-theme="dark"] .ck--preorder-cart .mi select.has-value + label {
    color: #8dcfff;
}

[data-theme="dark"] .ck--preorder-cart .mi input::placeholder,
[data-theme="dark"] .ck--preorder-cart .mi textarea::placeholder {
    color: transparent;
}

/* ── Summary lines ── */
[data-theme="dark"] .ck--preorder-cart .ck__sl {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .ck--preorder-cart .ck__summary-total {
    border-top-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .ck--preorder-cart .ck__summary-mini {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

/* ── Product badge ── */
[data-theme="dark"] .ck--preorder-cart .ck__product-badge {
    background: rgba(74, 144, 232, 0.15);
    color: #8dcfff;
}

/* ── Discount tag ── */
[data-theme="dark"] .ck--preorder-cart .ck__price-tag {
    background: rgba(52, 215, 105, 0.18);
    color: #6ee8a8;
}

/* ── Done screen ── */
[data-theme="dark"] .ck--preorder-cart .ck__done-order {
    background: linear-gradient(
        165deg,
        rgba(255, 255, 255, 0.06) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .ck--preorder-cart .ck__done-row + .ck__done-row {
    border-top-color: rgba(255, 255, 255, 0.08);
}

/* ── Done screen tracking link ── */
[data-theme="dark"] .ck--preorder-cart .ck__done-tracking-label {
    color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] .ck--preorder-cart .ck__done-tracking-box {
    background: rgba(0, 0, 0, 0.25);
    border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .ck--preorder-cart .ck__done-tracking-link {
    color: #8dcfff;
}

[data-theme="dark"] .ck--preorder-cart .ck__done-tracking-copy {
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .ck--preorder-cart .ck__done-tracking-copy:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

[data-theme="dark"] .ck--preorder-cart .ck__done-tracking-copied {
    color: #34d769;
}

/* ── Payment notice ── */
[data-theme="dark"] .ck--preorder-cart .ck__payment-notice {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px;
    border-radius: 14px;
    background: rgba(74, 144, 232, 0.06);
    border: 1px solid rgba(74, 144, 232, 0.12);
}

[data-theme="dark"]
    .ck--preorder-cart
    .ck__payment-notice
    > .material-symbols-rounded {
    color: #8dcfff;
    font-size: 22px;
    flex-shrink: 0;
    margin-top: 1px;
}

[data-theme="dark"] .ck--preorder-cart .ck__payment-notice p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.6);
}

/* ── Cart CTA — match .blue_element brand style ── */
[data-theme="dark"] .ck--preorder-cart .ck__cta {
    background:
        radial-gradient(
            ellipse 60% 60% at 15% 15%,
            rgba(255, 255, 255, 0.12) 0%,
            transparent 50%
        ),
        radial-gradient(
            60% 80% at 85% 20%,
            rgba(141, 207, 255, 0.5) 0%,
            transparent 100%
        ),
        radial-gradient(
            95.6% 92.05% at 17.92% 13.75%,
            #5ba8f5 0%,
            #0b57db 100%
        ),
        var(--background-accent-button);
    box-shadow:
        0 4px 24px rgba(11, 87, 219, 0.35),
        0 8px 40px rgba(11, 87, 219, 0.2),
        0 0 60px -10px rgba(77, 154, 255, 0.25),
        inset 2px 2px 8px rgba(255, 255, 255, 0.12),
        inset -2px -2px 8px rgba(0, 0, 0, 0.18);
    border: none;
}

[data-theme="dark"] .ck--preorder-cart .ck__cta::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1.5px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(180, 220, 255, 0.6) 0%,
            rgba(141, 207, 255, 0.2) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(141, 207, 255, 0.45) 0%,
            rgba(91, 168, 245, 0.15) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .ck--preorder-cart .ck__cta:hover {
    box-shadow:
        0 4px 28px rgba(11, 87, 219, 0.45),
        0 8px 50px rgba(11, 87, 219, 0.3),
        0 0 80px -10px rgba(77, 154, 255, 0.35),
        inset 2px 2px 10px rgba(255, 255, 255, 0.15),
        inset -2px -2px 10px rgba(0, 0, 0, 0.2);
}

/* ── Earn page ────────────────────────────────────── */

[data-theme="dark"] .earn-hero__subtitle {
    color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .earn-card {
    background: #1e1e1e;
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .earn-card:hover {
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .earn-card__desc {
    color: rgba(255, 255, 255, 0.55);
}

[data-theme="dark"] .earn-benefit {
    background: #1e1e1e;
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .earn-benefit:hover {
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .earn-benefit__text {
    color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .earn-form__form {
    background: #1e1e1e;
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .earn-form__field input,
[data-theme="dark"] .earn-form__field textarea {
    background: var(--background-cream-secondary);
    color: var(--typograph-black);
}

[data-theme="dark"] .earn-form__field input:focus,
[data-theme="dark"] .earn-form__field textarea:focus {
    background: #1e1e1e;
}

[data-theme="dark"] .earn-form__field input::placeholder,
[data-theme="dark"] .earn-form__field textarea::placeholder {
    color: rgba(255, 255, 255, 0.3);
}

[data-theme="dark"] .earn-form__success {
    background: #1e1e1e;
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .earn-form__success-text {
    color: rgba(255, 255, 255, 0.5);
}

/* ── Team page ────────────────────────────────────── */

[data-theme="dark"] .team-hero__badge {
    position: relative;
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    color: #7dbdff;
    border: none;
}

[data-theme="dark"] .team-hero__badge::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 255, 255, 0.25) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(255, 255, 255, 0.15) 0%,
            rgba(255, 255, 255, 0.04) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

[data-theme="dark"] .team-hero__accent,
[data-theme="dark"] .earn-hero__accent {
    background: linear-gradient(
        135deg,
        #4d9aff 0%,
        #6db8ff 30%,
        #8dcfff 60%,
        #a8e0ff 100%
    );
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 18px rgba(77, 154, 255, 0.4))
        drop-shadow(0 0 40px rgba(77, 154, 255, 0.15));
}

[data-theme="dark"] .team-hero__subtitle {
    color: rgba(255, 255, 255, 0.5);
}

/* team-card styles all in team.css now */

/* ── Image adjustments for dark backgrounds ───────── */

[data-theme="dark"] .hero_content-right img {
    filter: drop-shadow(0 20px 50px rgba(0, 0, 0, 0.4));
}

/* Solution section — removed (contacts page redesigned) */

[data-theme="dark"] .search_img {
    box-shadow:
        0 0 137px 40px rgba(3, 119, 255, 0.08),
        inset 0 0 208px 10px rgba(3, 119, 255, 0.08);
}

/* ── Mobile menu & help sidebar drawers ───────────── */

@media (max-width: 992px) {
    [data-theme="dark"] .header_section {
        background: rgba(20, 20, 24, 0.98);
    }

    [data-theme="dark"] .header_center {
        background: rgba(22, 22, 28, 0.98);
        backdrop-filter: blur(60px) saturate(1.8);
        -webkit-backdrop-filter: blur(60px) saturate(1.8);
        border: none;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    }

    [data-theme="dark"] .header-drop-menu .header_center {
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.06),
            0 -12px 48px rgba(0, 0, 0, 0.4);
    }

    /* Nav items inside dark menu */
    [data-theme="dark"] .nav_list li a {
        background: rgba(255, 255, 255, 0.05);
        border-color: rgba(255, 255, 255, 0.1);
        color: rgba(255, 255, 255, 0.75);
    }

    [data-theme="dark"] .nav_list li a:hover {
        background: rgba(255, 255, 255, 0.1);
        border-color: rgba(255, 255, 255, 0.16);
        color: rgba(255, 255, 255, 0.9);
    }

    [data-theme="dark"] .header_logo {
        background: none;
    }

    [data-theme="dark"] .header_section {
        box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.3);
    }

    /* When menu is open, make navbar match menu background */
    [data-theme="dark"] .header-drop-menu .header_section {
        background: rgba(22, 22, 28, 0.98) !important;
        backdrop-filter: blur(60px) saturate(1.8);
        -webkit-backdrop-filter: blur(60px) saturate(1.8);
        border-color: rgba(255, 255, 255, 0.08);
        box-shadow: none;
    }
}

@media (max-width: 768px) {
    [data-theme="dark"] .help_sidebar-category-wrap {
        background: rgba(10, 10, 14, 0.99);
        backdrop-filter: blur(40px) saturate(1.6);
        -webkit-backdrop-filter: blur(40px) saturate(1.6);
        border: 1px solid rgba(255, 255, 255, 0.08);
    }

    [data-theme="dark"] .help-active .help_sidebar-category-wrap {
        box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.7);
    }

    [data-theme="dark"] .dropdow-form-title {
        background: rgba(10, 10, 14, 0.99);
    }
}

/* ── Product features (technology page) ──────────── */

[data-theme="dark"] .product_features-item {
    color: rgba(255, 255, 255, 0.67);
}

/* ── Earn page — form subtitle ───────────────────── */

[data-theme="dark"] .earn-form__subtitle {
    color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .earn-section--alt {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 50%,
        rgba(20, 20, 24, 0.65) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        0 0 80px 0 rgba(255, 255, 255, 0.015),
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        inset 0 -1px 0 rgba(255, 255, 255, 0.02);
}

[data-theme="dark"] .earn-section--alt .earn-benefit {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.08);
}

/* team badges now in team.css */

/* ── Logo visibility on dark background ──────────── */

/* Main logo: green swoosh (#9EDF9C) + dark blue text (#0E46A3) */
[data-theme="dark"] .header_logo img {
    filter: none;
}

/* ═══════════════════════════════════════════════════════════
   AMBIENT GLOW SYSTEM — atmospheric lighting across the site
   ═══════════════════════════════════════════════════════════ */

/* ── Page-level ambient background glows ─────────────────── */

[data-theme="dark"] .wrapper {
    padding: 12px 12px 0;
    gap: 0;
    background:
        radial-gradient(
            ellipse 60% 40% at 10% 0%,
            rgba(20, 194, 79, 0.06) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 50% 35% at 90% 5%,
            rgba(74, 144, 232, 0.05) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 40% 25% at 50% 15%,
            rgba(170, 0, 255, 0.04) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 55% 30% at 20% 45%,
            rgba(41, 121, 255, 0.04) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 50% 30% at 80% 55%,
            rgba(245, 166, 35, 0.035) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 60% 35% at 15% 85%,
            rgba(170, 0, 255, 0.04) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 55% 30% at 85% 90%,
            rgba(20, 194, 79, 0.04) 0%,
            transparent 100%
        ),
        var(--background-page);
}

/* ── Stretch all wrapper children edge-to-edge past wrapper padding ── */

[data-theme="dark"] .main {
    margin-left: -12px;
    margin-right: -12px;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 72px;
    border-radius: 0;
    border-bottom: none;
}

[data-theme="dark"] .value-banner-section {
    margin-left: -12px;
    margin-right: -12px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 0;
    border-bottom: none;
}

[data-theme="dark"] .blog-value-banner {
    display: flex;
    align-items: center;
    gap: 32px;
    margin: 64px 0 0;
    padding: 48px 56px;
    min-height: 168px;
    border-radius: 28px;
    box-sizing: border-box;
    isolation: isolate;
    position: relative;
    z-index: 1;
}

[data-theme="dark"] .blog-value-banner__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    border-radius: 20px;
    background: linear-gradient(135deg, #14c24f 0%, #0ea83e 100%);
    box-shadow: 0 8px 24px rgba(20, 194, 79, 0.3);
}

[data-theme="dark"] .blog-value-banner__icon .material-symbols-rounded {
    font-size: 40px;
    color: #fff;
}

[data-theme="dark"] .blog-value-banner__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

[data-theme="dark"] .blog-value-banner__title {
    margin: 0;
    font-family: var(--second-family);
    font-weight: 500;
    font-size: 32px;
    line-height: 1.25;
    color: rgba(255, 255, 255, 0.94);
}

[data-theme="dark"] .blog-value-banner__text {
    margin: 0;
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 20px;
    line-height: 1.56;
    letter-spacing: -0.01em;
    color: rgba(255, 255, 255, 0.72);
}

/* Value banner — glassmorphic card like section_wht, green-tinted border */
[data-theme="dark"] .blog-value-banner {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 50%,
        rgba(20, 20, 24, 0.65) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border: 1px solid rgba(20, 194, 79, 0.15);
    border-radius: 28px;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        0 0 80px 0 rgba(255, 255, 255, 0.015),
        0 0 120px 20px rgba(100, 120, 160, 0.02),
        0 0 20px -5px rgba(20, 194, 79, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        inset 0 -1px 0 rgba(255, 255, 255, 0.02);
    position: relative;
    z-index: 1;
}

/* Non-glass sections adjacent to glass blocks — no extra vertical
   margin adjustments needed since backgrounds match --background-page. */

/* ── Energy Breakdown — enhanced atmospheric glows ───────── */

[data-theme="dark"] .eb {
    background:
        radial-gradient(
            ellipse 50% 65% at 20% 35%,
            rgba(74, 144, 232, 0.14) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 60% at 80% 55%,
            rgba(245, 166, 35, 0.1) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 40% 55% at 50% 85%,
            rgba(170, 0, 255, 0.09) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 30% 40% at 65% 20%,
            rgba(20, 194, 79, 0.06) 0%,
            transparent 100%
        );
}

/* ── Energy Breakdown donut — iOS-style glossy segments ──── */

[data-theme="dark"] .eb__donut-group {
    filter: url(#ebSoft);
    transition:
        transform 0.3s ease,
        filter 0.3s ease;
}

/* Per-segment colored glow on hover / active */
[data-theme="dark"] .eb__donut-group:nth-child(1):hover,
[data-theme="dark"] .eb__donut-group:nth-child(1).eb--active {
    filter: url(#ebGlow0);
}
[data-theme="dark"] .eb__donut-group:nth-child(2):hover,
[data-theme="dark"] .eb__donut-group:nth-child(2).eb--active {
    filter: url(#ebGlow1);
}
[data-theme="dark"] .eb__donut-group:nth-child(3):hover,
[data-theme="dark"] .eb__donut-group:nth-child(3).eb--active {
    filter: url(#ebGlow2);
}
[data-theme="dark"] .eb__donut-group:nth-child(4):hover,
[data-theme="dark"] .eb__donut-group:nth-child(4).eb--active {
    filter: url(#ebGlow3);
}

/* Brighter donut stroke outline for depth */
[data-theme="dark"] .eb__donut-seg {
    stroke: rgba(255, 255, 255, 0.1);
    stroke-width: 0.5;
}

/* iOS-style colored edge glow on segments */
[data-theme="dark"] .eb__donut-edge {
    opacity: 1;
    pointer-events: none;
}

/* ── Tariff Finder — dark theme ──────────────────────────── */

[data-theme="dark"] .tf {
    background:
        radial-gradient(
            ellipse 50% 65% at 25% 40%,
            rgba(20, 194, 79, 0.12) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 55% at 75% 60%,
            rgba(74, 144, 232, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 35% 45% at 50% 80%,
            rgba(245, 166, 35, 0.06) 0%,
            transparent 100%
        );
}

[data-theme="dark"] .tf__badge {
    color: #34d96a;
    background: rgba(20, 194, 79, 0.12);
    border: 1px solid rgba(20, 194, 79, 0.15);
}

/* tf__card base styles are already dark-first — no overrides needed */

[data-theme="dark"] .tf__cta-btn {
    box-shadow:
        0 4px 24px rgba(20, 194, 79, 0.4),
        0 0 0 1px rgba(20, 194, 79, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .tf__cta-btn:hover {
    box-shadow:
        0 8px 40px rgba(20, 194, 79, 0.5),
        0 0 0 1px rgba(20, 194, 79, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

/* ── How It Works / Steps — blue-green atmospheric ───────── */

[data-theme="dark"] .hero_steps {
    background:
        radial-gradient(
            ellipse 55% 50% at 10% 30%,
            rgba(41, 121, 255, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 50% 45% at 90% 70%,
            rgba(20, 194, 79, 0.07) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 35% 40% at 50% 10%,
            rgba(170, 0, 255, 0.05) 0%,
            transparent 100%
        );
}

/* ── Controls / App section — purple-blue atmospheric ────── */

[data-theme="dark"] .controls {
    background:
        radial-gradient(
            ellipse 50% 50% at 20% 40%,
            rgba(170, 0, 255, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 50% 45% at 80% 60%,
            rgba(41, 121, 255, 0.07) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 40% 40% at 50% 90%,
            rgba(20, 194, 79, 0.05) 0%,
            transparent 100%
        );
}

/* ── Sensor section — green-blue atmospheric ─────────────── */

[data-theme="dark"] .sensor {
    background:
        radial-gradient(
            ellipse 55% 50% at 15% 50%,
            rgba(20, 194, 79, 0.09) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 50% 50% at 85% 40%,
            rgba(74, 144, 232, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 40% 40% at 50% 80%,
            rgba(170, 0, 255, 0.05) 0%,
            transparent 100%
        );
}

/* ── FAQ section — subtle amber-purple ───────────────────── */

[data-theme="dark"] .answer {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 50%,
            rgba(245, 166, 35, 0.07) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 45% at 90% 50%,
            rgba(170, 0, 255, 0.06) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 30% 35% at 50% 20%,
            rgba(41, 121, 255, 0.04) 0%,
            transparent 100%
        );
}

/* ── Value banner — green glow layered on glassmorphism ──── */

[data-theme="dark"] .blog-value-banner {
    background:
        radial-gradient(
            ellipse 60% 80% at 20% 50%,
            rgba(20, 194, 79, 0.1) 0%,
            transparent 100%
        ),
        linear-gradient(
            135deg,
            rgba(20, 20, 24, 0.65) 0%,
            rgba(28, 28, 36, 0.5) 50%,
            rgba(20, 20, 24, 0.65) 100%
        );
}

/* ── Footer — edge-to-edge with gradient dividers ────────── */

[data-theme="dark"] .footer {
    margin-left: -12px;
    margin-right: -12px;
    padding-left: 12px;
    padding-right: 12px;
}

[data-theme="dark"] .footer_main {
    border-bottom: none;
    border-image: linear-gradient(
            90deg,
            transparent 0%,
            rgba(74, 144, 232, 0.2) 25%,
            rgba(170, 0, 255, 0.15) 50%,
            rgba(20, 194, 79, 0.2) 75%,
            transparent 100%
        )
        1;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

[data-theme="dark"] .footer-nav {
    border-bottom: none;
    border-image: linear-gradient(
            90deg,
            transparent 5%,
            rgba(255, 255, 255, 0.12) 30%,
            rgba(255, 255, 255, 0.08) 50%,
            rgba(255, 255, 255, 0.12) 70%,
            transparent 95%
        )
        1;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

[data-theme="dark"] .footer_bottom {
    border-bottom: none;
}

/* ── Header — add subtle top glow line ───────────────────── */

[data-theme="dark"] .header_section::after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 10%;
    right: 10%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(74, 144, 232, 0.3) 25%,
        rgba(170, 0, 255, 0.25) 50%,
        rgba(20, 194, 79, 0.3) 75%,
        transparent 100%
    );
    pointer-events: none;
}

/* ── Glowing accent lines between sections ───────────────── */

[data-theme="dark"] .hero_steps::before {
    content: "";
    position: absolute;
    top: 0;
    left: 5%;
    right: 5%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(41, 121, 255, 0.2) 30%,
        rgba(245, 166, 35, 0.2) 70%,
        transparent 100%
    );
    z-index: 1;
}

[data-theme="dark"] .controls::before {
    content: "";
    position: absolute;
    top: 0;
    left: 5%;
    right: 5%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(170, 0, 255, 0.2) 25%,
        rgba(74, 144, 232, 0.25) 50%,
        rgba(20, 194, 79, 0.2) 75%,
        transparent 100%
    );
}

[data-theme="dark"] .sensor::before {
    content: "";
    position: absolute;
    top: 0;
    left: 5%;
    right: 5%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(20, 194, 79, 0.25) 30%,
        rgba(41, 121, 255, 0.2) 70%,
        transparent 100%
    );
}

[data-theme="dark"] .answer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 5%;
    right: 5%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(245, 166, 35, 0.2) 30%,
        rgba(170, 0, 255, 0.2) 70%,
        transparent 100%
    );
}

/* Ensure sections have position relative for pseudo-elements */
[data-theme="dark"] .hero_steps,
[data-theme="dark"] .controls,
[data-theme="dark"] .sensor,
[data-theme="dark"] .answer {
    position: relative;
}

@media (max-width: 920px) {
    [data-theme="dark"] .hero_steps::before,
    [data-theme="dark"] .controls::before,
    [data-theme="dark"] .sensor::before,
    [data-theme="dark"] .answer::before {
        display: none;
    }

    [data-theme="dark"] .controls_card-item:nth-child(1),
    [data-theme="dark"] .controls_card-item:nth-child(2),
    [data-theme="dark"] .controls_card-item:nth-child(3) {
        border-color: rgba(255, 255, 255, 0.1);
    }
}

/* ── section_wht — glassmorphism like header ─────────────── */

[data-theme="dark"] .section_wht {
    position: relative;
    z-index: 1;
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 50%,
        rgba(20, 20, 24, 0.65) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        0 0 80px 0 rgba(255, 255, 255, 0.015),
        0 0 120px 20px rgba(100, 120, 160, 0.02),
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        inset 0 -1px 0 rgba(255, 255, 255, 0.02);
}

/* ── Full-width section_wht — atmospheric backgrounds ──────── */

[data-theme="dark"] .hero.section_wht,
[data-theme="dark"] .biz-hero.section_wht,
[data-theme="dark"] .team-hero.section_wht,
[data-theme="dark"] .pol-hero.section_wht {
    background:
        radial-gradient(
            ellipse 50% 40% at 15% 10%,
            rgba(20, 194, 79, 0.1) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 35% at 85% 15%,
            rgba(74, 144, 232, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 40% 30% at 50% 90%,
            rgba(170, 0, 255, 0.06) 0%,
            transparent 100%
        ),
        linear-gradient(
            135deg,
            rgba(20, 20, 24, 0.65) 0%,
            rgba(28, 28, 36, 0.5) 50%,
            rgba(20, 20, 24, 0.65) 100%
        );
}

[data-theme="dark"] .application.section_wht {
    background:
        radial-gradient(
            ellipse 50% 45% at 80% 20%,
            rgba(74, 144, 232, 0.1) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 40% at 20% 80%,
            rgba(20, 194, 79, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 35% 35% at 50% 50%,
            rgba(245, 166, 35, 0.06) 0%,
            transparent 100%
        ),
        linear-gradient(
            135deg,
            rgba(20, 20, 24, 0.65) 0%,
            rgba(28, 28, 36, 0.5) 50%,
            rgba(20, 20, 24, 0.65) 100%
        );
}

[data-theme="dark"] .appmonisensa_form.section_wht {
    background:
        radial-gradient(
            ellipse 50% 40% at 75% 25%,
            rgba(245, 166, 35, 0.1) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 40% at 25% 75%,
            rgba(74, 144, 232, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 35% 30% at 50% 50%,
            rgba(20, 194, 79, 0.06) 0%,
            transparent 100%
        ),
        linear-gradient(
            135deg,
            rgba(20, 20, 24, 0.65) 0%,
            rgba(28, 28, 36, 0.5) 50%,
            rgba(20, 20, 24, 0.65) 100%
        );
}

/* ── Why-NILM cards — glowing borders ────────────────────── */

[data-theme="dark"] .why-nilm__card {
    background:
        radial-gradient(
            ellipse 80% 60% at 50% 0%,
            rgba(74, 144, 232, 0.06) 0%,
            transparent 100%
        ),
        #1a1a1a;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .why-nilm__card:hover {
    border-color: rgba(74, 144, 232, 0.15);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(74, 144, 232, 0.15),
        0 0 20px -5px rgba(74, 144, 232, 0.1);
}

[data-theme="dark"] .tf__card {
    background:
        radial-gradient(
            ellipse 80% 60% at 50% 0%,
            rgba(74, 144, 232, 0.06) 0%,
            transparent 100%
        ),
        #1a1a1a;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .tf__card:hover {
    border-color: rgba(74, 144, 232, 0.15);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(74, 144, 232, 0.15),
        0 0 20px -5px rgba(74, 144, 232, 0.1);
}

[data-theme="dark"] .tf__card--best {
    border-color: rgba(20, 194, 79, 0.18);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(20, 194, 79, 0.18);
}

[data-theme="dark"] .tf__card--best:hover {
    border-color: rgba(20, 194, 79, 0.24);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(20, 194, 79, 0.24),
        0 0 20px -5px rgba(20, 194, 79, 0.12);
}

/* ── Step cards — dark theme uses base styles (#1e1e1e) ────── */

/* ── Energy Breakdown items — glowing ring ───────────────── */

[data-theme="dark"] .eb__item {
    background:
        radial-gradient(
            ellipse 80% 60% at 50% 100%,
            rgba(245, 166, 35, 0.05) 0%,
            transparent 100%
        ),
        #1e1e1e;
    border: 1px solid rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .hv-event__card {
    background:
        radial-gradient(
            ellipse 80% 60% at 50% 100%,
            rgba(245, 166, 35, 0.05) 0%,
            transparent 100%
        ),
        #1e1e1e;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.06),
        0 0 0 1px rgba(0, 0, 0, 0.03);
}

[data-theme="dark"] .eb__item:hover,
[data-theme="dark"] .eb__item.eb--active {
    border-color: rgba(255, 255, 255, 0.18);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .hv-event:hover .hv-event__card {
    border-color: rgba(255, 255, 255, 0.18);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .eb__item[data-cat="climate"]:hover,
[data-theme="dark"] .eb__item[data-cat="climate"].eb--active {
    border-color: rgba(74, 144, 232, 0.3);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(74, 144, 232, 0.15);
}
[data-theme="dark"] .eb__item[data-cat="electronics"]:hover,
[data-theme="dark"] .eb__item[data-cat="electronics"].eb--active {
    border-color: rgba(155, 109, 215, 0.3);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(155, 109, 215, 0.15);
}
[data-theme="dark"] .eb__item[data-cat="kitchen"]:hover,
[data-theme="dark"] .eb__item[data-cat="kitchen"].eb--active {
    border-color: rgba(245, 166, 35, 0.3);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(245, 166, 35, 0.15);
}
[data-theme="dark"] .eb__item[data-cat="home"]:hover,
[data-theme="dark"] .eb__item[data-cat="home"].eb--active {
    border-color: rgba(52, 199, 89, 0.3);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(52, 199, 89, 0.15);
}

[data-theme="dark"] .hv-event--climate:hover .hv-event__card {
    border-color: rgba(74, 144, 232, 0.3);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(74, 144, 232, 0.15);
}

[data-theme="dark"] .hv-event--kitchen:hover .hv-event__card {
    border-color: rgba(245, 166, 35, 0.3);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(245, 166, 35, 0.15);
}

[data-theme="dark"] .hv-event--other:hover .hv-event__card {
    border-color: rgba(52, 199, 89, 0.3);
    box-shadow:
        0 4px 20px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(52, 199, 89, 0.15);
}

/* ── Controls cards — intensified colored glow on hover ──── */

[data-theme="dark"] .controls_card-item:nth-child(1):hover {
    border-color: rgba(90, 220, 155, 0.45);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 50px -5px rgba(90, 220, 155, 0.35) !important;
}

[data-theme="dark"] .controls_card-item:nth-child(2):hover {
    border-color: rgba(120, 170, 240, 0.45);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 50px -5px rgba(110, 165, 240, 0.35) !important;
}

[data-theme="dark"] .controls_card-item:nth-child(3):hover {
    border-color: rgba(255, 198, 92, 0.46);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 50px -5px rgba(245, 166, 35, 0.34) !important;
}

/* ── Earn page — atmospheric glows ───────────────────────── */

[data-theme="dark"] .earn-hero {
    background:
        radial-gradient(
            ellipse 50% 50% at 20% 40%,
            rgba(245, 166, 35, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 45% at 80% 60%,
            rgba(20, 194, 79, 0.06) 0%,
            transparent 100%
        );
}

[data-theme="dark"] .earn-card {
    background:
        radial-gradient(
            ellipse 80% 50% at 50% 0%,
            rgba(74, 144, 232, 0.05) 0%,
            transparent 100%
        ),
        #1e1e1e;
}

[data-theme="dark"] .earn-card:hover {
    border-color: rgba(74, 144, 232, 0.12);
}

/* ── Team page — atmospheric glows ───────────────────────── */

[data-theme="dark"] .team-hero {
    background:
        radial-gradient(
            ellipse 60% 50% at 20% 30%,
            rgba(74, 144, 232, 0.1) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 50% 50% at 80% 40%,
            rgba(155, 109, 215, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 40% 40% at 50% 90%,
            rgba(52, 199, 89, 0.04) 0%,
            transparent 100%
        ),
        linear-gradient(
            135deg,
            rgba(20, 20, 24, 0.65) 0%,
            rgba(28, 28, 36, 0.5) 50%,
            rgba(20, 20, 24, 0.65) 100%
        );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .team-hero::after {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(74, 144, 232, 0.3) 20%,
        rgba(155, 109, 215, 0.35) 50%,
        rgba(74, 144, 232, 0.3) 80%,
        transparent 100%
    );
}

/* ── Technology hero — glassmorphic + atmospheric glows ──── */

[data-theme="dark"] .tech-hero {
    background:
        radial-gradient(
            ellipse 50% 50% at 15% 30%,
            rgba(20, 194, 79, 0.08) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 45% at 85% 40%,
            rgba(74, 144, 232, 0.07) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 35% 35% at 50% 80%,
            rgba(170, 0, 255, 0.05) 0%,
            transparent 100%
        ),
        linear-gradient(
            135deg,
            rgba(20, 20, 24, 0.65) 0%,
            rgba(28, 28, 36, 0.5) 50%,
            rgba(20, 20, 24, 0.65) 100%
        );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 28px;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        0 0 80px 0 rgba(255, 255, 255, 0.015),
        0 0 120px 20px rgba(100, 120, 160, 0.02),
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        inset 0 -1px 0 rgba(255, 255, 255, 0.02);
    z-index: 1;
}

/* ── Help / Blog page — atmospheric glows ────────────────── */

[data-theme="dark"] .help_archive {
    background:
        radial-gradient(
            ellipse 50% 40% at 10% 30%,
            rgba(74, 144, 232, 0.06) 0%,
            transparent 100%
        ),
        radial-gradient(
            ellipse 45% 40% at 90% 70%,
            rgba(245, 166, 35, 0.05) 0%,
            transparent 100%
        );
}

/* ── Contacts page — old glow removed (page redesigned) ── */

/* ── Cart page — atmospheric glows ───────────────────────── */

[data-theme="dark"] .ck__card {
    background:
        radial-gradient(
            ellipse 80% 50% at 50% 0%,
            rgba(74, 144, 232, 0.04) 0%,
            transparent 100%
        ),
        #1e1e1e;
}

[data-theme="dark"] .ck__card--summary {
    background:
        radial-gradient(
            ellipse 80% 50% at 50% 0%,
            rgba(245, 166, 35, 0.05) 0%,
            transparent 100%
        ),
        #1e1e1e;
}

/* ── Category grid cards — inner glow ────────────────────── */

[data-theme="dark"] .catgrid__card {
    background:
        radial-gradient(
            ellipse 80% 50% at 50% 0%,
            rgba(74, 144, 232, 0.04) 0%,
            transparent 100%
        ),
        #1e1e1e;
}

[data-theme="dark"] .catgrid__card:hover {
    border-color: rgba(74, 144, 232, 0.12);
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.3),
        0 0 20px -5px rgba(74, 144, 232, 0.08);
}

/* ── Blog post cards — glassmorphic ────────────────────────── */

[data-theme="dark"] .blog-post {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: none;
}

/* ── Sensor category cards — colored glow intensified ────── */

[data-theme="dark"] .sensor_cat--climate:hover {
    border-color: rgba(120, 170, 240, 0.45);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 50px -5px rgba(110, 165, 240, 0.35);
}

[data-theme="dark"] .sensor_cat--kitchen:hover {
    border-color: rgba(240, 180, 110, 0.45);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 50px -5px rgba(240, 180, 110, 0.35);
}

[data-theme="dark"] .sensor_cat--home:hover {
    border-color: rgba(90, 220, 155, 0.45);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 50px -5px rgba(90, 220, 155, 0.35);
}

[data-theme="dark"] .sensor_cat--electronics:hover {
    border-color: rgba(180, 140, 230, 0.45);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.3),
        0 0 50px -5px rgba(180, 140, 230, 0.35);
}

/* ── Theme toggle — glow effect ──────────────────────────── */

[data-theme="dark"] .theme-toggle:hover {
    box-shadow: 0 0 16px -4px rgba(240, 192, 64, 0.25);
}

/* ── Buy button — enhanced glow in dark mode ─────────────── */

[data-theme="dark"] .header_buy-btn {
    box-shadow:
        0 4px 24px 0 rgba(200, 130, 10, 0.2),
        0 4px 20px 0 rgba(200, 130, 10, 0.45),
        0 0 30px -5px rgba(245, 166, 35, 0.2),
        inset 2px 2px 8px rgba(255, 255, 255, 0.15),
        inset -2px -2px 8px rgba(120, 60, 0, 0.25);
}

/* Corner glow border — gold iOS-style diagonal shine */
[data-theme="dark"] .header_buy-btn::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1.5px;
    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 230, 140, 0.7) 0%,
            rgba(245, 200, 80, 0.25) 30%,
            transparent 55%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(245, 190, 60, 0.5) 0%,
            rgba(200, 140, 20, 0.15) 30%,
            transparent 55%
        );
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 0;
}

[data-theme="dark"] .header_buy-btn:hover {
    box-shadow:
        0 4px 28px 0 rgba(200, 130, 10, 0.35),
        0 8px 50px rgba(200, 130, 10, 0.25),
        0 0 60px -5px rgba(245, 166, 35, 0.3),
        inset 2px 2px 10px rgba(255, 255, 255, 0.18),
        inset -2px -2px 8px rgba(120, 60, 0, 0.2);
}

/* ── Scroll-top — glow on hover ──────────────────────────── */

[data-theme="dark"] .scroll-top:hover {
    box-shadow: 0 0 20px -5px rgba(74, 144, 232, 0.2);
}

/* ── Sensor buy button — intensified glow ────────────────── */

[data-theme="dark"] .sensor_btn-item {
    box-shadow:
        0 8px 32px rgba(10, 60, 180, 0.5),
        0 20px 60px rgba(10, 60, 180, 0.3),
        0 0 100px rgba(50, 120, 240, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* ── Form inputs — glow on focus ─────────────────────────── */

[data-theme="dark"] .form-group input:focus {
    border-color: rgba(74, 144, 232, 0.4);
    box-shadow: 0 0 16px -4px rgba(74, 144, 232, 0.15);
}

[data-theme="dark"] .earn-form__field input:focus,
[data-theme="dark"] .earn-form__field textarea:focus {
    border-color: rgba(74, 144, 232, 0.3);
    box-shadow: 0 0 16px -4px rgba(74, 144, 232, 0.12);
}

[data-theme="dark"] .blog-search input:focus {
    border-color: rgba(74, 144, 232, 0.4);
    box-shadow: 0 0 16px -4px rgba(74, 144, 232, 0.15);
}

[data-theme="dark"] .search__input:focus {
    box-shadow: 0 0 16px -4px rgba(74, 144, 232, 0.15);
}

/* ═══════════════════════════════════════════════════════════
   iOS-STYLE DIAGONAL GLOW — inner light on icon badges
   Top-left warm highlight + bottom-right cool highlight
   ═══════════════════════════════════════════════════════════ */

/* Base: make icon badges positioning context for the overlay */
[data-theme="dark"] .why-nilm__icon,
[data-theme="dark"] .pain__icon,
[data-theme="dark"] .hero_step-card-icon,
[data-theme="dark"] .tech-hero__trust-icon,
[data-theme="dark"] .hv-event__icon,
[data-theme="dark"] .science__card-icon,
[data-theme="dark"] .tech-inside__card-icon,
[data-theme="dark"] .catgrid__icon-wrap,
[data-theme="dark"] .earn-card__icon-wrap,
[data-theme="dark"] .earn-section__icon-wrap,
[data-theme="dark"] .blog-value-banner__icon,
[data-theme="dark"] .eb__item-icon-wrap,
[data-theme="dark"] .how-nilm__step-icon,
[data-theme="dark"] .metrics__stat-icon {
    position: relative;
    overflow: hidden;
}

/* Diagonal glow overlay: radial light in top-left + bottom-right,
   plus a 1px inset border that's brighter along the 135deg diagonal */
[data-theme="dark"] .why-nilm__icon::after,
[data-theme="dark"] .pain__icon::after,
[data-theme="dark"] .hero_step-card-icon::after,
[data-theme="dark"] .tech-hero__trust-icon::after,
[data-theme="dark"] .hv-event__icon::after,
[data-theme="dark"] .science__card-icon::after,
[data-theme="dark"] .tech-inside__card-icon::after,
[data-theme="dark"] .catgrid__icon-wrap::after,
[data-theme="dark"] .earn-card__icon-wrap::after,
[data-theme="dark"] .earn-section__icon-wrap::after,
[data-theme="dark"] .blog-value-banner__icon::after,
[data-theme="dark"] .eb__item-icon-wrap::after,
[data-theme="dark"] .how-nilm__step-icon::after,
[data-theme="dark"] .metrics__stat-icon::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
        radial-gradient(
            ellipse 70% 70% at 15% 15%,
            rgba(255, 255, 255, 0.35) 0%,
            rgba(255, 255, 255, 0.08) 30%,
            transparent 60%
        ),
        radial-gradient(
            ellipse 55% 55% at 85% 85%,
            rgba(255, 255, 255, 0.12) 0%,
            rgba(255, 255, 255, 0.02) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(255, 255, 255, 0.35),
        inset -1px -1px 0 rgba(255, 255, 255, 0.1);
    pointer-events: none;
    z-index: 1;
}

[data-theme="dark"] .tech-hero__trust-item--blue:hover {
    border-color: rgba(74, 144, 232, 0.16);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(74, 144, 232, 0.16),
        0 0 20px -5px rgba(74, 144, 232, 0.12);
}

[data-theme="dark"] .tech-hero__trust-item--purple:hover {
    border-color: rgba(155, 109, 215, 0.16);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(155, 109, 215, 0.16),
        0 0 20px -5px rgba(155, 109, 215, 0.12);
}

[data-theme="dark"] .tech-hero__trust-item--green:hover {
    border-color: rgba(20, 194, 79, 0.16);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(20, 194, 79, 0.16),
        0 0 20px -5px rgba(20, 194, 79, 0.12);
}

[data-theme="dark"] .tech-hero__trust-item--orange:hover {
    border-color: rgba(245, 166, 35, 0.16);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.25),
        0 0 0 1px rgba(245, 166, 35, 0.16),
        0 0 20px -5px rgba(245, 166, 35, 0.12);
}

/* ═══════════════════════════════════════════════════════════
   iOS-STYLE DIAGONAL GLOW — sensor category cards
   Adapted for larger card surfaces
   ═══════════════════════════════════════════════════════════ */

[data-theme="dark"] .sensor_cat {
    position: relative;
}

[data-theme="dark"] .sensor_cat::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
}

[data-theme="dark"] .sensor_cat--climate::after {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 10%,
            rgba(150, 200, 255, 0.35) 0%,
            rgba(110, 165, 240, 0.1) 35%,
            transparent 65%
        ),
        radial-gradient(
            ellipse 40% 40% at 90% 90%,
            rgba(110, 165, 240, 0.18) 0%,
            rgba(110, 165, 240, 0.03) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(150, 200, 255, 0.3),
        inset -1px -1px 0 rgba(110, 165, 240, 0.12);
}

[data-theme="dark"] .sensor_cat--kitchen::after {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 10%,
            rgba(255, 210, 150, 0.35) 0%,
            rgba(240, 180, 110, 0.1) 35%,
            transparent 65%
        ),
        radial-gradient(
            ellipse 40% 40% at 90% 90%,
            rgba(240, 180, 110, 0.18) 0%,
            rgba(240, 180, 110, 0.03) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(255, 210, 150, 0.3),
        inset -1px -1px 0 rgba(240, 180, 110, 0.12);
}

[data-theme="dark"] .sensor_cat--home::after {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 10%,
            rgba(130, 255, 190, 0.35) 0%,
            rgba(90, 220, 155, 0.1) 35%,
            transparent 65%
        ),
        radial-gradient(
            ellipse 40% 40% at 90% 90%,
            rgba(90, 220, 155, 0.18) 0%,
            rgba(90, 220, 155, 0.03) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(130, 255, 190, 0.3),
        inset -1px -1px 0 rgba(90, 220, 155, 0.12);
}

[data-theme="dark"] .sensor_cat--electronics::after {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 10%,
            rgba(210, 170, 255, 0.35) 0%,
            rgba(180, 140, 230, 0.1) 35%,
            transparent 65%
        ),
        radial-gradient(
            ellipse 40% 40% at 90% 90%,
            rgba(180, 140, 230, 0.18) 0%,
            rgba(180, 140, 230, 0.03) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(210, 170, 255, 0.3),
        inset -1px -1px 0 rgba(180, 140, 230, 0.12);
}

/* ═══════════════════════════════════════════════════════════
   iOS-STYLE DIAGONAL GLOW — controls cards
   Color-tinted glow matching each card's accent
   ═══════════════════════════════════════════════════════════ */

[data-theme="dark"] .controls_card-item::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 2;
}

[data-theme="dark"] .controls_card-item:nth-child(1)::after {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 10%,
            rgba(130, 255, 190, 0.35) 0%,
            rgba(90, 220, 155, 0.1) 35%,
            transparent 65%
        ),
        radial-gradient(
            ellipse 40% 40% at 90% 90%,
            rgba(90, 220, 155, 0.15) 0%,
            rgba(90, 220, 155, 0.03) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(130, 255, 190, 0.3),
        inset -1px -1px 0 rgba(90, 220, 155, 0.12);
}

[data-theme="dark"] .controls_card-item:nth-child(2)::after {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 10%,
            rgba(150, 200, 255, 0.35) 0%,
            rgba(110, 165, 240, 0.1) 35%,
            transparent 65%
        ),
        radial-gradient(
            ellipse 40% 40% at 90% 90%,
            rgba(110, 165, 240, 0.15) 0%,
            rgba(110, 165, 240, 0.03) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(150, 200, 255, 0.3),
        inset -1px -1px 0 rgba(110, 165, 240, 0.12);
}

[data-theme="dark"] .controls_card-item:nth-child(3)::after {
    background:
        radial-gradient(
            ellipse 50% 50% at 10% 10%,
            rgba(255, 228, 153, 0.34) 0%,
            rgba(245, 166, 35, 0.12) 35%,
            transparent 65%
        ),
        radial-gradient(
            ellipse 40% 40% at 90% 90%,
            rgba(245, 166, 35, 0.16) 0%,
            rgba(221, 137, 14, 0.04) 35%,
            transparent 55%
        );
    box-shadow:
        inset 1px 1px 0 rgba(255, 228, 153, 0.28),
        inset -1px -1px 0 rgba(245, 166, 35, 0.12);
}

/* ═══════════════════════════════════════════════════════════════════
   STORE & PRODUCT DETAIL — dark glassmorphic overrides
   ═══════════════════════════════════════════════════════════════════ */

[data-theme="dark"] .st-hero__inner {
    background:
        radial-gradient(
            ellipse 60% 80% at 20% 50%,
            rgba(74, 144, 232, 0.08) 0%,
            transparent 100%
        ),
        linear-gradient(
            135deg,
            rgba(20, 20, 24, 0.65) 0%,
            rgba(28, 28, 36, 0.5) 50%,
            rgba(20, 20, 24, 0.65) 100%
        );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .st-hero__count,
[data-theme="dark"] .st-hero__ship {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .st-sidebar__card {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .st-sidebar__item:hover {
    background: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .st-sidebar__item--active {
    background: rgba(3, 119, 255, 0.12);
}

[data-theme="dark"] .st-sidebar__info {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .st-card {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .st-card:hover {
    box-shadow:
        0 16px 48px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

[data-theme="dark"] .st-card__img-wrap {
    background: linear-gradient(
        145deg,
        rgba(40, 50, 80, 0.5) 0%,
        rgba(30, 35, 55, 0.4) 50%,
        rgba(25, 30, 50, 0.5) 100%
    );
}

[data-theme="dark"] .st-card__pill {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .pd__info-card {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .pd__main-wrap,
[data-theme="dark"] .pd__gallery-placeholder {
    background: linear-gradient(
        145deg,
        rgba(40, 50, 80, 0.5) 0%,
        rgba(30, 35, 55, 0.4) 50%,
        rgba(25, 30, 50, 0.5) 100%
    );
}

[data-theme="dark"] .pd__price-block,
[data-theme="dark"] .pd__delivery-opt,
[data-theme="dark"] .pd__trust-item,
[data-theme="dark"] .pd__mp-btn,
[data-theme="dark"] .pd-tabs__link,
[data-theme="dark"] .pd-feat__card {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .pd__buy-now {
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .pd__buy-now:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.18);
}

[data-theme="dark"] .pd__mp-btn:hover {
    border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .pd__guarantee {
    background: rgba(20, 194, 79, 0.08);
    border-color: rgba(20, 194, 79, 0.15);
}

[data-theme="dark"] .pd-tabs__bar {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .pd-tabs__btn:hover {
    background: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .pd-tabs__btn--active {
    background: rgba(255, 255, 255, 0.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .pd-tabs__content {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .pd-specs__row {
    border-color: rgba(255, 255, 255, 0.14);
}

[data-theme="dark"] .pd-specs__row:nth-child(even) {
    background: rgba(255, 255, 255, 0.02);
}

/* Reviews dark theme */
[data-theme="dark"] .pd-review {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.65) 0%,
        rgba(28, 28, 36, 0.5) 100%
    );
    backdrop-filter: blur(24px) saturate(1.3);
    -webkit-backdrop-filter: blur(24px) saturate(1.3);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 8px 32px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .pd-review:hover {
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow:
        0 8px 40px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

/* ═══════════════════════════════════════════════════
   Accuracy Metrics — dark theme
   ═══════════════════════════════════════════════════ */

[data-theme="dark"] .metrics__badge {
    background: rgba(74, 144, 232, 0.12);
    color: #6db3f8;
}

[data-theme="dark"] .metrics__title-accent {
    color: #6db3f8;
}

/* ═══════════════════════════════════════════════════
   Technology Roadmap — dark theme
   ═══════════════════════════════════════════════════ */

[data-theme="dark"] .roadmap__badge {
    background: linear-gradient(
        135deg,
        rgba(155, 109, 215, 0.18) 0%,
        rgba(155, 109, 215, 0.08) 100%
    );
    color: #d1a5ff;
    border-color: rgba(187, 140, 255, 0.24);
    box-shadow:
        0 12px 30px rgba(155, 109, 215, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .roadmap__badge {
    color: #c59bff;
    background: rgba(60, 38, 94, 0.48);
    border-color: rgba(197, 155, 255, 0.18);
}

[data-theme="dark"] .roadmap__badge-dot {
    background: #c59bff;
    box-shadow:
        0 0 18px rgba(197, 155, 255, 0.85),
        0 0 34px rgba(197, 155, 255, 0.4);
}

[data-theme="dark"] .roadmap__title-accent {
    color: #d1a5ff;
    text-shadow: 0 0 20px rgba(187, 140, 255, 0.22);
}

[data-theme="dark"] .roadmap::before,
[data-theme="dark"] .roadmap::after {
    display: none;
}

[data-theme="dark"] .roadmap__timeline::before {
    background: linear-gradient(
        180deg,
        rgba(132, 154, 186, 0.5) 0%,
        rgba(132, 154, 186, 0.32) 55%,
        rgba(132, 154, 186, 0.18) 100%
    ) !important;
}

[data-theme="dark"] .roadmap__phase-dot {
    border-color: rgba(var(--roadmap-accent-rgb), 0.48) !important;
    background: rgba(16, 21, 31, 0.96) !important;
    box-shadow: 0 0 0 3px rgba(var(--roadmap-accent-rgb), 0.12) !important;
}

[data-theme="dark"] .roadmap__phase-dot-inner {
    box-shadow: 0 0 8px rgba(var(--roadmap-accent-rgb), 0.45) !important;
}

[data-theme="dark"] .roadmap__phase-line {
    display: none;
}

[data-theme="dark"] .roadmap__phase-card {
    background: linear-gradient(
        140deg,
        rgba(46, 58, 76, 0.84) 0%,
        rgba(35, 42, 54, 0.9) 46%,
        rgba(28, 33, 43, 0.94) 100%
    ) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    box-shadow:
        0 16px 38px rgba(0, 0, 0, 0.32),
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        inset 0 -1px 0 rgba(255, 255, 255, 0.02) !important;
}

[data-theme="dark"] .roadmap__phase-card::before {
    background: linear-gradient(
        to left,
        rgba(255, 255, 255, 0.26) 0%,
        rgba(255, 255, 255, 0.08) 40%,
        rgba(255, 255, 255, 0) 100%
    ) !important;
}

[data-theme="dark"] .roadmap__phase-card::after {
    background: radial-gradient(
        120% 120% at 100% 0%,
        rgba(110, 170, 255, 0.11) 0%,
        rgba(110, 170, 255, 0.03) 36%,
        rgba(110, 170, 255, 0) 72%
    ) !important;
    opacity: 0.9 !important;
}

[data-theme="dark"] .roadmap__phase--upcoming .roadmap__phase-card,
[data-theme="dark"] .roadmap__phase--future .roadmap__phase-card {
    opacity: 1;
}

[data-theme="dark"] .roadmap__phase-title {
    color: rgba(255, 255, 255, 0.95);
}

[data-theme="dark"] .roadmap__phase--upcoming .roadmap__phase-title,
[data-theme="dark"] .roadmap__phase--future .roadmap__phase-title {
    color: rgba(255, 255, 255, 0.9);
}

[data-theme="dark"] .roadmap__phase-desc {
    color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .roadmap__phase--upcoming .roadmap__phase-desc,
[data-theme="dark"] .roadmap__phase--future .roadmap__phase-desc {
    color: rgba(255, 255, 255, 0.66);
}

[data-theme="dark"] .roadmap__phase-icon {
    background: linear-gradient(
        180deg,
        rgba(var(--roadmap-accent-rgb), 0.3) 0%,
        rgba(var(--roadmap-accent-rgb), 0.12) 100%
    );
    border-color: rgba(var(--roadmap-accent-rgb), 0.35);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 8px 20px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .roadmap__phase-status--soon {
    color: #ffbf76;
}

[data-theme="dark"] .roadmap__phase-status--future {
    color: #c9a0ff;
}

[data-theme="dark"] .roadmap__feature {
    color: rgba(255, 255, 255, 0.85);
    background: rgba(20, 24, 34, 0.78) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .roadmap__phase--upcoming .roadmap__feature,
[data-theme="dark"] .roadmap__phase--future .roadmap__feature {
    color: rgba(255, 255, 255, 0.82);
}

/* ═══════════════════════════════════════════════════
   Partners — dark theme
   ═══════════════════════════════════════════════════ */

[data-theme="dark"] .partners__badge {
    background: rgba(74, 144, 232, 0.12);
    color: #6db3f8;
}

[data-theme="dark"] .partners__title-accent {
    background: linear-gradient(135deg, #4a90e8 0%, #6db3f8 50%, #a0d0ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

[data-theme="dark"] .partners__item {
    opacity: 0.4;
    filter: grayscale(1) brightness(2);
}

[data-theme="dark"] .partners__item:hover {
    opacity: 1;
    filter: grayscale(0) brightness(1);
}

/* ═══════════════════════════════════════════════════
   Testimonials — dark theme
   ═══════════════════════════════════════════════════ */

[data-theme="dark"] .testi__badge {
    background: rgba(245, 166, 35, 0.12);
    color: #f5c161;
}

[data-theme="dark"] .testi__title-accent {
    color: #f5c161;
}

[data-theme="dark"] .testi__review-card {
    background: linear-gradient(
        135deg,
        rgba(20, 20, 24, 0.92) 0%,
        rgba(28, 28, 36, 0.88) 100%
    );
    backdrop-filter: blur(40px) saturate(1.3);
    -webkit-backdrop-filter: blur(40px) saturate(1.3);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.35),
        0 4px 12px rgba(0, 0, 0, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

/* Dark deck overlay — solid dark to hide text on stacked cards */
[data-theme="dark"] .testi__review-card::before {
    background: #1c1c22;
}

[data-theme="dark"] .testi__review[data-depth="1"] .testi__review-card {
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .testi__review[data-depth="2"] .testi__review-card {
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .testi__quote-mark {
    color: #6db3f8;
    opacity: 0.15;
}

[data-theme="dark"] .testi__review-avatar {
    background: rgba(74, 144, 232, 0.15);
    color: #6db3f8;
}

[data-theme="dark"] .testi__review-stars {
    color: #f5c161;
}

[data-theme="dark"] .testi__nav-btn {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .testi__nav-btn:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: #6db3f8;
    color: #6db3f8;
}

/* Shared glow-dot — dark theme */
[data-theme="dark"] .glow-dot {
    background: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .glow-dot::after {
    background: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .glow-dot--active {
    background: rgba(74, 144, 232, 0.2);
}

[data-theme="dark"] .glow-dot--active::after {
    background: #4a90e8;
    box-shadow: 0 0 12px rgba(74, 144, 232, 0.6);
}

/* Mobile: kill wrapper padding + section negative margins */
@media (max-width: 768px) {
    [data-theme="dark"] .wrapper {
        padding: 0;
    }
    [data-theme="dark"] .main,
    [data-theme="dark"] .value-banner-section {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    }
    [data-theme="dark"] .footer {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    }
}