/*
 * P1：基于 drone-site 的全局视觉基座。
 * 仅覆盖空间、色彩、容器与公共承载层；不改变现有页面结构或业务交互。
 */

:root {
    --ds-bg: #010205;
    --ds-panel: rgba(10, 14, 24, .70);
    --ds-panel-strong: rgba(13, 18, 30, .86);
    --ds-text: #f7f9ff;
    --ds-muted: rgba(247, 249, 255, .72);
    --ds-cyan: #7ddcff;
    --ds-violet: #a59bff;
    --ds-line: rgba(215, 225, 255, .10);
    --ds-line-strong: rgba(125, 220, 255, .38);
    --ds-radius-card: 1.25rem;
    --ds-radius-pill: 999px;
    --ds-content-width: min(1180px, calc(100% - 36px));
}

html { background: var(--ds-bg); }

body.customer-fidelity {
  background: var(--ds-bg) !important;
    color: var(--ds-text);
}

body.customer-fidelity::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(rgba(1, 2, 5, .38), rgba(1, 2, 5, .56)),
        radial-gradient(circle at 12% 18%, rgba(125, 220, 255, .10), transparent 24rem),
        radial-gradient(circle at 88% 72%, rgba(165, 155, 255, .08), transparent 28rem),
        url("assets/cosmic-mist-v2.png") center / cover;
    animation: ds-cosmic-drift 18s ease-in-out infinite alternate;
}

@keyframes ds-cosmic-drift {
    0% { background-position: center, 12% 18%, 88% 72%, 48% 42%; transform: scale(1.015); }
    100% { background-position: center, 16% 22%, 84% 68%, 54% 48%; transform: scale(1.05); }
}

body.customer-fidelity > *:not(#starfield-canvas):not(#drone-swarm-canvas) {
    position: relative;
    z-index: 1;
}

body.customer-fidelity #starfield-canvas { opacity: .16; }
body.customer-fidelity #drone-swarm-canvas { z-index: 1000 !important; opacity: .62; }

body.customer-fidelity .max-w-7xl {
    width: var(--ds-content-width);
    max-width: 1180px !important;
}

body.customer-fidelity .max-w-6xl,
body.customer-fidelity .max-w-5xl,
body.customer-fidelity .max-w-4xl,
body.customer-fidelity .max-w-3xl {
    width: min(980px, calc(100% - 36px));
}

body.customer-fidelity .glass-header {
    width: min(1180px, calc(100% - 36px));
    margin-inline: auto;
    min-height: 4rem !important;
    height: 4rem !important;
    padding: 0 !important;
    border: 1px solid rgba(125, 220, 255, .16) !important;
    border-radius: var(--ds-radius-pill);
    background: linear-gradient(135deg, rgba(125, 220, 255, .06), rgba(165, 155, 255, .04)), rgba(5, 8, 16, .56) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.07), 0 18px 48px rgba(0,0,0,.24) !important;
    backdrop-filter: blur(28px) saturate(150%);
    -webkit-backdrop-filter: blur(28px) saturate(150%);
}

/* 导航必须高于首页轮播、粒子与所有内容层。 */
body.customer-fidelity .site-primary-header,
body.customer-fidelity nav.glass-header {
    position: fixed !important;
    right: 0;
    left: 0;
    z-index: 100 !important;
}

/* 首页轮播回到页面顶端，允许顶部导航轻微覆盖。 */
body.customer-fidelity.home-page .carousel-container {
    position: relative;
    top: 0;
    margin-top: 0;
    margin-bottom: 0;
    background: url("assets/cosmic-mist-v2.png") center / cover !important;
    overflow: hidden;
}

body.customer-fidelity.home-page .carousel-container::before {
    content: "";
    position: absolute;
    inset: -4%;
    z-index: 1;
    pointer-events: none;
    background: url("assets/cosmic-mist-v2.png") center / cover;
    filter: brightness(1.35) contrast(1.1) saturate(1.08);
    animation: ds-cosmic-drift 18s ease-in-out infinite alternate;
}

body.customer-fidelity.home-page .home-hero-slide > video,
body.customer-fidelity.home-page .home-hero-slide > img {
    opacity: .22 !important;
}

