/* ==========================================================================
   LITCN.com — Twenty-One 主题全站视觉统一（现代渐变紫蓝）
   --------------------------------------------------------------------------
   加载方式：includes/head.tpl 中的 {assetExists file="custom.css"} 自动引入，
   位于 theme.min.css 之后，因此可安全覆盖官方硬编码色值。
   请勿直接修改 all.min.css / theme.min.css，升级 WHMCS 时不会被覆盖。
   版本：2026-11-02c（页头背景统一为浅色 + 客户中心文字/按钮对比度统一）
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 设计令牌
   -------------------------------------------------------------------------- */
:root {
    --lit-primary:       #5b4fe9;
    --lit-primary-dark: #4639cf;
    --lit-primary-soft: #eeebff;
    --lit-blue:         #3d7df6;
    --lit-cyan:         #22b8f0;
    --lit-ink:          #221c46;
    --lit-text:         #3c4055;
    --lit-muted:        #7b8098;
    --lit-line:         #eae7f8;
    --lit-surface:      #f7f8fd;
    --lit-grad:         linear-gradient(120deg, #6d5dfc 0%, #4a6ff0 52%, #22a9e8 100%);
    --lit-grad-hover:   linear-gradient(120deg, #5b4ae8 0%, #3a5fe0 52%, #1a93d6 100%);
    --lit-grad-dark:    linear-gradient(110deg, #241c56 0%, #3f2fa8 42%, #3a72e8 100%);
    --lit-radius:       14px;
    --lit-shadow:       0 6px 22px rgba(38, 30, 100, .07);
    --lit-shadow-hover: 0 14px 34px rgba(56, 42, 160, .16);
    --lit-font:         "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
                        "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
                        "Noto Sans CJK SC", "Source Han Sans SC", "WenQuanYi Micro Hei",
                        Arial, sans-serif;
}

/* --------------------------------------------------------------------------
   2. 字体与基础排版
   -------------------------------------------------------------------------- */
html { -webkit-text-size-adjust: 100%; }

body,
body.primary-bg-color {
    font-family: var(--lit-font) !important;
    background-color: var(--lit-surface);
    color: var(--lit-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--lit-ink);
    font-weight: 700;
    letter-spacing: -.01em;
}

a { color: var(--lit-primary); transition: color .18s ease; }
a:hover, a:focus { color: var(--lit-primary-dark); text-decoration: none; }
p { line-height: 1.8; }
::selection { background: #cdc4ff; color: var(--lit-ink); }

/* --------------------------------------------------------------------------
   3. 主色覆盖（官方 theme.min.css 把 #336699 硬编码在 38 处）
   -------------------------------------------------------------------------- */
.btn-primary {
    color: #fff;
    background-color: var(--lit-primary);
    background-image: var(--lit-grad);
    border-color: transparent;
    border-radius: 10px;
    box-shadow: 0 4px 14px rgba(91, 79, 233, .22);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus {
    color: #fff;
    background-color: var(--lit-primary-dark);
    background-image: var(--lit-grad-hover);
    border-color: transparent;
    box-shadow: 0 8px 22px rgba(91, 79, 233, .34);
    transform: translateY(-1px);
}
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--lit-primary-dark);
    background-image: var(--lit-grad-hover);
    border-color: transparent;
    transform: none;
}
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(109, 93, 252, .35) !important;
}
.btn-primary.disabled,
.btn-primary:disabled { opacity: .6; box-shadow: none; transform: none; }

/* --------------------------------------------------------------------------
   3b. 统一「立即购买 / 下单」按钮（原 Bootstrap 绿色 .btn-success）
       全站购买类按钮统一为品牌渐变紫蓝：白字加粗、提高对比度与点击区域。
       注：首屏域名搜索框内的「转入域名」按钮，由后面更高特异性的
       .home-domain-search .input-group-wrapper .btn-success 保留撞色，
       用于区分「查询域名」与「转入域名」两个不同动作。
   -------------------------------------------------------------------------- */
.btn-success,
.btn-success.btn-sm,
.btn-success.btn-lg,
.btn-success.btn-block {
    color: #fff;
    background-color: var(--lit-primary);
    background-image: var(--lit-grad);
    border-color: transparent;
    border-radius: 10px;
    font-weight: 700;
    letter-spacing: .02em;
    box-shadow: 0 4px 14px rgba(91, 79, 233, .22);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.btn-success:hover,
.btn-success:focus,
.btn-success.focus {
    color: #fff;
    background-color: var(--lit-primary-dark);
    background-image: var(--lit-grad-hover);
    border-color: transparent;
    box-shadow: 0 8px 22px rgba(91, 79, 233, .34);
    transform: translateY(-1px);
}
.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
    color: #fff;
    background-color: var(--lit-primary-dark);
    background-image: var(--lit-grad-hover);
    border-color: transparent;
    transform: none;
}
.btn-success:focus,
.btn-success.focus,
.btn-success:not(:disabled):not(.disabled):active:focus,
.show > .btn-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(109, 93, 252, .35) !important;
}
.btn-success.disabled,
.btn-success:disabled { opacity: .6; box-shadow: none; transform: none; }

/* WHMCS 自带营销落地页的「立即购买」按钮类名不统一，按语义一并统一：
   .order-btn / .order-button / .btn-order-now / .btn-checkout /
   .btn-add-to-cart / .buy-btn .btn（下单表单按钮，JS 事件也绑定这些类） */
.order-btn,
.order-button,
.btn-order-now,
.btn-checkout,
.btn-add-to-cart,
.buy-btn .btn {
    color: #fff;
    background-color: var(--lit-primary);
    background-image: var(--lit-grad);
    border-color: transparent;
    border-radius: 10px;
    font-weight: 700;
    letter-spacing: .02em;
    text-shadow: 0 1px 2px rgba(20, 14, 60, .38);
    box-shadow: 0 4px 14px rgba(91, 79, 233, .22);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.order-btn:hover,
.order-button:hover,
.btn-order-now:hover,
.btn-checkout:hover,
.btn-add-to-cart:hover,
.buy-btn .btn:hover,
.order-btn:focus,
.order-button:focus,
.btn-order-now:focus,
.btn-checkout:focus,
.btn-add-to-cart:focus,
.buy-btn .btn:focus {
    color: #fff;
    background-image: var(--lit-grad-hover);
    border-color: transparent;
    box-shadow: 0 8px 22px rgba(91, 79, 233, .34);
    transform: translateY(-1px);
}
.order-btn.disabled,
.order-button.disabled,
.btn-order-now.disabled,
.btn-checkout.disabled,
.btn-add-to-cart.disabled,
.buy-btn .btn.disabled,
.buy-btn .btn:disabled { opacity: .6; box-shadow: none; transform: none; }

.btn-outline-primary {
    color: var(--lit-primary);
    border-color: var(--lit-primary);
    border-radius: 10px;
    background: transparent;
    transition: all .18s ease;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active {
    color: #fff;
    background-color: var(--lit-primary);
    background-image: var(--lit-grad);
    border-color: transparent;
    box-shadow: 0 6px 18px rgba(91, 79, 233, .24);
}
.btn-outline-primary:focus,
.btn-outline-primary.focus { box-shadow: 0 0 0 .2rem rgba(109, 93, 252, .28); }
.btn-outline-primary.disabled,
.btn-outline-primary:disabled { opacity: .55; }

.btn-link,
.btn-link:hover,
.btn-link:focus { color: var(--lit-primary); }
.btn-default {
    color: var(--lit-primary);
    background-color: #f2f0ff;
    border-color: #e4dffc;
    border-radius: 10px;
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active {
    color: var(--lit-primary-dark);
    background-color: #e8e3ff;
    border-color: #d3c9fb;
}

.text-primary   { color: var(--lit-primary) !important; }
.bg-primary      { background-color: var(--lit-primary) !important; background-image: var(--lit-grad) !important; }
.border-primary  { border-color: var(--lit-primary) !important; }
.badge-primary   { background-color: var(--lit-primary); background-image: var(--lit-grad); }
.alert-primary   { background-color: #f1efff; border-color: #dcd5ff; color: #3a2f8f; }
.list-group-item-primary { background-color: #f1efff; color: #3a2f8f; }
.progress-bar    { background-color: var(--lit-primary); background-image: var(--lit-grad); }
.custom-control-input:checked ~ .custom-control-label::before { border-color: var(--lit-primary); background-color: var(--lit-primary); }
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before { background-image: var(--lit-grad); }
.custom-switch .custom-control-input:checked ~ .custom-control-label::before { background-color: var(--lit-primary); border-color: var(--lit-primary); }

.form-control:focus,
.custom-select:focus,
.input-group > .form-control:focus {
    border-color: #9c8ffb;
    box-shadow: 0 0 0 .2rem rgba(109, 93, 252, .16);
}
.form-control,
.custom-select { border-radius: 10px; border-color: #e2e0ef; }

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link { background-color: var(--lit-primary); background-image: var(--lit-grad); }
.dropdown-item.active,
.dropdown-item:active,
header.header .dropdown-item.active,
header.header .dropdown-item:active { background-color: var(--lit-primary); background-image: var(--lit-grad); color: #fff; }
.page-link { color: var(--lit-primary); }
.page-link:hover { color: var(--lit-primary-dark); }
.page-item.active .page-link {
    color: #fff;
    background-color: var(--lit-primary);
    background-image: var(--lit-grad);
    border-color: transparent;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--lit-grad) !important;
    color: #fff !important;
    border-color: transparent !important;
}

/* --------------------------------------------------------------------------
   4. 页头 / 导航
   -------------------------------------------------------------------------- */
header.header {
    background-color: #fff;
    box-shadow: 0 2px 20px rgba(30, 24, 84, .07);
}
/* 页头四条栏统一为浅色系，仅用细边框分隔层级，避免深蓝/白/渐变来回跳 */
header.header .topbar {
    background: var(--lit-surface);
    color: #5a5d75;
    padding: 4px 0;
    border-bottom: 1px solid var(--lit-line);
}
header.header .topbar .btn { color: #4a4763; }
header.header .topbar .btn:hover,
header.header .topbar .btn:focus { color: var(--lit-primary); }
header.header .topbar .input-group-text { background: #fff; border-color: #e4e1f4; color: #5a5d75; }
header.header .topbar .btn-active-client { background: #fff; color: var(--lit-primary-dark); border: 1px solid #e4e1f4; font-weight: 600; }

.navbar-light .navbar-brand { padding: .35rem 0; }
.logo-img { max-height: 52px; width: auto; height: auto; }
.navbar.navbar-light { padding-top: .65rem; padding-bottom: .65rem; }

.navbar-light .navbar-nav .nav-link { color: #41465c; font-weight: 600; border-radius: 8px; }
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus { color: var(--lit-primary); background: var(--lit-primary-soft); }
.navbar-light .navbar-nav .active > .nav-link { color: var(--lit-primary); }

.main-navbar-wrapper { border-top: 1px solid #f0eefb; }
.main-navbar-wrapper .navbar-nav .nav-link { padding-top: .7rem; padding-bottom: .7rem; }
.dropdown-menu {
    border: 1px solid var(--lit-line);
    border-radius: 12px;
    box-shadow: var(--lit-shadow-hover);
    padding: .4rem;
}
.dropdown-item { border-radius: 8px; padding: .5rem .75rem; }
.dropdown-item:hover { background: var(--lit-primary-soft); color: var(--lit-primary-dark); }

.cart-btn { border-radius: 10px !important; }
.cart-btn .badge-info { background-color: var(--lit-primary); background-image: var(--lit-grad); }

/* 五大主营业务快捷导航（header.tpl 新增）
   背景与主导航栏统一为白色浅色系，不再使用深色渐变横幅。 */
.lit-biz-nav {
    background: #fff;
    border-top: 1px solid var(--lit-line);
    border-bottom: 1px solid var(--lit-line);
    position: relative;
    overflow: hidden;
}
.lit-biz-nav::after {
    content: "";
    position: absolute;
    right: -80px; top: -120px;
    width: 300px; height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(109, 93, 252, .07), transparent 65%);
    pointer-events: none;
}
.lit-biz-nav .container { position: relative; z-index: 1; }
.lit-biz-nav-list {
    display: flex;
    align-items: center;
    gap: .35rem;
    list-style: none;
    margin: 0;
    padding: .45rem 0;
}
.lit-biz-nav-list li { flex: 0 0 auto; }
.lit-biz-nav-list a {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .4rem .9rem;
    border-radius: 999px;
    color: #45425f;
    font-size: .9rem;
    font-weight: 600;
    white-space: nowrap;
    transition: background .18s ease, color .18s ease;
}
.lit-biz-nav-list a i { color: var(--lit-primary); font-size: .85rem; opacity: .9; }
.lit-biz-nav-list a:hover,
.lit-biz-nav-list a:focus { color: var(--lit-primary-dark); background: var(--lit-primary-soft); }
.lit-biz-nav-list .lit-biz-nav-label {
    color: #8a86a3;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    margin-right: .35rem;
    white-space: nowrap;
}

/* --------------------------------------------------------------------------
   5. 首屏域名搜索 Hero（includes/domain-search.tpl）
   -------------------------------------------------------------------------- */
.home-domain-search.lit-hero {
    position: relative;
    overflow: hidden;
    color: #fff;
    background: linear-gradient(125deg, #1d1650 0%, #3a2c9e 40%, #3f6ef0 75%, #22a9e8 100%);
}
.lit-hero::before {
    content: "";
    position: absolute;
    left: -140px; bottom: -220px;
    width: 520px; height: 520px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(120, 100, 255, .42), transparent 65%);
    pointer-events: none;
}
.lit-hero::after {
    content: "";
    position: absolute;
    right: -100px; top: -180px;
    width: 460px; height: 460px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(34, 185, 240, .35), transparent 65%);
    pointer-events: none;
}
.home-domain-search.lit-hero .container { position: relative; z-index: 1; }
.lit-hero-eyebrow {
    display: inline-block;
    margin-bottom: .9rem;
    padding: .35rem 1rem;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 999px;
    background: rgba(255, 255, 255, .1);
    color: #fff;
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .1em;
}
.home-domain-search.lit-hero h2 {
    margin: 0 0 .6rem;
    color: #fff;
    font-size: 2.15rem;
    font-weight: 700;
    letter-spacing: -.02em;
}
.lit-hero-sub {
    margin: 0 auto 1.6rem;
    max-width: 640px;
    color: rgba(255, 255, 255, .84);
    font-size: 1.02rem;
    line-height: 1.8;
}
.lit-hero-trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .6rem 1.6rem;
    margin: 1.4rem 0 .3rem;
    padding: 0;
    list-style: none;
    color: rgba(255, 255, 255, .88);
    font-size: .88rem;
}
.lit-hero-trust li { display: inline-flex; align-items: center; gap: .45rem; }
.lit-hero-trust i { color: #9ff0d2; }

.home-domain-search .input-group-wrapper {
    margin: 1.4rem auto .9rem;
    max-width: 760px;
    padding: 8px;
    background-color: #fff;
    border: 0;
    border-radius: 999px;
    box-shadow: 0 18px 44px rgba(8, 6, 45, .3);
}
.home-domain-search .input-group-wrapper .input-group { border-radius: 999px; overflow: hidden; }
.home-domain-search .input-group-wrapper .form-control {
    border: 0;
    border-radius: 999px;
    padding: .85rem 1.4rem;
    font-size: 1.1rem;
    color: var(--lit-ink);
}
.home-domain-search .input-group-wrapper .form-control::placeholder { color: #a4a7bb; }
.home-domain-search .input-group-wrapper .btn {
    margin: 0 2px !important;
    border-radius: 999px !important;
    padding: .8rem 1.9rem;
    font-weight: 600;
}
.home-domain-search .input-group-wrapper .btn-success {
    background-color: #1e9e77;
    background-image: linear-gradient(120deg, #17b98a, #1e88d8);
    border-color: transparent;
}
.home-domain-search .input-group-wrapper .btn-success:hover { filter: brightness(1.08); color: #fff; }

.home-domain-search .tld-logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .6rem;
    margin: 1.3rem 0 .4rem;
    padding: 0;
    list-style: none;
    color: #fff;
    font-size: .92rem;
    font-weight: 400;
}
.home-domain-search .tld-logos li {
    float: none;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .4rem .9rem;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(6px);
}
.home-domain-search .tld-logos img { width: 34px; height: auto; filter: brightness(0) invert(1); opacity: .92; }
.home-domain-search .btn-link { color: #fff; opacity: .9; }
.home-domain-search .btn-link:hover { color: #fff; opacity: 1; }

/* --------------------------------------------------------------------------
   6. 首页产品卡片（homepage.tpl 结构保持不变，仅视觉升级）
   -------------------------------------------------------------------------- */
.card-columns.home .card {
    border: 1px solid var(--lit-line);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--lit-shadow);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card-columns.home .card::before {
    content: "";
    display: block;
    height: 4px;
    background: var(--lit-grad);
}
.card-columns.home .card:hover {
    transform: translateY(-5px);
    border-color: #d5cdfb;
    box-shadow: var(--lit-shadow-hover);
}
.card-columns.home .card-body { padding: 2rem 1.4rem !important; }
.card-columns.home .card-title { color: var(--lit-ink); font-weight: 700; }
.card-columns.home .card-body p { color: var(--lit-muted); }
.card-columns.home .btn-outline-primary { margin-top: .5rem; }

/* --------------------------------------------------------------------------
   7. 内容区通用组件
   -------------------------------------------------------------------------- */
.primary-content .card,
.primary-content .mc-promo-manage,
.primary-content .mc-promo-login,
.sidebar .card {
    border: 1px solid var(--lit-line);
    border-radius: var(--lit-radius);
    box-shadow: var(--lit-shadow);
}
.card-header,
.panel-heading {
    background: linear-gradient(90deg, #faf9ff, #f3f7ff);
    border-bottom: 1px solid var(--lit-line);
    border-top-left-radius: var(--lit-radius) !important;
    border-top-right-radius: var(--lit-radius) !important;
    font-weight: 600;
    color: var(--lit-ink);
}
.sidebar .list-group-item.active,
.sidebar .list-group-item.active:hover,
.sidebar .list-group-item.active:focus {
    background-color: var(--lit-primary);
    background-image: var(--lit-grad);
    border-color: transparent;
    color: #fff;
}
.sidebar .list-group-item { border-color: var(--lit-line); }
.sidebar .list-group-item:hover { background: var(--lit-primary-soft); }

.master-breadcrumb {
    background: linear-gradient(90deg, #f6f4ff, #eef4ff);
    border-bottom: 1px solid #e9e5fb;
}
.master-breadcrumb .breadcrumb-item a { color: var(--lit-primary); }
.master-breadcrumb .breadcrumb-item.active { color: var(--lit-muted); }
.master-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: #aaa4c9; }

.table thead th {
    background: #f7f6ff;
    color: #3b365e;
    border-bottom: 2px solid #e4defb;
    font-weight: 600;
}
.table-list > tbody > tr:hover > td { background-color: #f7f5ff; }
.table > tbody > tr > td,
.table > tbody > tr > th { border-top-color: #f0eefb; }

.alert { border-radius: 12px; border-width: 1px; }
.alert-info    { background: #eef4ff; border-color: #d6e5ff; color: #2b4f8f; }
.alert-success{ background: #edfbf5; border-color: #cdeedd; color: #1c7a55; }
.alert-warning { background: #fff8e9; border-color: #f8e5b9; color: #8a6214; }
.alert-danger  { background: #fff0f0; border-color: #f7d4d4; color: #a63b3b; }

.modal-content { border: 0; border-radius: 16px; box-shadow: 0 20px 60px rgba(24, 18, 70, .22); }
.modal-header { border-bottom: 1px solid var(--lit-line); }
.modal-footer { border-top: 1px solid var(--lit-line); }
.popover { border-radius: 12px; border-color: var(--lit-line); box-shadow: var(--lit-shadow-hover); }

.login-form .card,
.clientregister .card {
    border: 1px solid var(--lit-line);
    border-radius: 18px;
    box-shadow: 0 12px 36px rgba(30, 24, 84, .09);
}
.input-group-text { background: #f7f6ff; border-color: #e2e0ef; color: var(--lit-primary); }

/* --------------------------------------------------------------------------
   8. 页脚（footer.tpl 内联样式已迁移至此）
   -------------------------------------------------------------------------- */
#footer {
    background: linear-gradient(160deg, #1b1738 0%, #221d4b 55%, #1b2447 100%);
    color: #b7b9d6;
    padding: 3.2rem 0 1.4rem;
}
#footer .footer-title {
    color: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    margin-bottom: 1.15rem;
    position: relative;
    padding-bottom: .65rem;
}
#footer .footer-title::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 34px; height: 3px;
    border-radius: 3px;
    background: var(--lit-grad);
}
#footer .footer-title.text-center::after { left: 50%; transform: translateX(-50%); }
#footer .footer-intro { color: #b7b9d6; font-size: .88rem; line-height: 1.95; margin-bottom: 1rem; }
#footer .footer-links li { margin-bottom: .58rem; }
#footer .footer-links a { color: #b7b9d6; text-decoration: none; transition: color .18s ease, padding-left .18s ease; }
#footer .footer-links a:hover { color: #fff; padding-left: 4px; }
.footer-divider {
    border: 0;
    height: 1px;
    margin: 1.5rem 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .22), transparent);
}
#footer .copyright { color: #8d90ae; text-align: left !important; font-size: .88rem; line-height: 2.3; }
#footer .copyright a { color: #b7b9d6; }
.wechat-qr {
    width: 118px;
    height: 118px;
    object-fit: contain;
    background: #fff;
    border-radius: 10px;
    padding: 5px;
    border: 1px solid rgba(255, 255, 255, .2);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .28);
    display: inline-block;
}
#footer .payment-label { color: #8d90ae; font-size: .85rem; vertical-align: middle; }
#footer .payment-icon {
    color: #b7b9d6;
    font-size: 1.7rem;
    line-height: 1;
    vertical-align: middle;
    transition: color .2s ease, transform .2s ease;
}
#footer .payment-icon:hover { color: #fff; transform: translateY(-2px); }
#footer .payment-icon.fa-alipay { color: #1677ff; }
#footer .payment-icon.fa-weixin { color: #07c160; }
#footer .btn-language {
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .22);
    color: #dfe0f0;
    border-radius: 999px;
    padding: .5rem 1.15rem;
    font-size: .88rem;
    line-height: 1;
    transition: all .2s ease;
    display: inline-flex;
    align-items: center;
}
#footer .btn-language .iti-flag { margin-right: .5rem; }
#footer .btn-language .btn-language-text { white-space: nowrap; }
#footer .btn-language .btn-language-arrow { margin-left: .55rem; font-size: .7rem; opacity: .65; }
#footer .btn-language:hover { color: #fff; border-color: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .16); }
#footer .list-inline { display: block; text-align: center; margin: 0; }
#footer .list-inline .list-inline-item { margin: 0 .35rem; }
#footer .list-inline a { color: #b7b9d6; font-size: 1.12rem; }
#footer .list-inline a:hover { color: #fff; }
#footer .footer-badge {
    display: inline-block;
    margin-top: .9rem;
    padding: .35rem .9rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .2);
    color: #d8d5ff;
    font-size: .8rem;
}

/* --------------------------------------------------------------------------
   9. 关于我们（about.tpl 内联样式已迁移至此）
   -------------------------------------------------------------------------- */
#about-page { padding: 3.5rem 0 4rem; }
#about-page .about-hero { text-align: center; margin-bottom: 3rem; }
#about-page .about-hero h1 {
    font-weight: 800;
    margin-bottom: .8rem;
    background: var(--lit-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--lit-primary);
}
#about-page .about-hero p { color: var(--lit-muted); font-size: 1.08rem; max-width: 640px; margin: 0 auto; }
#about-page .about-copy p { font-size: 1.04rem; line-height: 1.95; color: #43465c; margin-bottom: 1.4rem; }
#about-page .about-stats {
    background: var(--lit-grad-dark);
    border-radius: 18px;
    padding: 2.4rem 1rem;
    margin: 3rem 0;
    box-shadow: 0 14px 34px rgba(48, 36, 140, .22);
}
#about-page .about-stats .stat-item { text-align: center; color: #fff; margin-bottom: 1.5rem; }
#about-page .about-stats .stat-number { font-size: 2.15rem; font-weight: 800; color: #fff; display: block; line-height: 1.2; }
#about-page .about-stats .stat-label { color: rgba(255, 255, 255, .78); font-size: .92rem; }
#about-page .about-services h2 { text-align: center; font-weight: 700; margin-bottom: 2.5rem; }
#about-page .service-card {
    text-align: center;
    padding: 2rem 1.3rem;
    border: 1px solid var(--lit-line);
    border-radius: 16px;
    height: 100%;
    background: #fff;
    box-shadow: var(--lit-shadow);
    transition: box-shadow .22s ease, transform .22s ease, border-color .22s ease;
}
#about-page .service-card:hover {
    border-color: #d2c9fb;
    box-shadow: var(--lit-shadow-hover);
    transform: translateY(-4px);
}
#about-page .service-card i {
    font-size: 1.9rem;
    margin-bottom: 1rem;
    background: var(--lit-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--lit-primary);
}
#about-page .service-card h5 { font-weight: 700; margin-bottom: .5rem; color: var(--lit-ink); }
#about-page .service-card p { color: var(--lit-muted); font-size: .9rem; margin: 0; }
#about-page .about-closing {
    text-align: center;
    max-width: 760px;
    margin: 3.5rem auto 0;
    font-size: 1.04rem;
    line-height: 1.95;
    color: #43465c;
}

/* --------------------------------------------------------------------------
   9b. 客户中心：文字对比度与按钮统一
   官方 clientareahome.tpl 的统计卡片标题是 #888 灰字（12px），
   卡片头按钮是「官方白字 + 本次 btn-default 浅紫底」，两者都几乎看不清。
   这里统一加深文字、把按钮改为品牌渐变白字。
   -------------------------------------------------------------------------- */

/* 首页统计快捷卡片：服务 / 域名 / 服务单 / 账单 */
.tiles .tile { background-color: #fff; border-right-color: var(--lit-line); }
.tiles .row > div:last-child .tile { border-right: 0; }
.tiles .tile .stat { color: var(--lit-primary); font-weight: 700; }
.tiles .tile .title {
    color: #3f3b5c;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: none;
}
.tiles .tile i { color: #d9d2fa; }
.tiles .tile:hover { background-color: #f8f6ff; }
.tiles .tile:hover i { color: #b9adf7; }
.tiles .tile .highlight {
    background-color: var(--lit-primary) !important;
    background-image: var(--lit-grad);
}

/* 卡片头「+ 新联系人」等按钮：修正白字 + 浅紫底的低对比度 */
.client-home-cards .card-header .btn,
.client-home-cards .card-header .btn:hover,
.client-home-cards .card-header .btn:focus {
    color: #fff;
    background-color: var(--lit-primary);
    background-image: var(--lit-grad);
    border-color: transparent;
    font-weight: 600;
    text-shadow: 0 1px 1px rgba(20, 14, 60, .25);
}
.client-home-cards .card-header .btn:hover { filter: brightness(1.07); }

/* 卡片内「详情」「查看更多…」等淡色链接统一为清晰品牌色 */
.client-home-cards a,
.client-home-cards a:hover { color: var(--lit-primary-dark); }
.client-home-cards .card-header .btn,
.client-home-cards .card-header .btn:hover { color: #fff; }
.client-home-cards small,
.client-home-cards .text-muted { color: #63667e !important; }

/* 侧栏菜单（我的服务 / 我的域名 …）与面包屑文字加深 */
.sidebar .list-group-item { color: #3f3b5c; font-weight: 600; }
.sidebar .list-group-item:hover { color: var(--lit-primary-dark); }
.master-breadcrumb .breadcrumb-item a { color: var(--lit-primary-dark); font-weight: 600; }
.master-breadcrumb .breadcrumb-item.active { color: #5a5d75; }

/* --------------------------------------------------------------------------
   10. 响应式
   -------------------------------------------------------------------------- */
@media (max-width: 991.98px) {
    .lit-biz-nav-list { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    .lit-biz-nav-list::-webkit-scrollbar { display: none; }
    .lit-biz-nav-list .lit-biz-nav-label { display: none; }
    .home-domain-search.lit-hero h2 { font-size: 1.75rem; }
}
@media (max-width: 767.98px) {
    .home-domain-search .input-group-wrapper { border-radius: 18px; }
    .home-domain-search .input-group-wrapper .btn { padding: .75rem 1.1rem; }
    .home-domain-search .tld-logos { font-size: .82rem; }
    #footer .copyright { text-align: center !important; }
}
@media (max-width: 575.98px) {
    .home-domain-search.lit-hero h2 { font-size: 1.45rem; }
    .lit-hero-sub { font-size: .92rem; }
    .lit-hero-trust { gap: .5rem 1rem; font-size: .8rem; }
    .home-domain-search .tld-logos li { padding: .35rem .7rem; }
    #about-page .about-stats .stat-number { font-size: 1.7rem; }
}

/* --------------------------------------------------------------------------
   11. 动效与无障碍
   -------------------------------------------------------------------------- */
:focus-visible { outline: 2px solid var(--lit-primary); outline-offset: 2px; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f2f1fa; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #8b7cf0, #4d8fe8); border-radius: 10px; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}