:root {
    --bg: #F8FAFC;
    --surface: #FFFFFF;
    --surface-alt: #F1F5F9;
    --text: #0F172A;
    --text-muted: #64748B;
    --border: #E2E8F0;
    --primary: #0F172A;
    --primary-hover: #E63946;
    --on-primary: #FFFFFF;
    --primary-text: #0F172A;
    --accent: #E63946;
    --on-accent: #FFFFFF;
    --accent-text: #E63946;
    --dark-band: #0F172A;
    --on-dark: #FFFFFF;
    --on-dark-muted: #E2E8F0;
}

* {
    box-sizing: border-box;
}

.pw-body {
    font-family: 'Orbit', sans-serif;
    background-color: var(--bg);
    color: var(--text);
    margin: 0;
    padding: 0;
    line-height: 1.5;
    letter-spacing: 0.01em;
    -webkit-font-smoothing: antialiased;
}

.text-muted {
    color: #64748B !important;
}

.pw-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 24px;
    font-family: 'Orbit', sans-serif;
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 9999px;
    background-color: var(--primary);
    color: var(--on-primary);
    border: 1px solid var(--primary);
    text-decoration: none;
    cursor: pointer;
}

.pw-btn:hover {
    background-color: var(--primary-hover);
    color: var(--on-primary);
    border-color: var(--primary-hover);
}

.pw-btn-alt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 20px;
    font-family: 'Orbit', sans-serif;
    font-size: 13px;
    font-weight: 400;
    border-radius: 9999px;
    background-color: var(--surface-alt);
    color: var(--primary-text);
    border: 1px solid var(--border);
    text-decoration: none;
    cursor: pointer;
}

.pw-btn-alt:hover {
    background-color: var(--border);
    color: var(--primary-text);
    border-color: var(--text-muted);
}

.pw-card {
    background-color: var(--surface);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    position: relative;
}

.pw-card:hover {
    border-color: var(--accent);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.pw-media {
    aspect-ratio: 16 / 9;
    border-radius: 8px;
    border: 1px solid var(--border);
    overflow: hidden;
    flex-shrink: 0;
}

.pw-media img,
.pw-media video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pw-eyebrow {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--accent-text);
    margin-bottom: 6px;
}

.pw-title {
    font-family: 'Orbit', sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: 0.02em;
    color: var(--text);
    margin: 0;
}

.pw-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    font-size: 11px;
    border-radius: 9999px;
    background-color: var(--surface-alt);
    color: var(--text);
    border: 1px solid var(--border);
    letter-spacing: 0.05em;
    text-decoration: none;
}

.pw-badge:hover {
    background-color: var(--primary);
    color: var(--on-primary);
    border-color: var(--primary);
}

.pw-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--surface-alt);
    color: var(--primary-text);
    border: 1px solid var(--border);
}

.pw-section {
    padding: 48px 0;
    background-color: var(--bg);
}

.pw-section-alt {
    padding: 48px 0;
    background-color: var(--surface-alt);
}

.pw-section-dark {
    padding: 48px 0;
    background-color: var(--dark-band);
    color: var(--on-dark);
}

.pw-section-brand {
    padding: 48px 0;
    background-color: var(--primary);
    color: var(--on-primary);
}

.pw-section-brand .pw-btn {
    background-color: var(--surface);
    color: var(--primary);
    border-color: var(--surface);
}

.pw-section-brand .pw-btn:hover {
    background-color: var(--accent);
    color: var(--on-accent);
    border-color: var(--accent);
}

.pw-section-brand .pw-btn-alt {
    background-color: transparent;
    color: var(--on-primary);
    border-color: var(--on-primary);
}

.pw-section-brand .pw-btn-alt:hover {
    background-color: var(--on-primary);
    color: var(--primary);
}

.pw-section-dark .pw-title,
.pw-section-dark .pw-eyebrow,
.pw-on-dark .pw-title,
.pw-on-dark .pw-eyebrow {
    color: var(--on-dark);
}

.pw-section-dark .text-muted,
.pw-on-dark .text-muted {
    color: var(--on-dark-muted) !important;
}

.pw-section-dark .pw-btn-alt,
.pw-on-dark .pw-btn-alt {
    background-color: transparent;
    color: var(--on-dark);
    border-color: var(--on-dark-muted);
}

.pw-section-dark .pw-card,
.pw-on-dark .pw-card {
    background-color: var(--surface);
    color: var(--text);
    border-color: var(--border);
}

.pw-section-dark .pw-card .pw-title,
.pw-on-dark .pw-card .pw-title {
    color: var(--text);
}

.pw-section-dark .pw-card .text-muted,
.pw-on-dark .pw-card .text-muted {
    color: #64748B !important;
}

@media (max-width: 768px) {

    .pw-section,
    .pw-section-alt,
    .pw-section-dark,
    .pw-section-brand {
        padding: 32px 0;
    }

    .pw-title {
        font-size: 20px;
    }
}

