/* JSNET_PUBLIC_FRONTEND_CLEANUP_V2 */
:root {
    --jsnet-clean-ink: #07172d;
    --jsnet-clean-muted: #52657f;
    --jsnet-clean-blue: #1767e6;
    --jsnet-clean-line: #dfe7f2;
    --jsnet-clean-soft: #f6f9fe;
}

.jsnet-public-header {
    background: rgba(255,255,255,.92) !important;
    backdrop-filter: blur(18px);
    border-bottom: 1px solid var(--jsnet-clean-line) !important;
    color: var(--jsnet-clean-ink) !important;
    z-index: 90;
}
.jsnet-public-header .site-logo img {
    max-height: 36px;
    width: auto;
    object-fit: contain;
}
.jsnet-public-nav {
    gap: 20px;
}
.jsnet-public-nav a {
    color: #2f3f55 !important;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}
.jsnet-public-nav a:hover {
    color: var(--jsnet-clean-blue) !important;
}
.jsnet-public-actions {
    gap: 12px;
}
.jsnet-public-page .site-header,
.seo-product-page .site-header,
.kn-body .site-header {
    min-height: 72px;
}

.jsnet-clean-hero,
.kn-hero.jsnet-clean-hero,
.seo-hero-light.jsnet-seo-clean-hero {
    background:
        radial-gradient(circle at 78% 12%, rgba(33,105,232,.12), transparent 34%),
        radial-gradient(circle at 14% 22%, rgba(22,191,135,.10), transparent 30%),
        linear-gradient(180deg, #f7fbff, #ffffff) !important;
}
.jsnet-clean-art,
.kn-art.jsnet-clean-art,
.seo-hero-visual.jsnet-clean-art {
    background: #fff;
    border: 1px solid var(--jsnet-clean-line);
    overflow: visible;
}
.jsnet-clean-art img,
.kn-art.jsnet-clean-art img,
.kn-art-large.jsnet-clean-art img,
.seo-hero-visual.jsnet-clean-art img {
    width: 100%;
    height: auto !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block;
    border-radius: 22px;
}

.jsnet-generated-home .kn-kicker,
.jsnet-public-page .kn-kicker {
    background: #eaf3ff;
    border-color: #cfe0fb;
    color: #1767e6;
}
.jsnet-home-visual-grid .kn-home-card img {
    height: auto !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    padding: 10px;
    background: linear-gradient(180deg, #f8fbff, #ffffff);
}
.jsnet-home-visual-grid .kn-home-card.large img {
    height: auto !important;
}
.jsnet-home-visual-grid .kn-home-card {
    background: #fff;
}
.jsnet-home-visual-grid .kn-home-card div {
    border-top: 1px solid #edf3fb;
}

.jsnet-news-card-grid .kn-card.with-image > img,
.jsnet-generated-tour-grid .kn-shot img,
.jsnet-generated-gallery img,
.jsnet-article-image img,
.kn-mini-gallery.jsnet-generated-gallery img {
    width: 100%;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    padding: 8px;
    background: linear-gradient(180deg, #f8fbff, #ffffff);
    border: 1px solid #dfe7f2;
}
.jsnet-clean-article h2 {
    margin-top: 28px;
    font-size: 30px;
    letter-spacing: -.02em;
}
.jsnet-video-box .kn-video {
    background: #f8fbff;
}

.seo-product-page {
    background: #fff !important;
    color: var(--jsnet-clean-ink);
}
.jsnet-seo-clean-hero .seo-hero-inner {
    width: min(1180px, calc(100% - 40px));
    min-height: 620px;
}
.jsnet-seo-clean-hero .seo-hero-visual::before {
    background: linear-gradient(135deg, rgba(33,105,232,.12), rgba(22,191,135,.12));
}
.seo-platform-grid a,
.seo-comparison-grid a,
.seo-use-grid a,
.feature-card,
.kn-card,
.kn-shot,
.kn-video-box,
.kn-article-card {
    border-color: #dfe7f2 !important;
}
.seo-support-light {
    background:
        radial-gradient(circle at 80% 20%, rgba(33,105,232,.15), transparent 34%),
        linear-gradient(135deg, #07172d, #0f3457) !important;
}

body .kn-card.with-image img[src*="real-"],
body img[src*="real-device"],
body img[src*="real-schedules"],
body img[src*="real-playlists"] {
    display: none !important;
}

@media (max-width: 1180px) {
    .jsnet-public-nav {
        gap: 12px;
    }
    .jsnet-public-nav a {
        font-size: 14px;
    }
}
@media (max-width: 980px) {
    .jsnet-public-header {
        flex-wrap: wrap;
        gap: 14px;
        padding-top: 12px;
        padding-bottom: 12px;
    }
    .jsnet-public-nav {
        order: 3;
        width: 100%;
        justify-content: center;
        overflow-x: auto;
        padding-bottom: 4px;
    }
    .jsnet-public-actions {
        margin-left: auto;
    }
    .jsnet-seo-clean-hero .seo-hero-inner {
        min-height: auto;
    }
}
@media (max-width: 720px) {
    .jsnet-public-header .site-logo img {
        max-height: 30px;
    }
    .jsnet-public-actions .currency-dropdown,
    .jsnet-public-actions .btn-primary {
        display: none;
    }
    .jsnet-public-nav {
        justify-content: flex-start;
    }
}
