/* ============================================================
   幼十二 · 官网  |  主题层 V1「东方节律」
   ------------------------------------------------------------
   配色依据：品牌手册「幼」源自《道德经》、「十二」源自十二地支，
             并以「十二时辰 / 十二节气」为时间契约 → 墨绿 + 香槟金 + 暖米白。
   作用域：只定义变量与组件颜色，不改页面结构；整层替换即换肤。
   ✅ 全站文字对比度已按 WCAG AA 校验（正文 ≥4.5、大字 ≥3.0）
   ============================================================ */

:root{
  /* 主色系（东方节律） */
  --brand:        #2f5d4e;   /* 临床墨绿 · 主色 */
  --brand-d:      #24463b;   /* 深一档 · 悬浮/按钮 */
  --brand-l:      #eaf0ec;   /* 极浅 · 选中态底 */

  /* 点缀（香槟金） */
  --gold:         #7d5f20;   /* 暗金 · 可用于小字（on 米白 5.56 / on 浅米 5.10 / on 白 5.95） */
  --gold-l:       #c8a25c;   /* 亮金 · 仅装饰/描边，不做小字（对比 2.24） */
  --gold-bg:      #f4ecdc;   /* 金色浅底 */

  /* 中性 */
  --ink:          #241f1a;   /* 正文（on 米白 15.26） */
  --ink-2:        #4a5f56;   /* 次级正文（on 米白 6.41） */
  --ink-3:        #6b6255;   /* 辅助说明（on 米白 5.60 / on #f2ede2 5.13） */
  --bg:           #faf7f0;   /* 暖米白 · 页面底 */
  --bg-2:         #f2ede2;   /* 浅米 · 区块底 */
  --bg-3:         #ffffff;   /* 卡片底 */
  --line:         #e2d8c6;   /* 描边 */
  --line-2:       #efe8db;   /* 浅描边 */

  /* 深底上的文字 */
  --on-brand:     #faf7f0;   /* on #2f5d4e 7.02 */
  --on-brand-2:   #e8d9b8;   /* on #2f5d4e 5.38 */

  --ok:           #2f6b45;
  --warn:         #8a6216;
}

/* ---------------- 基础 ---------------- */
body{background:var(--bg);color:var(--ink)}
a{color:var(--brand)}
a:hover{color:var(--brand-d)}
:focus-visible{outline:2.5px solid var(--brand);outline-offset:2px;border-radius:3px}
.skip{background:var(--brand);color:var(--on-brand)}
::selection{background:var(--brand);color:var(--on-brand)}

/* ---------------- 页头 ---------------- */
.site-header{background:rgba(250,247,240,.94);border-bottom:1px solid var(--line);
  backdrop-filter:saturate(160%) blur(9px)}