/* ===== header ===== */
.wx-header {
    background-color: #FFFFFF;
    border-color: var(--border, #E2E8F0) !important;
    position: sticky;
    top: 0;
    z-index: 1030;
    width: 100%;
}

.wx-header .wx-navbar {
    background-color: #FFFFFF;
    padding-top: 14px;
    padding-bottom: 14px;
}

.wx-header .wx-brand-logo {
    max-width: 44px;
    max-height: 44px;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.wx-header .wx-brand-name {
    font-family: 'Orbit', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: 0.02em;
}

.wx-header .wx-toggler {
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    padding: 6px 10px;
    background-color: #F8FAFC;
    box-shadow: none;
}

.wx-header .wx-toggler:focus {
    box-shadow: none;
    outline: 2px solid #0F172A;
}

.wx-header .wx-toggler-icon {
    font-size: 22px;
    color: #0F172A;
    display: inline-block;
    vertical-align: middle;
}

.wx-header .wx-nav-link {
    font-family: 'Orbit', sans-serif;
    font-size: 14px;
    color: #334155;
    padding: 8px 16px !important;
    border-radius: 9999px;
    font-weight: 500;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.wx-header .wx-nav-link:hover,
.wx-header .wx-nav-link:focus {
    color: #E63946;
    background-color: #F1F5F9;
}

.wx-header .wx-nav-link.active {
    color: #0F172A;
    font-weight: 700;
    background-color: #F1F5F9;
}

@media (max-width: 991.98px) {
    .wx-header #wxNavbarCollapse {
        background-color: #FFFFFF;
        border-top: 1px solid #E2E8F0;
        margin-top: 12px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .wx-header .wx-nav-link {
        padding: 10px 14px !important;
        margin-bottom: 4px;
        border-radius: 8px;
    }
}

/* ===== hero ===== */
.hero-wexorin {
    min-height: 580px;
    display: flex;
    align-items: center;
    background-color: var(--dark-band, #0F172A);
}

.hero-wexorin__video-wrap {
    z-index: 1;
    pointer-events: none;
}

.hero-wexorin__video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-wexorin__overlay {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.78) 0%, rgba(15, 23, 42, 0.88) 60%, rgba(15, 23, 42, 0.96) 100%);
}

.hero-wexorin .container {
    z-index: 2;
}

.hero-wexorin__badge {
    background: rgba(255, 255, 255, 0.12);
    color: var(--on-dark, #FFFFFF);
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 13px;
}

.hero-wexorin__title {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--on-dark, #FFFFFF);
    overflow-wrap: anywhere;
    hyphens: auto;
}

.hero-wexorin__lead {
    font-size: clamp(14px, 1.8vw, 17px);
    line-height: 1.6;
    max-width: 740px;
    color: var(--on-dark-muted, #CBD5E1);
    overflow-wrap: anywhere;
}

.hero-wexorin__btn {
    background-color: var(--primary, #E63946);
    color: var(--on-primary, #FFFFFF);
    border: 1px solid var(--primary, #E63946);
    padding: 12px 28px;
    border-radius: 9999px;
    font-size: 14px;
    text-decoration: none;
}

.hero-wexorin__btn:hover {
    background-color: var(--primary-hover, #D62839);
    border-color: var(--primary-hover, #D62839);
    color: #FFFFFF;
}

.hero-wexorin__btn-alt {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--on-dark, #FFFFFF);
    border: 1px solid rgba(255, 255, 255, 0.25);
    padding: 12px 28px;
    border-radius: 9999px;
    font-size: 14px;
    text-decoration: none;
}

.hero-wexorin__btn-alt:hover {
    background-color: rgba(255, 255, 255, 0.18);
    color: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.4);
}

.hero-wexorin__highlights {
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.hero-wexorin__highlight-card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    height: 100%;
}

.hero-wexorin__icon {
    color: #FFFFFF;
    font-size: 18px;
}

.hero-wexorin__highlight-title {
    font-size: 14px;
    color: var(--on-dark, #FFFFFF);
}

.hero-wexorin__highlight-desc {
    font-size: 12px;
    line-height: 1.5;
    color: var(--on-dark-muted, #94A3B8);
}

@media (max-width: 767.98px) {
    .hero-wexorin {
        min-height: auto;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .hero-wexorin__title {
        font-size: 18px;
    }

    .hero-wexorin__lead {
        font-size: 13px;
    }

    .hero-wexorin__btn,
    .hero-wexorin__btn-alt {
        width: 100%;
        justify-content: center;
    }
}

/* ===== most-read-today ===== */
.most-read-section {
    background: var(--bg);
    position: relative
}

.most-read-section .most-read-badge {
    background: var(--primary);
    color: var(--on-primary);
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 9999px
}

.most-read-section .most-read-count {
    color: var(--text-muted);
    font-size: 13px;
    font-weight: 700
}

.most-read-section .most-read-indicator {
    color: var(--accent-text);
    font-size: 12px;
    font-weight: 700
}

.most-read-section .most-read-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-left: 4px solid var(--primary);
    border-radius: 10px;
    transition: none;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05)
}

.most-read-section .most-read-card:hover {
    border-color: var(--accent);
    border-left-color: var(--accent);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08)
}

.most-read-section .rank-badge-wrapper {
    display: flex;
    align-items: flex-start
}

.most-read-section .rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1
}

.most-read-section .rank-first {
    background: var(--accent);
    color: var(--on-accent)
}

.most-read-section .rank-second {
    background: var(--primary);
    color: var(--on-primary)
}

.most-read-section .card-thumb-wrap {
    width: 120px;
    height: 90px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--surface-alt)
}

.most-read-section .card-thumb-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

.most-read-section .topic-pill-guide {
    background: #8B5CF6;
    color: #FFFFFF;
    font-size: 10px;
    padding: 2px 8px;
    border-radius: 9999px
}

.most-read-section .topic-pill-news {
    background: #0EA5E9;
    color: #FFFFFF;
    font-size: 10px;
    padding: 2px 8px;
    border-radius: 9999px
}

.most-read-section .meta-date {
    font-size: 12px;
    color: var(--text-muted)
}

.most-read-section .card-article-title {
    font-size: 15px;
    line-height: 1.4;
    word-break: keep-all;
    overflow-wrap: anywhere
}

.most-read-section .stretched-link-title {
    color: var(--text);
    text-decoration: none
}

.most-read-section .stretched-link-title:hover {
    color: var(--primary-text)
}

.most-read-section .meta-author {
    font-size: 12px;
    color: var(--text-muted)
}

.most-read-section .meta-stat {
    font-size: 12px;
    color: var(--primary-text);
    font-weight: 700
}

@media (max-width:767px) {
    .most-read-section .most-read-card {
        flex-direction: column
    }

    .most-read-section .card-thumb-wrap {
        width: 100%;
        height: 160px
    }

    .most-read-section .rank-badge-wrapper {
        position: absolute;
        top: 12px;
        left: 12px;
        z-index: 2
    }
}

/* ===== latest-feed ===== */
.latest-feed-section .latest-feed-header {
    border-color: #E2E8F0 !important;
}

.latest-feed-section .latest-feed-count {
    font-size: 14px;
    color: #64748B;
}

.latest-feed-section .feed-filter-btn {
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    color: #475569;
    border-radius: 9999px;
    padding: 6px 14px;
    font-size: 12px;
    font-family: 'Orbit', sans-serif;
    cursor: pointer;
}

.latest-feed-section .feed-filter-btn:hover,
.latest-feed-section .feed-filter-btn.active {
    background: #0F172A;
    color: #FFFFFF;
    border-color: #0F172A;
}

.latest-feed-section .feed-card {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}

.latest-feed-section .feed-card:hover {
    border-color: #E63946;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.latest-feed-section .feed-stripe {
    width: 4px;
    flex-shrink: 0;
}

.latest-feed-section .feed-stripe-reviews {
    background-color: #8B5CF6;
}

.latest-feed-section .feed-stripe-guides {
    background-color: #0EA5E9;
}

.latest-feed-section .feed-media-link {
    display: block;
    flex-shrink: 0;
    width: 100%;
    max-width: 220px;
    height: 180px;
}

.latest-feed-section .feed-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.latest-feed-section .feed-topic-pill {
    border-radius: 9999px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.2;
}

.latest-feed-section .topic-reviews {
    background: rgba(139, 92, 246, 0.12);
    color: #8B5CF6;
}

.latest-feed-section .topic-guides {
    background: rgba(14, 165, 233, 0.12);
    color: #0284C7;
}

.latest-feed-section .feed-time-stamp {
    font-size: 11px;
    color: #64748B;
}

.latest-feed-section .feed-title-link {
    color: #0F172A;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.latest-feed-section .feed-title-link:hover {
    color: #E63946;
}

.latest-feed-section .feed-meta-info {
    font-size: 12px;
    color: #64748B;
}

.latest-feed-section .feed-read-btn {
    display: inline-block;
    text-decoration: none;
    font-size: 13px;
    padding: 8px 18px;
}

@media (max-width: 767px) {
    .latest-feed-section .feed-media-link {
        max-width: 100%;
        height: 200px;
    }

    .latest-feed-section .feed-stripe {
        width: 100%;
        height: 4px;
    }
}

/* ===== stories-and-tags ===== */
.stories-tags-block {
    overflow-x: hidden;
}

.stories-tags-block .story-card {
    background-color: var(--surface, #FFFFFF);
    border: 1px solid var(--border, #E2E8F0);
    border-radius: 10px;
    position: relative;
}

.stories-tags-block .story-step-badge {
    background-color: var(--primary, #0F172A);
    color: var(--on-primary, #FFFFFF);
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 9999px;
    font-weight: 500;
    letter-spacing: 0.03em;
}

.stories-tags-block .story-thumbnail {
    height: 180px;
    object-fit: cover;
    border-radius: 8px;
}

.stories-tags-block .story-title a {
    color: var(--text, #0F172A);
    overflow-wrap: anywhere;
}

.stories-tags-block .story-title a:hover {
    color: var(--primary-hover, #E63946);
}

.stories-tags-block .story-desc {
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.stories-tags-block .story-read-btn {
    padding: 6px 16px;
    font-size: 12px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: normal;
}

@media (max-width: 767px) {
    .stories-tags-block .story-thumbnail {
        height: 160px;
    }

    .stories-tags-block .story-title {
        font-size: 15px;
    }
}

/* ===== topic-of-the-day ===== */
.topic-of-day-section {
    padding-top: 48px;
    padding-bottom: 48px;
    position: relative;
}

.topic-stream-header {
    border-bottom: 1px solid #E2E8F0;
}

.topic-stream-tag {
    font-family: 'Orbit', sans-serif;
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 9999px;
    background-color: #0F172A;
    color: #FFFFFF;
    border: 1px solid #0F172A;
}

.topic-stream-heading {
    font-family: 'Orbit', sans-serif;
    font-size: 24px;
    color: #0F172A;
    letter-spacing: 0.02em;
    font-weight: 400;
}

.topic-stream-counter {
    font-size: 14px;
    color: #64748B;
    font-weight: 400;
}

.topic-stream-indicator {
    font-size: 13px;
    color: #64748B;
}

.topic-spotlight-card {
    position: relative;
    background-color: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    overflow: hidden;
}

.topic-spotlight-decor {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 4px;
    background-color: #E63946;
    border-radius: 4px 0 0 4px;
    z-index: 2;
}

.topic-spotlight-media {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    max-height: 380px;
    overflow: hidden;
    background-color: #F1F5F9;
}

.topic-spotlight-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
}

.topic-spotlight-body {
    overflow-wrap: anywhere;
}

.topic-badge-category {
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 9999px;
    background-color: #F1F5F9;
    color: #0F172A;
    border: 1px solid #E2E8F0;
}

.topic-badge-secondary {
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 9999px;
    background-color: #F1F5F9;
    color: #0F172A;
    border: 1px solid #E2E8F0;
}

.topic-meta-item {
    font-size: 12px;
    color: #64748B;
}

.topic-spotlight-title {
    font-family: 'Orbit', sans-serif;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 400;
    color: #0F172A;
}

.topic-title-link {
    color: #0F172A;
    text-decoration: none;
}

.topic-title-link:hover {
    color: #E63946;
    text-decoration: none;
}

.topic-spotlight-desc {
    font-size: 14px;
    line-height: 1.6;
    color: #64748B;
}

.topic-tab-btn {
    font-family: 'Orbit', sans-serif;
    font-size: 12px;
    padding: 6px 14px;
    border-radius: 9999px;
    background-color: #F1F5F9;
    color: #475569;
    border: 1px solid #E2E8F0;
    cursor: pointer;
}

.topic-tab-btn.active {
    background-color: #0F172A;
    color: #FFFFFF;
    border-color: #0F172A;
}

.topic-tab-btn:hover:not(.active) {
    background-color: #E2E8F0;
    color: #0F172A;
}

.topic-feature-list {
    list-style: none;
}

.topic-feature-list span {
    font-size: 13px;
    line-height: 1.5;
    color: #475569;
}

.topic-icon-accent {
    color: #E63946;
    font-size: 16px;
    flex-shrink: 0;
}

.topic-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Orbit', sans-serif;
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 10px 24px;
    border-radius: 9999px;
    background-color: #0F172A;
    color: #FFFFFF;
    border: 1px solid #0F172A;
    text-decoration: none;
}

.topic-action-btn:hover {
    background-color: #E63946;
    color: #FFFFFF;
    border-color: #E63946;
    text-decoration: none;
}

.topic-related-card {
    position: relative;
    background-color: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
    overflow: hidden;
}

.topic-related-decor {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 4px;
    background-color: #0EA5E9;
    border-radius: 4px 0 0 4px;
    z-index: 2;
}

.topic-related-media {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background-color: #F1F5F9;
}

.topic-related-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.topic-related-body {
    overflow-wrap: anywhere;
}

.topic-related-title {
    font-family: 'Orbit', sans-serif;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 400;
    color: #0F172A;
}

.topic-related-desc {
    font-size: 13px;
    line-height: 1.5;
    color: #64748B;
}

.topic-brief-box {
    background-color: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 10px;
}

.topic-box-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background-color: #F1F5F9;
    color: #E63946;
    font-size: 15px;
}

.topic-brief-title {
    font-family: 'Orbit', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #0F172A;
}

.topic-brief-text {
    font-size: 12px;
    line-height: 1.5;
    color: #64748B;
}

@media (max-width: 767px) {
    .topic-stream-heading {
        font-size: 16px;
    }

    .topic-spotlight-title {
        font-size: 14px;
    }

    .topic-related-title {
        font-size: 14px;
    }

    .topic-spotlight-card,
    .topic-related-card {
        flex-direction: column;
    }

    .topic-spotlight-media,
    .topic-related-media {
        aspect-ratio: 16 / 9;
        max-height: none;
    }
}

/* ===== categories-grid ===== */
.categories-hub-block {
    padding: 48px 0;
}

.categories-hub-block__header {
    border-bottom: 1px solid var(--border, #E2E8F0);
    padding-bottom: 12px;
}

.categories-hub-block__topic-badge {
    background-color: var(--primary, #0F172A);
    color: var(--on-primary, #FFFFFF);
    border-radius: 9999px;
    padding: 4px 10px;
    font-size: 11px;
    letter-spacing: 0.05em;
}

.categories-hub-block__counter {
    color: var(--text-muted, #64748B);
    font-size: 14px;
}

.categories-hub-block__hint {
    color: var(--text-muted, #64748B);
    font-size: 13px;
}

.categories-hub-block__cat-card {
    background-color: var(--surface, #FFFFFF);
    border: 1px solid var(--border, #E2E8F0);
    border-radius: 10px;
    padding: 20px;
    position: relative;
    height: 100%;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.categories-hub-block__cat-card:hover {
    border-color: var(--accent, #E63946);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.categories-hub-block__cat-icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--surface-alt, #F1F5F9);
    border-radius: 8px;
    color: var(--primary-text, #0F172A);
    font-size: 20px;
}

.categories-hub-block__cat-title {
    font-size: 18px;
    font-weight: 700;
}

.categories-hub-block__cat-link {
    color: var(--text, #0F172A);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.categories-hub-block__cat-link:hover {
    color: var(--accent-text, #E63946);
}

.categories-hub-block__cat-desc {
    color: var(--text-muted, #64748B);
    font-size: 14px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.categories-hub-block__cat-footer {
    border-top: 1px solid var(--border, #E2E8F0);
}

.categories-hub-block__post-count {
    color: var(--text-muted, #64748B);
    font-size: 12px;
}

.categories-hub-block__cat-btn {
    border-radius: 9999px;
    font-size: 12px;
    padding: 6px 16px;
    background-color: var(--primary, #0F172A);
    color: var(--on-primary, #FFFFFF);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.categories-hub-block__cat-btn:hover {
    background-color: var(--primary-hover, #E63946);
    color: var(--on-primary, #FFFFFF);
}

.categories-hub-block__stream-card {
    background-color: var(--surface, #FFFFFF);
    border: 1px solid var(--border, #E2E8F0);
    border-radius: 10px;
    overflow: hidden;
    height: 100%;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.categories-hub-block__stream-card:hover {
    border-color: var(--primary, #0F172A);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.categories-hub-block__stream-thumb-link {
    display: block;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
}

.categories-hub-block__stream-thumb {
    width: 100%;
    height: 160px;
    object-fit: cover;
    display: block;
}

.categories-hub-block__meta-date {
    font-size: 12px;
    color: var(--text-muted, #64748B);
}

.categories-hub-block__stream-title {
    font-size: 15px;
    line-height: 1.35;
}

.categories-hub-block__title-link {
    color: var(--text, #0F172A);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.categories-hub-block__title-link:hover {
    color: var(--accent-text, #E63946);
}

.categories-hub-block__meta-author {
    font-size: 12px;
    color: var(--text-muted, #64748B);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.categories-hub-block__read-btn {
    border-radius: 9999px;
    font-size: 11px;
    padding: 4px 12px;
    background-color: var(--primary, #0F172A);
    color: var(--on-primary, #FFFFFF);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.categories-hub-block__read-btn:hover {
    background-color: var(--primary-hover, #E63946);
    color: var(--on-primary, #FFFFFF);
}

@media (min-width: 576px) {
    .categories-hub-block__stream-thumb-link {
        width: 130px;
    }

    .categories-hub-block__stream-thumb {
        height: 100%;
        min-height: 100px;
    }
}

@media (max-width: 767px) {
    .categories-hub-block {
        padding: 32px 0;
    }

    .categories-hub-block__cat-title {
        font-size: 16px;
    }

    .categories-hub-block__stream-title {
        font-size: 14px;
    }
}

/* ===== footer ===== */
.site-footer {
    background-color: #FFFFFF;
    border-top: 1px solid #E2E8F0;
    padding: 48px 0 24px 0;
    color: #475569;
    font-family: 'Orbit', sans-serif;
}

.site-footer__main-row {
    margin-bottom: 36px;
}

.site-footer__brand-block {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.site-footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: #0F172A;
}

.site-footer__logo {
    max-width: 44px;
    max-height: 44px;
    width: 44px;
    height: 44px;
    object-fit: contain;
}

.site-footer__brand-name {
    font-size: 22px;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: 0.02em;
}

.site-footer__brand-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #64748B;
    margin: 0;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.site-footer__status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #F1F5F9;
    border: 1px solid #E2E8F0;
    padding: 6px 12px;
    border-radius: 9999px;
    width: fit-content;
}

.site-footer__status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #10B981;
}

.site-footer__status-text {
    font-size: 11px;
    color: #0F172A;
}

.site-footer__heading {
    font-size: 15px;
    font-weight: 700;
    color: #0F172A;
    margin-bottom: 16px;
    position: relative;
    padding-bottom: 8px;
}

.site-footer__heading::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 24px;
    height: 2px;
    background-color: #E63946;
    border-radius: 2px;
}

.site-footer__link-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: #475569;
    font-size: 13px;
    word-break: keep-all;
}

.site-footer__link i {
    font-size: 14px;
    color: #94A3B8;
}

.site-footer__link:hover {
    color: #E63946;
}

.site-footer__link:hover i {
    color: #E63946;
}

.site-footer__contact-items {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.site-footer__contact-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.site-footer__contact-icon {
    font-size: 16px;
    color: #E63946;
    background-color: #F1F5F9;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #E2E8F0;
}

.site-footer__contact-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.site-footer__contact-label {
    font-size: 11px;
    color: #94A3B8;
}

.site-footer__contact-value {
    font-size: 13px;
    color: #0F172A;
    line-height: 1.4;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.site-footer__contact-link {
    text-decoration: none;
}

.site-footer__contact-link:hover {
    color: #E63946;
}

.site-footer__bottom {
    border-top: 1px solid #E2E8F0;
    padding-top: 20px;
}

.site-footer__copy {
    font-size: 12px;
    color: #64748B;
}

.site-footer__notice {
    font-size: 12px;
    color: #94A3B8;
}

@media (max-width: 767px) {
    .site-footer {
        padding: 36px 0 20px 0;
    }

    .site-footer__heading {
        margin-bottom: 12px;
    }

    .site-footer__main-row {
        margin-bottom: 24px;
    }

    .site-footer__notice {
        font-size: 11px;
    }
}

/* ===== PAGE: privacy ===== */
.policy-content {
  max-width: 860px;
  margin: 0 auto;
  padding: 32px 20px 64px;
  color: #0F172A;
  font-family: 'Orbit', sans-serif;
  line-height: 1.7;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.policy-content h2 {
  font-size: 20px;
  color: #0F172A;
  margin-top: 36px;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid #E2E8F0;
  line-height: 1.35;
}
.policy-content p {
  font-size: 14px;
  color: #334155;
  margin-bottom: 16px;
}
.policy-content ul {
  margin-bottom: 20px;
  padding-left: 20px;
}
.policy-content li {
  font-size: 14px;
  color: #475569;
  margin-bottom: 8px;
  line-height: 1.6;
}
.policy-content strong {
  color: #0F172A;
  font-weight: 600;
}
.policy-content a {
  color: #E63946;
  text-decoration: none;
  border-bottom: 1px dashed #E63946;
}
.policy-content a:hover {
  color: #0F172A;
  border-bottom-style: solid;
}
.policy-content .policy-intro {
  font-size: 15px;
  line-height: 1.8;
  color: #1E293B;
  background: #F8FAFC;
  padding: 16px 20px;
  border-left: 4px solid #0F172A;
  border-radius: 4px;
  margin-bottom: 16px;
}
.policy-content .policy-meta {
  font-size: 13px;
  color: #64748B;
  margin-bottom: 28px;
}
@media (max-width: 767px) {
  .policy-content {
    padding: 24px 16px 48px;
  }
  .policy-content h2 {
    font-size: 16px;
    margin-top: 28px;
  }
  .policy-content p,
  .policy-content li {
    font-size: 13px;
  }
  .policy-content .policy-intro {
    font-size: 13px;
    padding: 12px 14px;
  }
}

/* ===== PAGE: terms ===== */
.policy-content{max-width:860px;margin:0 auto;padding:32px 20px;font-family:'Orbit',sans-serif;color:#0F172A;line-height:1.6;background-color:#FFFFFF;border:1px solid #E2E8F0;border-radius:10px;box-shadow:0 1px 3px rgba(15,23,42,0.05);overflow-wrap:anywhere}.policy-content .policy-intro{border-bottom:1px solid #E2E8F0;padding-bottom:20px;margin-bottom:28px}.policy-content .policy-lead{font-size:15px;color:#0F172A;margin-bottom:8px;line-height:1.6}.policy-content .policy-updated{font-size:12px;color:#64748B;margin-bottom:0}.policy-content .policy-section{margin-bottom:28px}.policy-content .policy-section:last-child{margin-bottom:0}.policy-content h2{font-size:18px;line-height:1.3;color:#0F172A;margin-top:0;margin-bottom:12px;padding-left:10px;border-left:4px solid #E63946}.policy-content h3{font-size:15px;line-height:1.3;color:#0F172A;margin-top:16px;margin-bottom:8px}.policy-content p{font-size:14px;color:#475569;margin-bottom:12px;line-height:1.6}.policy-content ul{margin:0 0 16px 0;padding-left:20px}.policy-content li{font-size:14px;color:#475569;margin-bottom:8px;line-height:1.5}.policy-content li strong{color:#0F172A}.policy-content .policy-link{color:#0F172A;text-decoration:underline;text-underline-offset:3px}.policy-content .policy-link:hover,.policy-content .policy-link:focus{color:#E63946}.policy-content .policy-contact-list{list-style:none;padding-left:0;margin-bottom:0;display:flex;flex-direction:column;gap:10px}.policy-content .policy-contact-list li{margin-bottom:0;padding:10px 14px;background-color:#F8FAFC;border:1px solid #E2E8F0;border-radius:8px}@media (max-width:767px){.policy-content{padding:20px 16px;border-radius:8px}.policy-content h2{font-size:16px;border-left-width:3px;padding-left:8px}.policy-content h3{font-size:14px}.policy-content p,.policy-content li,.policy-content .policy-lead{font-size:13px;hyphens:auto}.policy-content .policy-updated{font-size:11px}.policy-content .policy-contact-list li{padding:8px 12px}}

/* ===== PAGE: disclaimer ===== */
.policy-content { font-family: 'Orbit', sans-serif; color: #0F172A; background: #FFFFFF; border: 1px solid #E2E8F0; border-radius: 10px; padding: 32px; line-height: 1.6; word-break: keep-all; overflow-wrap: anywhere; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05); } .policy-content .policy-meta-block { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 20px; margin-bottom: 28px; border-bottom: 1px solid #E2E8F0; } .policy-content .policy-updated-date { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #64748B; } .policy-content .policy-version-badge { display: inline-flex; align-items: center; padding: 4px 12px; font-size: 11px; background: #F1F5F9; color: #0F172A; border: 1px solid #E2E8F0; border-radius: 9999px; } .policy-content .policy-section-group { margin-bottom: 32px; } .policy-content .policy-section-group:last-child { margin-bottom: 0; } .policy-content h2 { font-size: 18px; line-height: 1.35; color: #0F172A; margin-bottom: 12px; font-weight: 400; letter-spacing: 0.02em; border-left: 4px solid #E63946; padding-left: 12px; } .policy-content p { font-size: 14px; line-height: 1.65; color: #334155; margin-bottom: 12px; } .policy-content p:last-child { margin-bottom: 0; } .policy-content ul { margin: 12px 0 16px 0; padding-left: 20px; list-style-type: disc; } .policy-content ul li { font-size: 14px; line-height: 1.65; color: #334155; margin-bottom: 8px; } .policy-content ul li:last-child { margin-bottom: 0; } .policy-content strong { color: #0F172A; } .policy-content .policy-contact-card { background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 10px; padding: 24px; margin-top: 36px; } .policy-content .policy-contact-card h2 { border-left-color: #0F172A; } .policy-content .policy-contact-details { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; } .policy-content .contact-item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; color: #334155; margin-bottom: 0; } .policy-content .contact-item i { font-size: 16px; color: #E63946; } .policy-content .contact-item a { color: #0F172A; text-decoration: underline; text-underline-offset: 3px; } .policy-content .contact-item a:hover { color: #E63946; } @media (max-width: 767px) { .policy-content { padding: 18px 14px; } .policy-content h2 { font-size: 15px; } .policy-content p, .policy-content ul li, .policy-content .contact-item { font-size: 13px; line-height: 1.6; } .policy-content .policy-contact-card { padding: 16px 12px; } .policy-content .policy-meta-block { flex-direction: column; align-items: flex-start; gap: 8px; } }

/* ===== PAGE: cookies ===== */
.policy-content{color:var(--text,#0f172a);font-family:'Orbit',sans-serif;line-height:1.6;font-size:14px;word-break:keep-all;overflow-wrap:anywhere}.policy-content .policy-intro{background-color:var(--surface-alt,#f1f5f9);border:1px solid var(--border,#e2e8f0);border-radius:10px;padding:20px;margin-bottom:28px}.policy-content .policy-intro p{margin:0;color:var(--text,#0f172a);font-size:15px;line-height:1.7}.policy-content .policy-section{margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid var(--border,#e2e8f0)}.policy-content .policy-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.policy-content h2{font-size:20px;line-height:1.3;color:var(--text,#0f172a);margin-top:0;margin-bottom:14px;font-weight:400}.policy-content h3{font-size:16px;line-height:1.3;color:var(--text,#0f172a);margin-top:16px;margin-bottom:10px;font-weight:400}.policy-content p{margin-top:0;margin-bottom:14px;color:var(--text,#0f172a)}.policy-content .policy-list{list-style-type:disc;padding-left:22px;margin-top:0;margin-bottom:16px}.policy-content .policy-list li{margin-bottom:8px;color:var(--text,#0f172a);line-height:1.6}.policy-content .policy-list li strong{color:var(--text,#0f172a)}.policy-content .policy-subblock{background:var(--surface,#ffffff);border:1px solid var(--border,#e2e8f0);border-radius:8px;padding:16px;margin:14px 0}.policy-content .policy-note{font-size:13px;color:var(--text-muted,#64748b);margin-top:10px;margin-bottom:0}.policy-content .policy-contact-box{background:var(--surface-alt,#f1f5f9);border:1px solid var(--border,#e2e8f0);border-radius:10px;padding:16px 20px;margin-top:16px}.policy-content .policy-contact-box p{margin:6px 0;font-size:14px;color:var(--text,#0f172a)}.policy-content .policy-contact-box a{color:var(--primary,#0f172a);text-decoration:underline;font-weight:400}.policy-content .policy-contact-box a:hover{color:var(--primary-accent,#e63946)}@media(max-width:767px){.policy-content{font-size:13px}.policy-content h2{font-size:16px;hyphens:auto}.policy-content h3{font-size:14px;hyphens:auto}.policy-content .policy-intro{padding:14px}.policy-content .policy-section{margin-bottom:24px;padding-bottom:18px}.policy-content .policy-subblock{padding:12px}.policy-content .policy-contact-box{padding:12px 14px}}

/* ===== PAGE: news ===== */
.news-feed-section .pw-card { transition: border-color 0s, box-shadow 0s; }
.news-feed-section .pw-card:hover { border-color: #E63946 !important; box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08); }
.news-feed-section .ratio { min-height: 240px; }
.news-feed-section .pw-media { transition: transform 0s; }
.news-feed-section .pw-btn, .subscription-block .pw-btn { background-color: #0F172A; color: #FFFFFF; border: 1px solid #0F172A; border-radius: 9999px; padding: 10px 24px; text-decoration: none; display: inline-block; font-family: 'Orbit', sans-serif; }
.news-feed-section .pw-btn:hover, .subscription-block .pw-btn:hover { background-color: #E63946; border-color: #E63946; color: #FFFFFF; }
.subscription-block .sub-input { background-color: #FFFFFF; border: 1px solid #E2E8F0; color: #0F172A; border-radius: 6px; padding: 10px 14px; }
.subscription-block .sub-input:focus { border-color: #0F172A; box-shadow: none; outline: none; }
.subscription-block .sub-input::placeholder { color: #94A3B8; opacity: 1; }
.subscription-block .tariff-option-btn { background-color: #F8FAFC; border-color: #E2E8F0; cursor: pointer; transition: none; }
.subscription-block .tariff-option-btn:hover { border-color: #0F172A; }
.subscription-block .tariff-option-btn.active { background-color: #FFFFFF; border-color: #0F172A; border-width: 2px; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08); }
@media (max-width: 767px) { .news-zigzag-item .ratio { min-height: 180px; } }

/* ===== PAGE: reviews ===== */
.reviews-list-block .reviews-card {
  border: 1px solid var(--border, #E2E8F0);
  border-radius: 10px;
  background-color: var(--surface, #FFFFFF);
}

.reviews-list-block .reviews-img-link {
  aspect-ratio: 1 / 1;
  width: 100%;
  max-height: 380px;
  background-color: var(--surface-alt, #F1F5F9);
}

.reviews-list-block .reviews-square-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.reviews-list-block .reviews-title-link {
  color: var(--text, #0F172A);
  overflow-wrap: anywhere;
}

.reviews-list-block .reviews-title-link:hover {
  color: var(--primary, #E63946);
}

.reviews-list-block .pw-btn {
  border-radius: 9999px;
  background-color: var(--interactive-primary, #0F172A);
  color: #FFFFFF;
  padding: 10px 24px;
  font-size: 13px;
  border: 1px solid var(--interactive-primary, #0F172A);
}

.reviews-list-block .pw-btn:hover {
  background-color: var(--primary-hover, #E63946);
  color: #FFFFFF;
  border-color: var(--primary-hover, #E63946);
}

.subscription-form-block .subscription-card {
  border: 1px solid var(--border, #E2E8F0);
  border-radius: 12px;
  background-color: var(--surface, #FFFFFF);
}

.subscription-form-block .subscription-plan-option {
  border: 1px solid var(--border, #E2E8F0);
  background-color: var(--surface-alt, #F8FAFC);
  cursor: pointer;
}

.subscription-form-block .subscription-plan-option.active {
  border-color: var(--interactive-primary, #0F172A);
  background-color: var(--surface, #FFFFFF);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

.subscription-form-block .subscription-input {
  background-color: #FFFFFF;
  border: 1px solid var(--border, #CBD5E1);
  color: var(--text, #0F172A);
  border-radius: 6px;
  padding: 8px 12px;
}

.subscription-form-block .subscription-input:focus {
  border-color: var(--interactive-primary, #0F172A);
  box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.1);
}

.subscription-form-block .subscription-input::placeholder {
  color: #94A3B8;
  opacity: 1;
}

.subscription-form-block .pw-btn {
  border-radius: 9999px;
  background-color: var(--interactive-primary, #0F172A);
  color: #FFFFFF;
  border: 1px solid var(--interactive-primary, #0F172A);
  font-size: 14px;
  font-weight: 400;
}

.subscription-form-block .pw-btn:hover {
  background-color: var(--primary-hover, #E63946);
  color: #FFFFFF;
  border-color: var(--primary-hover, #E63946);
}

@media (max-width: 767px) {
  .reviews-list-block .reviews-img-link {
    max-height: 280px;
  }
}

/* ===== PAGE: guides ===== */
.wx-guides-list-section .wx-tall-tile {
  background: var(--surface, #FFFFFF);
  border: 1px solid var(--border, #E2E8F0);
  border-radius: 10px;
  overflow: hidden;
  transition: border-color 0s, box-shadow 0s;
}
.wx-guides-list-section .wx-tall-tile:hover {
  border-color: var(--primary-accent, #E63946);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}
.wx-guides-list-section .wx-tile-media {
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 8px 8px 0 0;
  background: var(--surface-alt, #F1F5F9);
}
.wx-guides-list-section .wx-guide-title {
  font-family: var(--font-family-headings, 'Orbit', sans-serif);
  color: var(--text, #0F172A);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wx-guides-list-section .wx-guide-title:hover {
  color: var(--primary-accent, #E63946);
}
.wx-guides-list-section .wx-read-link {
  color: var(--primary-text, #0F172A);
  font-family: var(--font-family-buttons, 'Orbit', sans-serif);
  font-weight: 500;
}
.wx-guides-list-section .wx-read-link:hover {
  color: var(--primary-accent, #E63946);
}
.wx-subscription-section .wx-sub-card {
  background: var(--surface, #FFFFFF);
  border: 1px solid var(--border, #E2E8F0);
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}
.wx-subscription-section .wx-plan-card {
  background: var(--surface, #FFFFFF);
  border-color: var(--border, #E2E8F0);
  color: var(--text, #0F172A);
  cursor: pointer;
  transition: none;
}
.wx-subscription-section .wx-plan-card:hover {
  border-color: var(--primary-accent, #E63946);
}
.wx-subscription-section .wx-plan-card.active {
  border-color: var(--border-focus, #0F172A);
  background: var(--surface-alt, #F1F5F9);
  outline: 2px solid var(--border-focus, #0F172A);
}
.wx-subscription-section .wx-form-input {
  background: var(--surface, #FFFFFF);
  border: 1px solid var(--border, #E2E8F0);
  color: var(--text, #0F172A);
  border-radius: 6px;
  padding: 10px 14px;
}
.wx-subscription-section .wx-form-input:focus {
  border-color: var(--border-focus, #0F172A);
  box-shadow: none;
  background: #FFFFFF;
}
.wx-subscription-section .wx-form-input::placeholder {
  color: var(--text-muted, #94A3B8);
}
.wx-subscription-section .wx-submit-btn {
  min-width: 160px;
  text-align: center;
  padding: 10px 24px;
  border-radius: 9999px;
  background: var(--interactive-button-primary-bg, #0F172A);
  color: #FFFFFF;
  border: 1px solid #0F172A;
  font-family: var(--font-family-primary, 'Orbit', sans-serif);
}
.wx-subscription-section .wx-submit-btn:hover {
  background: var(--interactive-button-primary-hover-bg, #E63946);
  border-color: #E63946;
  color: #FFFFFF;
}
@media (max-width: 767px) {
  .wx-subscription-section .js-tariff-options {
    flex-direction: column;
  }
}

/* ===== PAGE: about ===== */
.wx-about-section {
  background-color: var(--bg, #F8FAFC);
  font-family: 'Orbit', sans-serif;
}
.wx-about-section .pw-badge {
  background-color: #F1F5F9;
  color: #0F172A;
  border: 1px solid #E2E8F0;
  padding: 4px 12px;
  border-radius: 9999px;
  font-size: 11px;
  letter-spacing: 0.05em;
}
.wx-about-section .pw-title {
  font-size: 24px;
  color: #0F172A;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.wx-about-section .pw-card {
  background-color: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
}
.wx-about-section .wx-stat-card {
  min-width: 180px;
}
.wx-about-section .wx-stat-icon {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  background-color: #F1F5F9;
  color: #0F172A;
  font-size: 20px;
}
.wx-about-section .wx-about-image-wrap {
  min-height: 320px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #E2E8F0;
}
.wx-about-section .wx-about-image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.wx-about-section .wx-value-card {
  transition: none;
  border-left: 4px solid #0F172A;
}
.wx-about-section .wx-value-card:hover {
  border-color: #E63946;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}
.wx-about-section .wx-value-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background-color: #F8FAFC;
  border: 1px solid #E2E8F0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #0F172A;
}
.wx-about-section .wx-input {
  background-color: #FFFFFF;
  border: 1px solid #E2E8F0;
  color: #0F172A;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 14px;
}
.wx-about-section .wx-input:focus {
  border-color: #0F172A;
  box-shadow: none;
  background-color: #FFFFFF;
  color: #0F172A;
}
.wx-about-section .wx-input::placeholder {
  color: #94A3B8;
  opacity: 1;
}
.wx-about-section .wx-submit-btn {
  background-color: #0F172A;
  color: #FFFFFF;
  border: 1px solid #0F172A;
  border-radius: 9999px;
  padding: 12px 24px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 400;
}
.wx-about-section .wx-submit-btn:hover {
  background-color: #E63946;
  border-color: #E63946;
  color: #FFFFFF;
}
@media (max-width: 767px) {
  .wx-about-section .pw-title {
    font-size: 16px;
  }
  .wx-about-section h3 {
    font-size: 14px;
  }
  .wx-about-section .wx-stat-card {
    width: 100%;
  }
}

.wx-comment-card {
    border-color: #E2E8F0 !important;
    background-color: #FFFFFF;
    font-family: 'Orbit', sans-serif;
}

.wx-avatar {
    width: 44px;
    height: 44px;
    object-fit: cover;
    border: 1px solid #E2E8F0;
}

.wx-author-name {
    color: #0F172A;
    font-size: 14px;
}

.wx-badge-pill {
    font-size: 11px;
    padding: 2px 10px;
    border-radius: 9999px;
    background-color: #F1F5F9;
    color: #475569;
    border: 1px solid #E2E8F0;
}

.wx-meta-time {
    font-size: 12px;
    color: #64748B !important;
}

.wx-topic-tag {
    font-size: 11px;
    color: #8B5CF6;
    font-weight: 600;
}

.wx-comment-content {
    color: #0F172A;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: 0.01em;
}

.wx-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Orbit', sans-serif;
    font-size: 12px;
    padding: 6px 14px;
    border-radius: 9999px;
    background-color: #F1F5F9;
    color: #0F172A;
    border: 1px solid #E2E8F0;
    cursor: pointer;
}

.wx-action-btn:hover {
    background-color: #0F172A;
    color: #FFFFFF;
    border-color: #0F172A;
}

.wx-like-count {
    font-weight: bold;
}

.wx-reply-card {
    border-color: #E2E8F0 !important;
    background-color: #FFFFFF;
    font-family: 'Orbit', sans-serif;
    overflow: hidden;
}

.wx-reply-indicator {
    width: 4px;
    background-color: #E63946;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.wx-avatar-reply {
    width: 36px;
    height: 36px;
    object-fit: cover;
    border: 1px solid #E2E8F0;
}

.wx-author-name {
    color: #0F172A;
    font-size: 13px;
}

.wx-badge-sub {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 9999px;
    background-color: #F8FAFC;
    color: #64748B;
    border: 1px solid #E2E8F0;
}

.wx-meta-time {
    font-size: 11px;
    color: #64748B !important;
}

.wx-comment-content {
    color: #0F172A;
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: 0.01em;
}

.wx-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Orbit', sans-serif;
    font-size: 11px;
    padding: 4px 12px;
    border-radius: 9999px;
    background-color: #F1F5F9;
    color: #0F172A;
    border: 1px solid #E2E8F0;
    cursor: pointer;
}

.wx-action-btn:hover {
    background-color: #0F172A;
    color: #FFFFFF;
    border-color: #0F172A;
}

.wx-like-count {
    font-weight: bold;
}


/* ===== PAGE TEMPLATE: news ===== */
.wx-header {
    background-color: #FFFFFF;
    border-color: var(--border, #E2E8F0) !important;
    position: sticky;
    top: 0;
    z-index: 1030;
    width: 100%;
}

.wx-header .wx-navbar {
    background-color: #FFFFFF;
    padding-top: 14px;
    padding-bottom: 14px;
}

.wx-header .wx-brand-logo {
    max-width: 44px;
    max-height: 44px;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.wx-header .wx-brand-name {
    font-family: 'Orbit', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: 0.02em;
}

.wx-header .wx-toggler {
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    padding: 6px 10px;
    background-color: #F8FAFC;
    box-shadow: none;
}

.wx-header .wx-toggler:focus {
    box-shadow: none;
    outline: 2px solid #0F172A;
}

.wx-header .wx-toggler-icon {
    font-size: 22px;
    color: #0F172A;
    display: inline-block;
    vertical-align: middle;
}

.wx-header .wx-nav-link {
    font-family: 'Orbit', sans-serif;
    font-size: 14px;
    color: #334155;
    padding: 8px 16px !important;
    border-radius: 9999px;
    font-weight: 500;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.wx-header .wx-nav-link:hover,
.wx-header .wx-nav-link:focus {
    color: #E63946;
    background-color: #F1F5F9;
}

.wx-header .wx-nav-link.active {
    color: #0F172A;
    font-weight: 700;
    background-color: #F1F5F9;
}

@media (max-width: 991.98px) {
    .wx-header #wxNavbarCollapse {
        background-color: #FFFFFF;
        border-top: 1px solid #E2E8F0;
        margin-top: 12px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .wx-header .wx-nav-link {
        padding: 10px 14px !important;
        margin-bottom: 4px;
        border-radius: 8px;
    }
}

.hero-wexorin {
    min-height: 480px;
    display: flex;
    align-items: center;
    background-color: var(--dark-band, #0F172A);
}

.hero-wexorin__video-wrap {
    z-index: 1;
    pointer-events: none;
}

.hero-wexorin__video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-wexorin__overlay {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.82) 0%, rgba(15, 23, 42, 0.92) 60%, rgba(15, 23, 42, 0.98) 100%);
}

.hero-wexorin .container {
    z-index: 2;
}

.hero-wexorin__badge {
    background: rgba(255, 255, 255, 0.12);
    color: var(--on-dark, #FFFFFF);
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 13px;
}

.hero-wexorin__title {
    font-size: clamp(24px, 3.5vw, 40px);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--on-dark, #FFFFFF);
    overflow-wrap: anywhere;
    hyphens: auto;
}

.hero-wexorin__lead {
    font-size: clamp(14px, 1.8vw, 16px);
    line-height: 1.6;
    max-width: 740px;
    color: var(--on-dark-muted, #CBD5E1);
    overflow-wrap: anywhere;
}

.hero-wexorin__btn {
    background-color: var(--primary, #E63946);
    color: var(--on-primary, #FFFFFF);
    border: 1px solid var(--primary, #E63946);
    padding: 10px 24px;
    border-radius: 9999px;
    font-size: 13px;
    text-decoration: none;
}

.hero-wexorin__btn:hover {
    background-color: var(--primary-hover, #D62839);
    border-color: var(--primary-hover, #D62839);
    color: #FFFFFF;
}

.hero-wexorin__btn-alt {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--on-dark, #FFFFFF);
    border: 1px solid rgba(255, 255, 255, 0.25);
    padding: 10px 24px;
    border-radius: 9999px;
    font-size: 13px;
    text-decoration: none;
}

.hero-wexorin__btn-alt:hover {
    background-color: rgba(255, 255, 255, 0.18);
    color: #FFFFFF;
    border-color: rgba(255, 255, 255, 0.4);
}

.hero-wexorin__highlights {
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.hero-wexorin__highlight-card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    height: 100%;
}

.hero-wexorin__icon {
    color: #FFFFFF;
    font-size: 18px;
}

.hero-wexorin__highlight-title {
    font-size: 13px;
    color: var(--on-dark, #FFFFFF);
}

.hero-wexorin__highlight-desc {
    font-size: 12px;
    line-height: 1.5;
    color: var(--on-dark-muted, #94A3B8);
}


.wx-detail-page {
    background-color: #F8FAFC;
    font-family: 'Orbit', sans-serif;
}

.wx-detail-page .wx-section-heading {
    border-left: 4px solid var(--primary, #E63946);
    padding-left: 12px;
    color: #0F172A;
    letter-spacing: -0.01em;
}

.wx-intro-media-frame {
    aspect-ratio: 16 / 10;
    background-color: #FFFFFF;
}

.wx-detail-page .wx-custom-badge {
    background-color: #0F172A;
    color: #FFFFFF;
    padding: 4px 12px;
    border-radius: 9999px;
    font-size: 12px;
}

.wx-facts-table th {
    width: 40%;
    background-color: #F8FAFC;
    font-size: 13px;
}

.wx-facts-table td {
    font-size: 13px;
}

.wx-cta-icon-box {
    width: 48px;
    height: 48px;
}

.wx-toc-list {
    font-size: 14px;
    line-height: 1.6;
}

.wx-toc-list a:hover {
    color: #E63946 !important;
}

.wx-article-content {
    font-size: 15px;
    line-height: 1.75;
}

.wx-content-banner {
    aspect-ratio: 21 / 9;
}

.wx-related-thumb {
    aspect-ratio: 16 / 10;
    background-color: #F1F5F9;
}

.wx-related-date {
    font-size: 11px;
}

.wx-related-card {
    transition: border-color 0.2s, box-shadow 0.2s;
}

.wx-related-card:hover {
    border-color: #E63946 !important;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}


.wx-avatar {
    width: 44px;
    height: 44px;
    object-fit: cover;
}

.wx-avatar-reply {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.wx-badge-pill {
    background-color: #F1F5F9;
    color: #0F172A;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 9999px;
    border: 1px solid #E2E8F0;
}

.wx-badge-sub {
    background-color: #F1F5F9;
    color: #64748B;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 9999px;
}

.wx-topic-tag {
    color: #E63946;
    font-weight: 500;
}

.wx-action-btn {
    background: #F1F5F9;
    border: 1px solid #E2E8F0;
    border-radius: 9999px;
    padding: 4px 12px;
    font-size: 12px;
    color: #475569;
    display: inline-flex;
    align-items: center;
}

.wx-action-btn.active {
    background-color: #0F172A;
    color: #FFFFFF;
    border-color: #0F172A;
}

.wx-action-btn:hover {
    background-color: #E2E8F0;
    color: #0F172A;
}

.wx-action-btn.active:hover {
    background-color: #E63946;
    color: #FFFFFF;
    border-color: #E63946;
}

.wx-reply-indicator {
    width: 3px;
    background-color: #E63946;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

@media (max-width: 767.98px) {
    .hero-wexorin {
        min-height: auto;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .hero-wexorin__title {
        font-size: 18px;
    }

    .hero-wexorin__lead {
        font-size: 13px;
    }

    .wx-facts-table th,
    .wx-facts-table td {
        display: block;
        width: 100%;
    }

    .wx-facts-table th {
        border-bottom: none;
        padding-bottom: 2px;
    }

    .wx-facts-table td {
        padding-top: 2px;
    }
}


.site-footer {
    background-color: #FFFFFF;
    border-top: 1px solid #E2E8F0;
    padding: 48px 0 24px 0;
    color: #475569;
    font-family: 'Orbit', sans-serif;
}

.site-footer__main-row {
    margin-bottom: 36px;
}

.site-footer__brand-block {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.site-footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: #0F172A;
}

.site-footer__logo {
    max-width: 44px;
    max-height: 44px;
    width: 44px;
    height: 44px;
    object-fit: contain;
}

.site-footer__brand-name {
    font-size: 22px;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: 0.02em;
}

.site-footer__brand-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #64748B;
    margin: 0;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.site-footer__status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #F1F5F9;
    border: 1px solid #E2E8F0;
    padding: 6px 12px;
    border-radius: 9999px;
    width: fit-content;
}

.site-footer__status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #10B981;
}

.site-footer__status-text {
    font-size: 11px;
    color: #0F172A;
}

.site-footer__heading {
    font-size: 15px;
    font-weight: 700;
    color: #0F172A;
    margin-bottom: 16px;
    position: relative;
    padding-bottom: 8px;
}

.site-footer__heading::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 24px;
    height: 2px;
    background-color: #E63946;
    border-radius: 2px;
}

.site-footer__link-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: #475569;
    font-size: 13px;
    word-break: keep-all;
}

.site-footer__link i {
    font-size: 14px;
    color: #94A3B8;
}

.site-footer__link:hover {
    color: #E63946;
}

.site-footer__link:hover i {
    color: #E63946;
}

.site-footer__contact-items {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.site-footer__contact-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.site-footer__contact-icon {
    font-size: 16px;
    color: #E63946;
    background-color: #F1F5F9;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #E2E8F0;
}

.site-footer__contact-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.site-footer__contact-label {
    font-size: 11px;
    color: #94A3B8;
}

.site-footer__contact-value {
    font-size: 13px;
    color: #0F172A;
    line-height: 1.4;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.site-footer__contact-link {
    text-decoration: none;
}

.site-footer__contact-link:hover {
    color: #E63946;
}

.site-footer__bottom {
    border-top: 1px solid #E2E8F0;
    padding-top: 20px;
}

.site-footer__copy {
    font-size: 12px;
    color: #64748B;
}

.site-footer__notice {
    font-size: 12px;
    color: #94A3B8;
}

@media (max-width: 767px) {
    .site-footer {
        padding: 36px 0 20px 0;
    }

    .site-footer__heading {
        margin-bottom: 12px;
    }

    .site-footer__main-row {
        margin-bottom: 24px;
    }

    .site-footer__notice {
        font-size: 11px;
    }
}

/* ===== PAGE TEMPLATE: reviews ===== */
.wx-header {
    background-color: #FFFFFF;
    border-color: #E2E8F0 !important;
    position: sticky;
    top: 0;
    z-index: 1030;
    width: 100%;
}

.wx-header .wx-navbar {
    background-color: #FFFFFF;
    padding-top: 14px;
    padding-bottom: 14px;
}

.wx-header .wx-brand-logo {
    max-width: 44px;
    max-height: 44px;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}

.wx-header .wx-brand-name {
    font-family: 'Orbit', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: 0.02em;
}

.wx-header .wx-toggler {
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    padding: 6px 10px;
    background-color: #F8FAFC;
    box-shadow: none;
}

.wx-header .wx-toggler:focus {
    box-shadow: none;
    outline: 2px solid #0F172A;
}

.wx-header .wx-toggler-icon {
    font-size: 22px;
    color: #0F172A;
    display: inline-block;
    vertical-align: middle;
}

.wx-header .wx-nav-link {
    font-family: 'Orbit', sans-serif;
    font-size: 14px;
    color: #334155;
    padding: 8px 16px !important;
    border-radius: 9999px;
    font-weight: 500;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.wx-header .wx-nav-link:hover,
.wx-header .wx-nav-link:focus {
    color: #E63946;
    background-color: #F1F5F9;
}

.wx-header .wx-nav-link.active {
    color: #0F172A;
    font-weight: 700;
    background-color: #F1F5F9;
}

@media (max-width: 991.98px) {
    .wx-header #wxNavbarCollapse {
        background-color: #FFFFFF;
        border-top: 1px solid #E2E8F0;
        margin-top: 12px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .wx-header .wx-nav-link {
        padding: 10px 14px !important;
        margin-bottom: 4px;
        border-radius: 8px;
    }
}

.hero-wexorin {
    min-height: 380px;
    display: flex;
    align-items: center;
    background-color: #0F172A;
}

.hero-wexorin__video-wrap {
    z-index: 1;
    pointer-events: none;
}

.hero-wexorin__overlay {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.95) 100%);
}

.hero-wexorin .container {
    z-index: 2;
}

.hero-wexorin__badge {
    background: rgba(255, 255, 255, 0.12);
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 13px;
}

.hero-wexorin__title {
    font-size: clamp(24px, 3.5vw, 38px);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: #FFFFFF;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.hero-wexorin__lead {
    font-size: clamp(14px, 1.6vw, 16px);
    line-height: 1.6;
    max-width: 740px;
    color: #CBD5E1;
    overflow-wrap: anywhere;
}

.wx-article-detail {
    background-color: #F8FAFC;
}

.wx-article-detail__main-media img {
    max-height: 480px;
    width: 100%;
    border-radius: 16px;
}

.wx-article-detail__takeaways {
    background-color: #FFFFFF;
    border-left: 4px solid #E63946;
    border-top: 1px solid #E2E8F0;
    border-right: 1px solid #E2E8F0;
    border-bottom: 1px solid #E2E8F0;
}

.wx-article-detail__takeaways-list {
    list-style: disc;
    padding-left: 20px;
    color: #334155;
    font-size: 14px;
}

.wx-article-detail__toc {
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.wx-article-detail__toc-list a:hover {
    color: #E63946 !important;
}

.wx-article-detail__quote {
    background-color: #F1F5F9;
    border-left: 4px solid #0F172A;
}

.wx-article-detail__img-wrap img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    border-radius: 12px;
}

.wx-section-number {
    font-size: 20px;
    letter-spacing: 0.05em;
}

.wx-article-detail__facts {
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.wx-article-detail__cta {
    background-color: #FFFFFF;
    border: 1px solid #E2E8F0;
    box-shadow: 0 4px 20px rgba(230, 57, 70, 0.08);
}

.wx-cta-icon-box {
    width: 60px;
    height: 60px;
}

.wx-related-card {
    transition: none;
}

.wx-related-card:hover {
    border-color: #E63946 !important;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.wx-avatar {
    width: 48px;
    height: 48px;
    object-fit: cover;
}

.wx-avatar-reply {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.wx-badge-pill {
    background-color: #F1F5F9;
    color: #0F172A;
    font-size: 11px;
    padding: 3px 8px;
    border-radius: 9999px;
    border: 1px solid #E2E8F0;
}

.wx-badge-sub {
    background-color: #F1F5F9;
    color: #64748B;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 9999px;
    border: 1px solid #E2E8F0;
}

.wx-topic-tag {
    color: #8B5CF6;
    font-weight: 500;
}

.wx-action-btn {
    background: transparent;
    border: 1px solid #E2E8F0;
    color: #64748B;
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 9999px;
}

.wx-action-btn:hover,
.wx-action-btn.active {
    background-color: #0F172A;
    color: #FFFFFF;
    border-color: #0F172A;
}

.wx-reply-indicator {
    width: 3px;
    background-color: #E2E8F0;
    border-radius: 3px 0 0 3px;
}

.wx-input {
    background-color: #F8FAFC;
    border: 1px solid #E2E8F0;
    color: #0F172A;
    font-size: 14px;
    border-radius: 8px;
}

.wx-input:focus {
    background-color: #FFFFFF;
    border-color: #0F172A;
    box-shadow: none;
    color: #0F172A;
}

.wx-input::placeholder {
    color: #94A3B8;
}

.site-footer {
    background-color: #FFFFFF;
    border-top: 1px solid #E2E8F0;
    padding: 48px 0 24px 0;
    color: #475569;
    font-family: 'Orbit', sans-serif;
}

.site-footer__main-row {
    margin-bottom: 36px;
}

.site-footer__brand-block {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.site-footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: #0F172A;
}

.site-footer__logo {
    max-width: 44px;
    max-height: 44px;
    width: 44px;
    height: 44px;
    object-fit: contain;
}

.site-footer__brand-name {
    font-size: 22px;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: 0.02em;
}

.site-footer__brand-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #64748B;
    margin: 0;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.site-footer__status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #F1F5F9;
    border: 1px solid #E2E8F0;
    padding: 6px 12px;
    border-radius: 9999px;
    width: fit-content;
}

.site-footer__status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #10B981;
}

.site-footer__status-text {
    font-size: 11px;
    color: #0F172A;
}

.site-footer__heading {
    font-size: 15px;
    font-weight: 700;
    color: #0F172A;
    margin-bottom: 16px;
    position: relative;
    padding-bottom: 8px;
}

.site-footer__heading::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 24px;
    height: 2px;
    background-color: #E63946;
    border-radius: 2px;
}

.site-footer__link-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.site-footer__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: #475569;
    font-size: 13px;
    word-break: keep-all;
}

.site-footer__link i {
    font-size: 14px;
    color: #94A3B8;
}

.site-footer__link:hover {
    color: #E63946;
}

.site-footer__link:hover i {
    color: #E63946;
}

.site-footer__contact-items {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.site-footer__contact-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.site-footer__contact-icon {
    font-size: 16px;
    color: #E63946;
    background-color: #F1F5F9;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #E2E8F0;
}

.site-footer__contact-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.site-footer__contact-label {
    font-size: 11px;
    color: #94A3B8;
}

.site-footer__contact-value {
    font-size: 13px;
    color: #0F172A;
    line-height: 1.4;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.site-footer__contact-link {
    text-decoration: none;
}

.site-footer__contact-link:hover {
    color: #E63946;
}

.site-footer__bottom {
    border-top: 1px solid #E2E8F0;
    padding-top: 20px;
}

.site-footer__copy {
    font-size: 12px;
    color: #64748B;
}

.site-footer__notice {
    font-size: 12px;
    color: #94A3B8;
}

@media (max-width: 767.98px) {
    .site-footer {
        padding: 36px 0 20px 0;
    }

    .site-footer__heading {
        margin-bottom: 12px;
    }

    .site-footer__main-row {
        margin-bottom: 24px;
    }

    .site-footer__notice {
        font-size: 11px;
    }

    .hero-wexorin {
        min-height: auto;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .hero-wexorin__title {
        font-size: 18px;
    }

    .hero-wexorin__lead {
        font-size: 13px;
    }

    .wx-article-detail__main-media img {
        height: 240px;
    }

    .wx-article-detail__img-wrap img {
        height: 220px;
    }
}

/* ===== PAGE TEMPLATE: guides ===== */
.wx-guide-detail-page .wx-section-heading {
    border-left: 4px solid var(--primary, #E63946);
    padding-left: 12px;
    font-size: 20px;
    font-weight: 700;
    color: #0F172A;
    line-height: 1.3;
}

.wx-guide-detail-page .wx-image-frame {
    border-color: #E2E8F0 !important;
}

.wx-guide-detail-page .wx-toc-block {
    border-color: #E2E8F0 !important;
}

.wx-guide-detail-page .wx-toc-list {
    font-size: 14px;
    line-height: 1.6;
}

.wx-guide-detail-page .wx-toc-list a:hover {
    color: var(--primary, #E63946) !important;
}

.wx-guide-detail-page .wx-body-paragraph {
    font-size: 15px;
    line-height: 1.8;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.wx-guide-detail-page .wx-pullquote {
    background-color: #FFFFFF;
}

.wx-guide-detail-page .wx-grid-card {
    border-color: #E2E8F0 !important;
    transition: none;
}

.wx-guide-detail-page .wx-grid-card:hover {
    border-color: var(--primary, #E63946) !important;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.wx-guide-detail-page .wx-card-icon-wrap {
    width: 44px;
    height: 44px;
}

.wx-guide-detail-page .wx-numbered-list li {
    font-size: 14px;
    line-height: 1.6;
}

.wx-guide-detail-page .wx-cta-banner {
    background-color: #F8FAFC !important;
    border-color: #E2E8F0 !important;
}

.wx-guide-detail-page .wx-related-link {
    background-color: #F8FAFC;
    border: 1px solid #E2E8F0;
    font-size: 14px;
}

.wx-guide-detail-page .wx-related-link:hover {
    background-color: #F1F5F9;
    border-color: var(--primary, #E63946);
}

.wx-guide-detail-page .wx-avatar {
    width: 48px;
    height: 48px;
    object-fit: cover;
}

.wx-guide-detail-page .wx-avatar-reply {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.wx-guide-detail-page .wx-badge-pill {
    background: #F1F5F9;
    color: #0F172A;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 9999px;
    border: 1px solid #E2E8F0;
}

.wx-guide-detail-page .wx-badge-sub {
    background: #F8FAFC;
    color: #64748B;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 4px;
    border: 1px solid #E2E8F0;
}

.wx-guide-detail-page .wx-topic-tag {
    color: var(--primary, #E63946);
    font-weight: 500;
}

.wx-guide-detail-page .wx-action-btn {
    background: #F1F5F9;
    border: 1px solid #E2E8F0;
    color: #475569;
    font-size: 12px;
    padding: 4px 12px;
    border-radius: 9999px;
}

.wx-guide-detail-page .wx-action-btn:hover,
.wx-guide-detail-page .wx-action-btn.active {
    background: #0F172A;
    color: #FFFFFF;
    border-color: #0F172A;
}

.wx-guide-detail-page .wx-reply-card {
    border-left: 3px solid var(--primary, #E63946) !important;
}

.wx-guide-detail-page .wx-input {
    background-color: #FFFFFF;
    border: 1px solid #E2E8F0;
    color: #0F172A;
    font-size: 14px;
}

.wx-guide-detail-page .wx-input::placeholder {
    color: #94A3B8;
}

.wx-guide-detail-page .wx-input:focus {
    border-color: #0F172A;
    box-shadow: none;
    outline: none;
}

@media (max-width: 767.98px) {
    .wx-guide-detail-page .wx-section-heading {
        font-size: 16px;
    }

    .wx-guide-detail-page .wx-body-paragraph {
        font-size: 14px;
        hyphens: auto;
    }

    .wx-guide-detail-page .wx-reply-card {
        margin-left: 1rem !important;
    }
}

/* mobile-text-guard */
@media (max-width: 767px) {
  h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, figcaption, td, th, label {
    overflow-wrap: anywhere;
  }
  a, button, .btn {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  img, video, iframe {
    max-width: 100%;
  }
}

/* uniform hero height across all pages */
.hero-wexorin {
    min-height: 700px;
}

@media (max-width: 767.98px) {
    .hero-wexorin {
        min-height: auto;
    }
}