body.customer-fidelity.home-page .home-hero-shade { z-index: 3 !important; }
body.customer-fidelity.home-page .home-hero-content,
body.customer-fidelity.home-page .home-carousel-arrow,
body.customer-fidelity.home-page #carousel-dots { z-index: 5 !important; }

/* 其余页面的主体与页脚使用半透明承载层，背景始终可透出。 */
body.customer-fidelity > main,
body.customer-fidelity > section,
body.customer-fidelity .site-footer {
    background-color: rgba(4, 8, 16, .46) !important;
}

/* PC 首屏轮播占满整个视口；固定导航仅覆盖在其上方，不挤压内容高度。 */
@media (min-width: 768px) {
    body.customer-fidelity.home-page .carousel-container {
        height: 100vh !important;
        min-height: 100vh !important;
    }
}

body.customer-fidelity .glass-header::before,
body.customer-fidelity .glass-header::after { display: none !important; }

/* 顶部导航只保留外层 glass-header 胶囊。
 * site-desktop-nav 是外层内部的内容布局容器，不能再次绘制面板。 */
body.customer-fidelity .glass-header .site-header-inner,
body.customer-fidelity .glass-header .site-desktop-nav {
    min-height: 4rem !important;
    height: 4rem !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body.customer-fidelity .blue-gradient-text {
    background: linear-gradient(100deg, var(--ds-cyan) 0%, var(--ds-text) 48%, var(--ds-violet) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}

body.customer-fidelity .blue-gradient-bg {
    border: 1px solid rgba(125, 220, 255, .32) !important;
    border-radius: var(--ds-radius-pill) !important;
    background: linear-gradient(135deg, rgba(125, 220, 255, .34), rgba(165, 155, 255, .24)), rgba(14, 21, 38, .78) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.15), 0 12px 30px rgba(0,0,0,.18) !important;
}

body.customer-fidelity .blue-gradient-bg::after { display: none !important; }

body.customer-fidelity .glass-card,
body.customer-fidelity .hover-lift,
body.customer-fidelity .concept-card,
body.customer-fidelity [class*="bg-[var(--bg-card)]"] {
    border-color: var(--ds-line) !important;
    background: linear-gradient(145deg, rgba(18, 28, 46, .58), rgba(7, 11, 20, .60)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.045), 0 16px 42px rgba(0,0,0,.15) !important;
    backdrop-filter: blur(16px);
}

body.customer-fidelity .hover-lift:hover,
body.customer-fidelity .concept-card:hover {
    border-color: var(--ds-line-strong) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.08), 0 20px 48px rgba(0, 0, 0, .26) !important;
    transform: translateY(-4px);
}

body.customer-fidelity section:not(.sticky) {
    /* Retain any existing border width in the box model, but remove the
       cross-module separator paint across all static pages. */
    border-color: transparent !important;
    background-color: transparent !important;
}

body.customer-fidelity input,
body.customer-fidelity textarea,
body.customer-fidelity select {
    border-color: var(--ds-line) !important;
    background: rgba(7, 11, 20, .68) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.035);
}

body.customer-fidelity input:focus,
body.customer-fidelity textarea:focus,
body.customer-fidelity select:focus {
    border-color: rgba(125, 220, 255, .64) !important;
    box-shadow: 0 0 0 3px rgba(125, 220, 255, .13) !important;
}

@media (max-width: 767px) {
    body.customer-fidelity {
        background-attachment: scroll !important;
        background-position: 55% top !important;
    }

    body.customer-fidelity .glass-header {
        width: calc(100% - 24px);
        border-radius: 1.25rem;
    }

    body.customer-fidelity.home-page .carousel-container { top: 0; margin-bottom: 0; }

    body.customer-fidelity .max-w-7xl,
    body.customer-fidelity .max-w-6xl,
    body.customer-fidelity .max-w-5xl,
    body.customer-fidelity .max-w-4xl,
    body.customer-fidelity .max-w-3xl { width: calc(100% - 32px); }

    body.customer-fidelity #drone-swarm-canvas { opacity: .45; }
}

/* P3：首页、关于、商业场景与产品中心的内容节奏。 */
body.customer-fidelity .home-page .carousel-container {
    border-bottom: 1px solid var(--ds-line);
    box-shadow: inset 0 -120px 100px rgba(1, 2, 5, .46);
}

