/* Logo 立体金光：保留金属立体感，无外描边/外投影 */
.hl-logo.hl-logo-shine {
    position: relative;
    display: block;
    isolation: isolate;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left center;
}

/* 立体金属：内部明暗 + 多层金色渐变（不贴边描边） */
.hl-logo.hl-logo-shine::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image:
        radial-gradient(ellipse 80% 70% at 30% 25%, rgba(255, 248, 220, 0.5) 0%, transparent 58%),
        radial-gradient(ellipse 75% 65% at 72% 78%, rgba(45, 25, 0, 0.28) 0%, transparent 55%),
        linear-gradient(
            118deg,
            #3d2600 0%,
            #7a4e00 10%,
            #c88a00 24%,
            #ffe082 40%,
            #fff8e1 48%,
            #ffca28 56%,
            #b8860b 72%,
            #6b4300 88%,
            #2e1c00 100%
        );
    background-size: 100% 100%, 100% 100%, 240% 100%;
    background-position: 0 0, 0 0, 0 0;
    animation: hlLogoGoldBase 6s ease-in-out infinite alternate;
    pointer-events: none;
    -webkit-mask-image: var(--logo-url);
    mask-image: var(--logo-url);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mix-blend-mode: overlay;
}

/* 擦金高光 */
.hl-logo.hl-logo-shine::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        105deg,
        transparent 30%,
        rgba(255, 240, 170, 0.35) 42%,
        rgba(255, 255, 250, 0.9) 50%,
        rgba(255, 240, 170, 0.35) 58%,
        transparent 70%
    );
    background-size: 280% 100%;
    background-repeat: no-repeat;
    animation: hlLogoGoldShine 3.8s ease-in-out infinite;
    pointer-events: none;
    -webkit-mask-image: var(--logo-url);
    mask-image: var(--logo-url);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mix-blend-mode: soft-light;
}

@keyframes hlLogoGoldBase {
    0% { background-position: 0 0, 0 0, 0% 0; }
    100% { background-position: 0 0, 0 0, 100% 0; }
}

@keyframes hlLogoGoldShine {
    0%, 18% {
        background-position: 135% 0;
        opacity: 0;
    }
    26% { opacity: 1; }
    50% {
        background-position: -35% 0;
        opacity: 1;
    }
    62%, 100% {
        background-position: -35% 0;
        opacity: 0;
    }
}

/* Logo 尺寸：H5 默认沿用主题 90×24，PC 按 800×293 比例缩放 */
.conch-header .conch-headwrap .conch-logo .hl-logo.hl-logo-shine {
    width: 90px !important;
    height: 24px !important;
    max-width: none;
    flex-shrink: 0;
}

.hl-site-logo .hl-logo.hl-logo-shine {
    width: auto;
    height: 56px;
    aspect-ratio: 800 / 293;
}

.conch-header .conch-headwrap .conch-logo .hl-logo,
.conch-header .conch-headwrap .conch-logo .hl-logo.hl-logo-shine {
    display: block;
    background-color: transparent !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
}

/* H5：Logo 放大 + 布局配合 flex 顶栏 */
@media (max-width: 767px) {
    .conch-header .conch-headwrap .conch-logo .hl-logo.hl-logo-shine {
        --hl-logo-h: 40px;
        width: calc(var(--hl-logo-h) * 800 / 293) !important;
        height: var(--hl-logo-h) !important;
    }

    .conch-header .conch-menus .conch-logo .hl-logo.hl-logo-shine {
        --hl-logo-h: 40px;
        width: calc(var(--hl-logo-h) * 800 / 293);
        height: var(--hl-logo-h);
    }

    .conch-header .conch-headwrap .conch-logo {
        float: none !important;
        margin: 10px 0 !important;
        padding: 4px 0 4px 15px !important;
    }

    /* 从 PC 缩回 H5 时，取消自适应隐藏 */
    .conch-header .conch-headwrap .conch-nav .hl-nav-item {
        display: block !important;
    }

    .conch-header .conch-headwrap .conch-nav .hl-nav-item:first-child {
        padding-left: 15px !important;
    }
}

/* PC 顶栏：Logo 左对齐、尺寸与菜单字号 */
@media (min-width: 768px) {
    .conch-header .conch-headwrap .conch-logo .hl-logo.hl-logo-shine {
        --hl-logo-h: 48px;
        width: calc(var(--hl-logo-h) * 800 / 293) !important;
        height: var(--hl-logo-h) !important;
    }

    .conch-header .conch-headwrap .conch-logo {
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .conch-header .conch-headwrap .conch-nav {
        font-size: 17px;
        line-height: 32px;
    }

    .conch-header .conch-headwrap .conch-nav .hl-nav-item a.active {
        font-size: 21px;
    }
}

@media (min-width: 1200px) {
    .conch-header .conch-headwrap .conch-logo .hl-logo.hl-logo-shine {
        --hl-logo-h: 54px;
        width: calc(var(--hl-logo-h) * 800 / 293) !important;
        height: var(--hl-logo-h) !important;
    }
}


/* 侧边菜单 Logo 保持主题默认尺寸，避免撑破菜单头部 */
.conch-header .conch-menus .conch-logo {
    margin: 0;
    padding: 4px 0;
}

.conch-header .conch-menus .conch-logo .hl-logo.hl-logo-shine {
    width: 90px;
    height: 24px;
}

@media (min-width: 768px) {
    .conch-header .conch-menus .conch-logo .hl-logo.hl-logo-shine {
        width: 112px;
        height: 30px;
    }
}