.brand{color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand-mark{color:var(--brand)}
.brand-text{color:var(--ink)}
.brand-text em{color:var(--ink-3)}
.site-nav a{color:var(--ink-2)}
.site-nav a:hover{background:var(--bg-2);color:var(--brand)}
.site-nav a.active{color:var(--brand);background:var(--brand-l);font-weight:600}
.site-nav .nav-cta a{background:var(--brand);color:var(--on-brand)}
.site-nav .nav-cta a:hover{background:var(--brand-d);color:var(--on-brand)}
.nav-toggle{border:1px solid var(--line);background:var(--bg-3)}
.nav-toggle i{background:var(--ink-2)}

/* ---------------- 面包屑 ---------------- */
.crumbs{color:var(--ink-3)}
.crumbs a{color:var(--ink-3)}
.crumbs a:hover{color:var(--brand)}

/* ---------------- Hero ---------------- */
.hero{background:linear-gradient(178deg,#f6f1e6 0%,var(--bg) 62%)}
.hero h1{color:var(--ink)}
.hero .h1-sub{color:var(--ink-2)}
.hero h1 strong{color:var(--brand);font-weight:700}
.btn-primary{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.btn-primary:hover{background:var(--brand-d);border-color:var(--brand-d);color:var(--on-brand)}
.btn-ghost{color:var(--brand);border-color:var(--brand);background:transparent}
.btn-ghost:hover{background:var(--brand);color:var(--on-brand)}
.hero-kpis b{color:var(--brand)}
.hero-kpis span{color:var(--ink-3)}
.hero-kpis div+div{border-left:1px solid var(--line);padding-left:26px}
.hero-cap{color:var(--ink-3)}

/* ---------------- 区块 ---------------- */
.section{background:transparent}
.section.alt{background:var(--bg-2)}
.section.paper{background:var(--bg-3)}
.eyebrow{color:var(--gold)}
h2.sec-title{color:var(--ink)}
.sec-desc{color:var(--ink-2)}
h3{color:var(--ink)}
.lead{color:var(--ink-2)}

/* ---------------- 卡片 ---------------- */
.card{background:var(--bg-3);border:1px solid var(--line-2)}
.card .idx{color:var(--gold)}
.card p{color:var(--ink-2)}

/* 四阶节律 */
.stage{background:var(--bg-3);border:1px solid var(--line-2)}
.stage:nth-child(odd){background:var(--bg-3)}
.stage-badge{background:var(--brand-l);color:var(--brand-d)}
.stage-badge b{color:var(--brand-d)}
.stage-badge span{color:var(--brand)}
.stage-body h3{color:var(--ink)}
.stage-method{color:var(--gold)}
.stage-body p{color:var(--ink-2);font-size:14px}
.stage-targets li{background:var(--bg-2);color:var(--ink-2);border:1px solid var(--line-2)}
.stage-meta{color:var(--ink-3)}
.stage-meta dt{color:var(--ink-2)}

/* 产品 */
.prod{background:var(--bg-3);border:1px solid var(--line-2)}
.prod .p-cat{color:var(--gold)}
.prod h3{color:var(--ink)}
.prod .p-sub{color:var(--brand)}
.prod .p-sum{color:var(--ink-2)}
.prod .p-pat{color:var(--ink-3);border-top:1px solid var(--line-2)}
.prod details summary{color:var(--brand)}
.prod details li{color:var(--ink-2)}
.cat-tabs a{background:var(--bg-3);border:1px solid var(--line);color:var(--ink-2)}
.cat-tabs a:hover,.cat-tabs a.on{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}

/* 信任条 */
.trust{background:var(--line-2)}
.trust div{background:var(--bg-3)}
.trust b{color:var(--brand)}
.trust span{color:var(--ink-3)}

/* 时间轴 */
.timeline li::before{background:var(--brand)}
.timeline li::after{background:var(--line)}
.timeline .t-date{color:var(--gold)}
.timeline .t-title{color:var(--ink)}
.timeline .t-body{color:var(--ink-2)}

/* FAQ */
details.faq{background:var(--bg-3);border:1px solid var(--line-2)}
details.faq summary{color:var(--ink)}
details.faq summary::after{color:var(--brand)}
details.faq[open]{border-color:var(--line)}
details.faq[open] summary{background:var(--brand-l);color:var(--brand-d)}
details.faq .a{color:var(--ink-2)}
.faq-group > h3{color:var(--gold-d,var(--gold))}

/* 媒体报道 */
.media-item{background:var(--bg-3);border:1px solid var(--line-2)}
.media-item:hover{border-color:var(--line);background:#fdfbf6}
.media-item h3{color:var(--ink)}
.media-item .m-meta{color:var(--ink-3)}
.media-item .m-go{color:var(--brand)}

/* 资质 */
.honor{background:var(--bg-3);border:1px solid var(--line-2)}
.honor .h-no{background:var(--brand-l);color:var(--brand-d)}
.honor h3{color:var(--ink)}
.honor p{color:var(--ink-3)}

/* 联系 */
.contact-card{background:var(--bg-3);border:1px solid var(--line-2)}
.contact-card dt{color:var(--gold)}
.contact-card dd{color:var(--ink-2)}
.form-row label{color:var(--ink-2)}
.form-row input,.form-row select,.form-row textarea{
  background:var(--bg-3);border-color:var(--line);color:var(--ink)
}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{
  border-color:var(--brand);outline:none;box-shadow:0 0 0 3px var(--brand-l)
}
.form-note{color:var(--ink-3)}
.form-ok{background:var(--brand-l);color:var(--brand-d);border:1px solid #c8dbcf}

/* prose */
.prose p,.prose li{color:var(--ink-2)}
.prose h2,.prose h3{color:var(--ink)}

/* CTA 带 */
.cta-band{background:var(--brand)}
.cta-band h2{color:var(--on-brand)}
.cta-band p{color:var(--on-brand-2);font-size:14.5px;margin-top:8px}
.cta-band .btn-primary{background:var(--on-brand);color:var(--brand-d);border-color:var(--on-brand)}
.cta-band .btn-primary:hover{background:#fff;color:var(--brand-d)}
.cta-band .btn-ghost{border-color:var(--on-brand-2);color:var(--on-brand)}
.cta-band .btn-ghost:hover{background:var(--on-brand);color:var(--brand-d)}

/* 提示框 */
.note{background:var(--bg-2);border-left:3px solid var(--gold-l);color:var(--ink-2)}
.note b{color:var(--ink)}

/* 页脚 */
.site-footer{background:#1f2a26;border-top:3px solid var(--brand)}
.site-footer .f-name{color:#f2ece0}
.site-footer .f-slogan{color:var(--gold-l)}
.site-footer .f-desc{color:#b9b3a6}
.site-footer .f-h{color:#cdbfa0}
.site-footer .f-col a{color:#c9c2b4}
.site-footer .f-col a:hover{color:#f2ece0}
.site-footer .f-k{color:#9a9488}
.site-footer .f-v{color:#d8d2c4}
.footer-base{border-top:1px solid #33403a}
.footer-base p{color:#9a9488}
.f-links a{color:#b9b3a6}
.site-footer .tbd{background:#3a3226;color:#e8c98a;border-color:#8a6a28}

/* 待补标签（主题色统一） */
.tbd{background:#f7e9c8;color:#7a5a12;border:1px dashed #b98f2e}

/* ---------------- 移动端导航层 ---------------- */
@media (max-width:760px){
  .site-nav{background:var(--bg);border-top:1px solid var(--line)}
}