body.customer-fidelity .home-page .home-hero-shade {
    background: linear-gradient(90deg, rgba(2, 4, 10, .84), rgba(2, 4, 10, .38) 48%, rgba(2, 4, 10, .08)) !important;
}

body.customer-fidelity .home-page .home-section,
body.customer-fidelity .about-page section,
body.customer-fidelity .scenarios-page section,
body.customer-fidelity .products-page section {
    position: relative;
    isolation: isolate;
}

body.customer-fidelity .home-page .home-section::before,
body.customer-fidelity .about-page section::before,
body.customer-fidelity .scenarios-page section::before,
body.customer-fidelity .products-page section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: linear-gradient(125deg, rgba(125,220,255,.035), transparent 32%, rgba(165,155,255,.025));
}

body.customer-fidelity .home-page .home-equal-card,
body.customer-fidelity .about-page .concept-card,
body.customer-fidelity .scenarios-page .case-card,
body.customer-fidelity .products-page .product-card {
    border-radius: var(--ds-radius-card) !important;
}

body.customer-fidelity .home-page .home-section-title,
body.customer-fidelity .about-page h2,
body.customer-fidelity .scenarios-page h2,
body.customer-fidelity .products-page h2 {
    text-shadow: 0 12px 34px rgba(0,0,0,.24);
}

body.customer-fidelity .scenarios-page .tab-btn,
body.customer-fidelity .products-page .tab-btn,
body.customer-fidelity .filter-tab {
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-pill) !important;
    background: rgba(7, 12, 22, .56) !important;
    color: rgba(247,249,255,.7) !important;
    backdrop-filter: blur(12px);
}

body.customer-fidelity .scenarios-page .tab-btn.active,
body.customer-fidelity .products-page .tab-btn.active,
body.customer-fidelity .filter-tab.active {
    border-color: rgba(125,220,255,.48) !important;
    background: linear-gradient(135deg, rgba(125,220,255,.17), rgba(165,155,255,.12)) !important;
    color: var(--ds-text) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.08), 0 8px 22px rgba(0,0,0,.16);
}

body.customer-fidelity .products-page .tab-content,
body.customer-fidelity .scenarios-page #cases-grid { gap: clamp(1rem, 1.8vw, 1.5rem); }

@media (max-width: 767px) {
    body.customer-fidelity .home-page .home-hero-shade {
        background: linear-gradient(180deg, rgba(2,4,10,.44), rgba(2,4,10,.82)) !important;
    }

    body.customer-fidelity .scenarios-page .tab-btn,
    body.customer-fidelity .products-page .tab-btn,
    body.customer-fidelity .filter-tab { padding-inline: .9rem !important; }
}

@media (prefers-reduced-motion: reduce) {
    body.customer-fidelity *,
    body.customer-fidelity *::before,
    body.customer-fidelity *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }

    body.customer-fidelity #starfield-canvas,
    body.customer-fidelity #drone-swarm-canvas { display: none; }
}

/* P2：公共外壳与操作组件。 */
body.customer-fidelity .site-primary-header,
body.customer-fidelity header.glass-header,
body.customer-fidelity nav.glass-header {
    top: 18px !important;
    background: linear-gradient(135deg, rgba(125, 220, 255, .07), rgba(165, 155, 255, .04)), rgba(5, 8, 16, .68) !important;
}

body.customer-fidelity .nav-link {
    position: relative;
    color: rgba(247, 249, 255, .70) !important;
    letter-spacing: .045em;
    transition: color .2s ease;
}

body.customer-fidelity .nav-link::before { display: none !important; }
body.customer-fidelity .nav-link::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -.55rem;
    left: 0;
    height: 2px;
    border-radius: var(--ds-radius-pill);
    background: var(--ds-cyan);
    box-shadow: 0 0 12px rgba(125, 220, 255, .52);
    opacity: 0;
    transform: scaleX(.35);
    transition: .2s ease;
}

body.customer-fidelity .nav-link:hover,
body.customer-fidelity .nav-link.active { color: var(--ds-text) !important; }
body.customer-fidelity .nav-link.active::after,
body.customer-fidelity .nav-link:hover::after { opacity: 1; transform: scaleX(1); }

