:root{ --sec-hero-h: 430px; }

/* 背景带本体 */
.sec-band{
    position:absolute; top:0; left:0; right:0; height:var(--sec-hero-h);
    overflow:hidden; z-index:0; pointer-events:none;
    background:linear-gradient(150deg,var(--theme-hero-bg-start,#0b1020) 0%,var(--theme-hero-bg-mid,#131a35) 52%,var(--theme-hero-bg-end,#171633) 100%);
}
.sec-band::before{
    content:''; position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size:24px 24px;
    -webkit-mask-image:radial-gradient(120% 80% at 50% 26%, #000 0%, rgba(0,0,0,.35) 55%, transparent 78%);
    mask-image:radial-gradient(120% 80% at 50% 26%, #000 0%, rgba(0,0,0,.35) 55%, transparent 78%);
}
/* 图形层（各板块在此叠自己的简单图形） */
.sec-band::after{ content:''; position:absolute; inset:0; }

/* 极淡的后缀水印：压到导航之下、更小更淡，只做氛围不当主体 */
.sec-band__word{
    position:absolute; display:none; font-weight:800; letter-spacing:-.03em;
    color:rgba(255,255,255,.032); font-size:104px; line-height:1; user-select:none;
}
.sec-band__word--1{ top:112px; left:3%; }
.sec-band__word--2{ bottom:44px; left:22%; font-size:84px; }
.sec-band__word--3{ top:138px; right:4%; font-size:96px; }
.sec-band__word--4{ bottom:78px; right:20%; font-size:68px; }

/* ===== 域名板块：地平弧 + 主题色光晕 + 后缀水印 ===== */
body.sec-domain .sec-band::after{
    background:
        radial-gradient(120% 62% at 50% 120%, rgba(124,58,237,.52), rgba(124,58,237,0) 62%),
        radial-gradient(58% 34% at 50% 116%, rgba(196,181,253,.20), rgba(196,181,253,0) 70%),
        radial-gradient(240px 240px at 9% 16%, rgba(249,115,22,.14), transparent 70%),
        radial-gradient(320px 320px at 91% 12%, rgba(76,50,223,.26), transparent 74%),
        radial-gradient(3px 3px at 22% 60%, rgba(255,255,255,.55), transparent 62%),
        radial-gradient(3px 3px at 68% 38%, rgba(255,255,255,.45), transparent 62%),
        radial-gradient(2.5px 2.5px at 83% 68%, rgba(255,255,255,.38), transparent 62%),
        radial-gradient(2.5px 2.5px at 38% 30%, rgba(255,255,255,.32), transparent 62%);
}
body.sec-domain .sec-band__word{ display:block; }
/* ===== 板块图形：域名市场（价格柱/成交节奏，暖橙调） ===== */
body.sec-market .sec-band::after{
    background:
        repeating-linear-gradient(90deg, rgba(255,255,255,.075) 0 10px, transparent 10px 44px),
        radial-gradient(60% 44% at 50% 110%, rgba(249,115,22,.26), transparent 70%),
        radial-gradient(300px 300px at 88% 14%, rgba(249,115,22,.14), transparent 72%);
    -webkit-mask-image:radial-gradient(120% 92% at 50% 98%, #000 0%, rgba(0,0,0,.45) 48%, transparent 80%);
    mask-image:radial-gradient(120% 92% at 50% 98%, #000 0%, rgba(0,0,0,.45) 48%, transparent 80%);
}
/* ===== 板块图形：工具（终端行 + 虚线块，青蓝调） ===== */
body.sec-tools .sec-band::after{
    background:
        repeating-linear-gradient(0deg, rgba(255,255,255,.055) 0 1px, transparent 1px 26px),
        repeating-linear-gradient(90deg, rgba(255,255,255,.10) 0 6px, transparent 6px 22px),
        radial-gradient(58% 40% at 62% 106%, rgba(56,189,248,.22), transparent 70%),
        radial-gradient(320px 320px at 14% 18%, rgba(76,50,223,.22), transparent 74%);
    -webkit-mask-image:radial-gradient(130% 90% at 50% 74%, #000 0%, rgba(0,0,0,.42) 52%, transparent 82%);
    mask-image:radial-gradient(130% 90% at 50% 74%, #000 0%, rgba(0,0,0,.42) 52%, transparent 82%);
}
/* ===== 板块图形：资源（文档叠层，绿调） ===== */
body.sec-resources .sec-band::after{
    background:
        repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 44px, transparent 44px 58px),
        radial-gradient(60% 42% at 38% 108%, rgba(16,185,129,.20), transparent 70%),
        radial-gradient(320px 320px at 86% 16%, rgba(124,58,237,.20), transparent 74%);
    -webkit-mask-image:radial-gradient(125% 92% at 46% 92%, #000 0%, rgba(0,0,0,.4) 50%, transparent 80%);
    mask-image:radial-gradient(125% 92% at 46% 92%, #000 0%, rgba(0,0,0,.4) 50%, transparent 80%);
}
/* ===== 板块图形：支持（对话气泡，紫粉调） ===== */
/* ===== 板块图形：通用（未归类页：账户/购物车外的前台页；紫罗兰底色 + 柔和弧光） ===== */
body.sec-general .sec-band::after{
    background:
        repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 56px),
        radial-gradient(58% 46% at 50% 110%, rgba(76,50,223,.30), transparent 70%),
        radial-gradient(420px 300px at 16% 12%, rgba(124,58,237,.20), transparent 74%),
        radial-gradient(360px 260px at 88% 22%, rgba(56,189,248,.12), transparent 74%);
    -webkit-mask-image:radial-gradient(130% 95% at 50% 78%, #000 0%, rgba(0,0,0,.45) 55%, transparent 84%);
    mask-image:radial-gradient(130% 95% at 50% 78%, #000 0%, rgba(0,0,0,.45) 55%, transparent 84%);
}
body.sec-support .sec-band::after{
    background:
        radial-gradient(420px 190px at 64% 38%, rgba(167,139,250,.20), transparent 72%),
        radial-gradient(360px 160px at 36% 64%, rgba(244,114,182,.14), transparent 72%),
        radial-gradient(58% 42% at 50% 108%, rgba(76,50,223,.26), transparent 70%);
    -webkit-mask-image:radial-gradient(130% 95% at 50% 60%, #000 0%, rgba(0,0,0,.45) 55%, transparent 84%);
    mask-image:radial-gradient(130% 95% at 50% 60%, #000 0%, rgba(0,0,0,.45) 55%, transparent 84%);
}

/* 地平弧环已移除：实测像一条杂线，层次改用底部辉光承担 */
/* 入口行之上的分界线 */
.sec-band__rule{
    position:absolute; left:50%; transform:translateX(-50%); bottom:104px;
    width:min(1080px,88vw); height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.16) 18%,rgba(255,255,255,.16) 82%,transparent);
    pointer-events:none;
}
/* 板块入口行（数据来自 SectionHubController::entryLinks，与板块总览页同源） */
.sec-band__links{
    position:absolute; left:50%; transform:translateX(-50%);
    top:calc(var(--sec-hero-h) - 88px); /* 文档坐标系：落在背景带底部区域内 */
    z-index:2; /* 高于 .pn-main(1)，且不在 .sec-band 层叠上下文内，才点得到 */
    display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
    gap:0; max-width:min(1080px,90vw); pointer-events:auto;
}
.sec-band__links a{
    color:rgba(255,255,255,.84); font-size:15px; font-weight:600; text-decoration:none;
    padding:4px 2px; border-radius:6px; white-space:nowrap; transition:color .16s;
}
.sec-band__links a:hover{ color:#fff; text-decoration:underline; text-underline-offset:4px; }
.sec-band__chev{ color:rgba(255,255,255,.34); font-size:15px; padding:0 10px; }

/* 页面头部正好填满背景带：带从页首 0 起，导航 73px 压在带内，
   所以头部高度 = 带高 - 导航高，内容在「导航之下、带底之上」垂直居中 */
body.has-band .pn-main{ padding-top:0; }
body.has-band .pn-page-header{
    min-height:calc(var(--sec-hero-h) - var(--nav-h, 98px) - var(--nav-top, 0px));
    padding:0; margin-bottom:0; color:#fff;
    display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:12px;
    /* 底部预留：给背景带里的入口行让位（否则按钮多时会压到入口行上） */
    padding-bottom:78px;
}
body.has-band .pn-page-header > div:first-child{ display:flex; flex-direction:column; align-items:center; }
body.has-band .pn-page-header .dd-breadcrumb{ justify-content:center; margin-bottom:4px; }
/* 排版按 Dynadot 内页首屏实测对齐：h1 45px/700/行高 48、副标题居中、下方一排入口 */
body.has-band .pn-page-header .pn-page-title{
    color:#fff; font-size:clamp(30px, 3.4vw, 44px); font-weight:800; letter-spacing:-.02em; line-height:1.12;
}
body.has-band .pn-page-header .pn-page-subtitle{
    color:rgba(255,255,255,.72); font-size:15px; line-height:1.7; margin:0 auto; max-width:58ch;
}
/* 行动入口：居中一行；主按钮保留品牌色实心，其余降为描边（对应 Dynadot 的"入口行"） */
body.has-band .pn-page-header .dd-btn-row{ display:flex; justify-content:center; align-items:center; gap:14px; margin-top:10px; flex-wrap:wrap; }
body.has-band .pn-page-header .dd-btn-row .dd-btn{ background:transparent; border:1px solid rgba(255,255,255,.38); color:#fff; font-weight:600; }
body.has-band .pn-page-header .dd-btn-row .dd-btn:hover{ border-color:rgba(255,255,255,.75); background:rgba(255,255,255,.08); }
body.has-band .pn-page-header .dd-btn-row .dd-btn-primary{ background:var(--theme-accent,#f97316); border-color:transparent; }
body.has-band .pn-page-header .dd-btn-row .dd-btn-primary:hover{ background:var(--theme-accent,#f97316); filter:brightness(.94); }
/* 按钮同行：.dd-btn 默认可能满宽，会把 .dd-btn-row 压成"一个按钮宽"从而换行 */
body.has-band .pn-page-header .dd-btn-row{ width:auto; max-width:100%; flex-wrap:nowrap; }
body.has-band .pn-page-header .dd-btn-row .dd-btn{ width:auto; flex:0 0 auto; }
body.has-band .pn-page-header .dd-breadcrumb,
body.has-band .pn-page-header .dd-breadcrumb a,
body.has-band .pn-page-header .dd-breadcrumb .sep{ color:rgba(255,255,255,.7); }
body.has-band .pn-page-header .dd-breadcrumb a:hover{ color:#fff; }
/* 面包屑「当前项」原本是深藏青，在暗底上几乎看不见 —— 一并改浅 */
body.has-band .pn-page-header .dd-breadcrumb .cur{ color:#fff; }
/* 首屏背景带与下方内容之间留白：加在页头自身的 margin-bottom 上。
   原来写成 \`.pn-page-header + *\`，但那几页的"下一个兄弟"是 <style> 元素（display:none），
   外边距加在隐藏元素上等于没有 → 工具页看不到留白。 */
body.has-band .pn-page-header{ margin-bottom:36px; } /* 留白改由页头自身 margin-bottom */

/* 汉堡按钮线条：原来是 --dd-ink（深藏青），压在深色背景带上完全看不清 —— 带内改白线
   菜单展开中(is-navactive)导航本就变深底，也保持白线；滚动后的白条则回落深色 */
body.has-band .dd-header .dd-hamburger{ border-color:rgba(255,255,255,.4); }
body.has-band .dd-header .dd-hamburger span{ background:#fff; }
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-hamburger{ border-color:var(--dd-line); }
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-hamburger span{ background:var(--dd-ink); }

/* 手机抽屉（.dd-mobile）内回落深色：上面给 .dd-pill 设的白字是给暗底导航用的，
   而抽屉是白底，白字会变成「看不见的登录按钮」 */
body.has-band .dd-header .dd-mobile .dd-pill,
body.has-band .dd-header .dd-mobile .dd-icon-btn,
body.has-band .dd-header .dd-mobile .dd-langsel-pill{
    color:var(--dd-ink); border-color:var(--dd-line); background:transparent;
}
body.has-band .dd-header .dd-mobile .dd-pill:hover{ background:var(--dd-tint); border-color:var(--dd-ink); }

/* 内容层压在带之上 */
.pn-main{ position:relative; z-index:1; }

/* 导航并入背景（与首页同口径）：顶部透明，向下滚动回实底 */
body.has-band .dd-header{ background:transparent; }
body.has-band .dd-nav{ background:transparent; border-bottom-color:transparent; }
body.has-band .dd-brand-text, body.has-band .dd-brand-mark{ color:#fff; }
body.has-band .dd-brand-img{ filter:brightness(0) invert(1); }
body.has-band .dd-menu-link{ color:rgba(255,255,255,.88); }
body.has-band .dd-menu-link:hover, body.has-band .dd-menu-item.is-open .dd-menu-link{ color:#fff; }
body.has-band .dd-langsel-pill, body.has-band .dd-icon-btn{ color:#fff; border-color:rgba(255,255,255,.26); }
body.has-band .dd-langsel-pill:hover, body.has-band .dd-icon-btn:hover{ border-color:rgba(255,255,255,.55); }
/* 登录 / 购物车（.dd-pill）原本也是深色，在暗底上对比不足 —— 给它们半透明浅底 + 亮描边 */
body.has-band .dd-pill{ color:#fff; border-color:rgba(255,255,255,.36); background:rgba(255,255,255,.07); }
body.has-band .dd-pill:hover{ background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.62); }
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-pill{ color:var(--dd-ink); border-color:var(--dd-line); background:transparent; }

/* 菜单展开中（is-navactive）：.dd-nav 会变成与面板同色的深底，
   此时必须整条导航回浅色文字，否则就是"深底 + 深字"看不见 */
body.has-band .dd-header.is-navactive .dd-brand-text,
body.has-band .dd-header.is-navactive .dd-brand-mark{ color:#fff; }
body.has-band .dd-header.is-navactive .dd-brand-img{ filter:brightness(0) invert(1); }
body.has-band .dd-header.is-navactive .dd-menu-link{ color:rgba(255,255,255,.9); }
body.has-band .dd-header.is-navactive .dd-menu-link:hover,
body.has-band .dd-header.is-navactive .dd-menu-item.is-open .dd-menu-link{ color:#fff; }
body.has-band .dd-header.is-navactive .dd-langsel-pill,
body.has-band .dd-header.is-navactive .dd-icon-btn,
body.has-band .dd-header.is-navactive .dd-pill{
    color:#fff; border-color:rgba(255,255,255,.36); background:transparent;
}
body.has-band .dd-header.is-navactive .dd-langsel-pill:hover,
body.has-band .dd-header.is-navactive .dd-icon-btn:hover,
body.has-band .dd-header.is-navactive .dd-pill:hover{
    border-color:rgba(255,255,255,.62); background:rgba(255,255,255,.10);
}
body.has-band .dd-header.is-scrolled{ background:#fff; box-shadow:0 8px 28px rgba(10,20,70,.08); }
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-brand-text,
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-brand-mark,
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-menu-link,
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-langsel-pill,
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-icon-btn{ color:var(--dd-ink); }
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-langsel-pill,
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-icon-btn{ border-color:var(--dd-line); }
body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-brand-img{ filter:none; }

@media (max-width:980px){
    :root{ --sec-hero-h: 300px; }
    .sec-band__word{ font-size:92px; }
    .sec-band__word--2, .sec-band__word--4{ display:none; }
}

/* ===== 手机版首屏整治（2026-09-26）：入口行占满宽度少行、按钮同行、水印下移缩小 ===== */
/* 深色模式下按键改透明 + 杠/× 改白色：
   暗色主题里有一条 :root[data-theme="dark"] .dd-hamburger span{background:#EAE6FF !important}（浅色杠），
   若按钮底仍是纯白（浅色模式那套），就成了"浅杠压白底"= 看不清。 */
@media (max-width:860px){
    :root[data-theme="dark"] body.has-band .dd-header .dd-pill,
    :root[data-theme="dark"] body.has-band .dd-header .dd-hamburger,
    :root[data-theme="dark"] body.has-band .dd-header .dd-langsel-pill{
        background:transparent; border-color:rgba(255,255,255,.45); color:#fff; box-shadow:none;
    }
    :root[data-theme="dark"] body.has-band .dd-header .dd-hamburger span{ background:#fff !important; }
    /* 深色模式下若导航条被滚成实底（is-scrolled），同样保持透明底 + 白杠 */
    :root[data-theme="dark"] body.has-band .dd-header.is-scrolled .dd-pill,
    :root[data-theme="dark"] body.has-band .dd-header.is-scrolled .dd-hamburger{
        background:transparent; border-color:rgba(255,255,255,.45); color:#fff;
    }
    :root[data-theme="dark"] body.has-band .dd-header.is-scrolled .dd-hamburger span{ background:#fff !important; }
}

/* ===== 手机端纯白按键：暗底上"透明底+白描边"不够清楚，改纯白底 + 深色图标（含汉堡/关闭的杠） ===== */
@media (max-width:860px){
    body.has-band .dd-header .dd-pill,
    body.has-band .dd-header .dd-hamburger,
    body.has-band .dd-header .dd-langsel-pill{
        background:#fff; border-color:#fff; color:var(--dd-ink);
        box-shadow:0 4px 14px rgba(10,20,70,.16);
    }
    body.has-band .dd-header .dd-pill:hover,
    body.has-band .dd-header .dd-hamburger:hover{ background:#fff; border-color:#fff; }
    /* 汉堡的三条杠 / 打开后的 × 都改深色（白底上才看得见） */
    body.has-band .dd-header .dd-hamburger span{ background:var(--dd-ink); }
    /* 反向情况：滚动后导航条本身变白 → 按键改回描边款，避免白上白 */
    body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-pill,
    body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-hamburger,
    body.has-band .dd-header.is-scrolled:not(.is-navactive) .dd-langsel-pill{
        background:#fff; border-color:var(--dd-line); box-shadow:none;
    }
}
@media (max-width:720px){
    :root{ --sec-hero-h: 380px; }

    /* 页头：收紧底部预留与行距，按钮同行（两个短按钮在 375 宽下并排完全放得下） */
    body.has-band .pn-page-header{ padding-bottom:56px; gap:8px; }
    body.has-band .pn-page-header .pn-page-subtitle{ font-size:14px; line-height:1.6; max-width:34ch; }
    body.has-band .pn-page-header .dd-btn-row{ flex-wrap:nowrap; gap:10px; margin-top:4px; }
    body.has-band .pn-page-header .dd-btn-row .dd-btn{ flex:0 0 auto; width:auto; height:40px; padding:0 16px; font-size:13.5px; }
    /* 手机端下方留白略大（同样加在页头自身的 margin-bottom 上） */
    body.has-band .pn-page-header{ margin-bottom:44px; }

    /* 入口行：必须给足宽度（原来 shrink-to-fit 只有 160px → 每个链接占一行共 4 行，还会溢出带底） */
    .sec-band__links{ width:min(1080px,92vw); top:calc(var(--sec-hero-h) - 62px); }
    .sec-band__links a{ font-size:13px; padding:3px 1px; }
    .sec-band__chev{ padding:0 5px; font-size:13px; }
    .sec-band__rule{ bottom:auto; top:calc(var(--sec-hero-h) - 92px); width:min(1080px,88vw); }

    /* 水印：只留两个、更小更淡，并压到带的下半部，不要压在标题/副标题上 */
    /* 手机端只留一个水印（原隐藏规则被 body.sec-domain .sec-band__word 的更高优先级压掉，这里用同优先级前缀） */
    body.sec-domain .sec-band__word{ display:none; }
    body.sec-domain .sec-band__word--1{ display:block; font-size:56px; color:rgba(255,255,255,.042); top:auto; bottom:24px; left:5%; }
}

/* ===== 入口行：手机端单行可滑（2026-09-26）=====
   原来 5 条链接在 320-375 会折成 2 行，视觉上偏乱；改为不换行 + 容器内横向滚动，
   页面本身不产生横向溢出。 */
@media (max-width:720px){
    .sec-band__links{
        flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden;
        -webkit-overflow-scrolling:touch; scrollbar-width:none;
        padding-bottom:2px;
    }
    .sec-band__links::-webkit-scrollbar{display:none}
    .sec-band__links a{flex:0 0 auto}
    .sec-band__links .sec-band__chev{flex:0 0 auto}
}

/* ===== 独立布局（legal / pages）：内容层必须抬到背景带之上 =====
   主布局靠 .pn-main{z-index:1} 把内容盖在带上；legal 布局没有 .pn-main，
   内容容器是 .legal-wrap（static、无 z-index）→ 会被 z-index:0 的带连同图形压住，
   表现为「页头白字被盖住、只剩几个分隔符」。这里补上同等的抬升，并去掉容器顶部内边距，
   让页头正好贴合导航下沿（与主布局几何一致）。 */
body.has-band .legal-wrap{ position:relative; z-index:1; padding-top:0; }

/* ══ dsh-hero-unify ══ 背景带页（support / status / sitemap）同样按首页首屏对齐：
   页头不再垂直居中，改为贴合内容 + 上 96 / 下 46；背景带高度随各页内容收敛。
   带高 = 导航 67 + 上内边距 29 + 内容高 + 下 46（各页内容实测 157 / 162 / 180）。 */
@media (max-width:720px){
    body.has-band .pn-page-header{
        min-height:0;
        justify-content:flex-start;
        padding-top:29px;      /* 96 - 导航 67 */
        padding-bottom:46px;
        margin-bottom:68px;    /* 首屏下方留白，与首页一致 */
    }
    body.sec-support{--sec-hero-h:299px}
    body.sec-status{--sec-hero-h:304px}
    body.sec-sitemap{--sec-hero-h:322px}
    /* 分隔线与入口行落进新的下留白区（46px 内：线 1px + 行 29px） */
    body.has-band .sec-band__rule{top:calc(var(--sec-hero-h) - 44px)}
    body.has-band .sec-band__links{top:calc(var(--sec-hero-h) - 40px)}
}


/* ══ dsh-hero-unify-2 ══ 修正：status 与 sitemap 共用 body.sec-general，
   取两者所需带高的较大值（326），保证内容不越过带底。 */
@media (max-width:720px){
    body.sec-general{--sec-hero-h:326px}
}