body.customer-fidelity .blue-gradient-bg,
body.customer-fidelity .home-hero-button-primary {
    min-height: 2.75rem;
    padding-inline: 1.25rem;
    border-radius: var(--ds-radius-pill) !important;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

body.customer-fidelity .blue-gradient-bg:hover,
body.customer-fidelity .home-hero-button-primary:hover {
    border-color: rgba(125, 220, 255, .62) !important;
    box-shadow: 0 16px 34px rgba(24, 68, 118, .25) !important;
    transform: translateY(-2px) !important;
}

body.customer-fidelity .home-hero-button-secondary,
body.customer-fidelity a[class*="border-white"] {
    border-color: rgba(215, 225, 255, .18) !important;
    background: rgba(7, 11, 20, .46) !important;
    backdrop-filter: blur(14px);
}

body.customer-fidelity footer {
    border-top: 1px solid var(--ds-line) !important;
    background: linear-gradient(180deg, rgba(3, 6, 12, .24), rgba(3, 6, 12, .72)) !important;
}

/* 页脚保持玻璃透感，使动态星云可以作为连续背景透出。 */
body.customer-fidelity .site-footer {
    background: linear-gradient(180deg, rgba(3, 6, 12, .34), rgba(3, 6, 12, .54)) !important;
}

/* 订阅按钮固定在输入框内，悬停仅改变光效，不产生位移。 */
body.customer-fidelity .site-newsletter .site-subscribe-button:hover,
body.customer-fidelity .site-newsletter .site-subscribe-button:focus-visible {
    transform: translateY(-50%) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.20), 0 0 20px rgba(125,220,255,.25) !important;
}

body.customer-fidelity footer .max-w-7xl { padding-top: clamp(3.5rem, 6vw, 5rem); }

body.customer-fidelity .site-float-controls,
body.customer-fidelity .fixed[class*="bottom"]:not(#mobile-menu) {
    gap: .75rem !important;
}

body.customer-fidelity .site-float-controls > button,
body.customer-fidelity .site-float-controls #customer-btn-container > button {
    border: 1px solid rgba(125, 220, 255, .20) !important;
    background: rgba(7, 12, 22, .76) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.08), 0 12px 28px rgba(0,0,0,.25) !important;
    backdrop-filter: blur(16px);
}

body.customer-fidelity .site-float-controls > button:hover,
body.customer-fidelity .site-float-controls #customer-btn-container > button:hover {
    border-color: var(--ds-line-strong) !important;
    transform: translateY(-2px);
}

/* 页面标识位于 body，自身选择器需使用复合 class。 */
body.customer-fidelity.scenarios-page .tab-btn,
body.customer-fidelity.products-page .tab-btn,
body.customer-fidelity .filter-tab {
    border: 1px solid var(--ds-line) !important;
    border-radius: var(--ds-radius-pill) !important;
    background: rgba(7, 12, 22, .56) !important;
    color: rgba(247,249,255,.7) !important;
}
body.customer-fidelity.scenarios-page .tab-btn.active,
body.customer-fidelity.products-page .tab-btn.active,
body.customer-fidelity .filter-tab.active {
    border-color: rgba(125,220,255,.48) !important;
    background: linear-gradient(135deg, rgba(125,220,255,.17), rgba(165,155,255,.12)) !important;
    color: var(--ds-text) !important;
}

/* P4：套餐、预约、机巢与新闻业务页。 */
body.customer-fidelity.performance-order-page .glass-card,
body.customer-fidelity.booking-page .glass-card,
body.customer-fidelity.nest-detail-page .glass-card,
body.customer-fidelity.news-page .news-card,
body.customer-fidelity.news-detail-page .article-content {
    border-color: var(--ds-line) !important;
    background: linear-gradient(145deg, rgba(16,26,44,.80), rgba(6,10,19,.82)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.05), 0 18px 46px rgba(0,0,0,.18) !important;
    backdrop-filter: blur(16px);
}

body.customer-fidelity.performance-order-page [class*="sticky"],
body.customer-fidelity.booking-page .method-card.active {
    border-color: rgba(125,220,255,.46) !important;
    background: linear-gradient(135deg, rgba(125,220,255,.16), rgba(165,155,255,.11)), rgba(8,14,26,.82) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.20), inset 0 1px rgba(255,255,255,.08) !important;
}

body.customer-fidelity.performance-order-page input,
body.customer-fidelity.performance-order-page select,
body.customer-fidelity.booking-page input,
body.customer-fidelity.booking-page select,
body.customer-fidelity.booking-page textarea {
    border-radius: .75rem !important;
    color: var(--ds-text) !important;
}

body.customer-fidelity.nest-detail-page .tab-btn.active,
body.customer-fidelity.news-page .filter-tab.active {
    border-color: rgba(125,220,255,.48) !important;
    background: linear-gradient(135deg, rgba(125,220,255,.17), rgba(165,155,255,.12)) !important;
}

body.customer-fidelity.nest-detail-page table {
    overflow: hidden;
    border: 1px solid var(--ds-line);
    border-radius: var(--ds-radius-card);
    background: rgba(5,9,17,.46);
}

body.customer-fidelity.news-detail-page main,
body.customer-fidelity.news-detail-page article {
    max-width: min(860px, calc(100% - 36px));
    margin-inline: auto;
}

body.customer-fidelity.news-page .news-card:hover { border-color: var(--ds-line-strong) !important; }

@media (max-width: 767px) {
    body.customer-fidelity.performance-order-page [class*="sticky"] { position: static !important; }
    body.customer-fidelity.news-detail-page main,
    body.customer-fidelity.news-detail-page article { max-width: calc(100% - 32px); }
}

@media (max-width: 767px) {
    body.customer-fidelity .site-primary-header,
    body.customer-fidelity header.glass-header,
    body.customer-fidelity nav.glass-header { top: 12px !important; }

    body.customer-fidelity #mobile-menu {
        border: 1px solid rgba(125, 220, 255, .14) !important;
        background: rgba(4, 8, 16, .94) !important;
        backdrop-filter: blur(24px);
    }

    body.customer-fidelity #mobile-menu .nav-link,
    body.customer-fidelity #mobile-menu a { color: var(--ds-text) !important; }
}

/* Keep the client-reference cosmic layer visible through every content page. */
body.customer-fidelity:not(.home-page) section {
    background: linear-gradient(145deg, rgba(8, 18, 34, .48), rgba(3, 9, 19, .42)) !important;
}

body.customer-fidelity:not(.home-page) main {
    background: rgba(3, 8, 17, .30) !important;
}

/* 轮播与首屏媒体保持原始清晰度：动态背景仅作用于页面底层，不覆盖在图片/视频上。 */
body.customer-fidelity.home-page .carousel-container::before {
    display: none !important;
}

body.customer-fidelity.home-page .home-hero-slide > video,
body.customer-fidelity.home-page .home-hero-slide > img {
    opacity: 1 !important;
    filter: none !important;
}

body.customer-fidelity.home-page .home-hero-shade,
body.customer-fidelity.scenarios-page .scenarios-hero-shade {
    background: transparent !important;
}

body.customer-fidelity .home-hero-copy,
body.customer-fidelity .scenarios-hero-content {
    text-shadow: 0 2px 16px rgba(0, 0, 0, .55);
}

/* 新 Logo 是独立图形标识，不再裁切或遮挡其下部。 */
body.customer-fidelity nav.glass-header .w-10.h-10.relative {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;
    overflow: visible !important;
}

body.customer-fidelity nav.glass-header .w-10.h-10.relative > img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

body.customer-fidelity nav.glass-header a.flex.items-center.gap-3.group > .flex.flex-col > span:last-child {
    display: none !important;
}

/* 无轨迹首屏主视觉：以极缓慢的镜头推进替代原视频的彩带动画。 */
body.customer-fidelity.home-page .home-hero-clean-media {
    animation: ds-hero-clean-drift 16s ease-in-out infinite alternate;
    transform-origin: center center;
}

@keyframes ds-hero-clean-drift {
    from { transform: scale(1.015) translate3d(0, 0, 0); }
    to { transform: scale(1.07) translate3d(-1.1%, -.6%, 0); }
}
