/* ═══════════════════════════════════════════════════════════════════
   迭代 21 · 11「带一件真事来」收口：把右边两块拼成一张名片，
                                     把落款条抬成整页最后一个重音
   ───────────────────────────────────────────────────────────────────
   先说清楚这一版**不动**什么：上一轮（qidian-cta.css）已经把这一节的
   底色、顶上那道金线、主 CTA 按钮、人像和码并排都做好了，那些是对的，
   一行不碰。这一版只修拍图量出来的两处真短板。

   ① 右边两块高度差一倍，看着是两件孤立的东西
      人像 350px 高、二维码那块 170px 高，`align-items:end` 只把它们的
      底边对齐，上半截空着 —— 右半边的视觉重心因此吊在左上角，
      二维码像是后来补上去的。改成两块等高，右边才是**一张名片**，
      不是一张照片旁边贴了个码。

   ② 全站唯一敢公开的价格，被排成了页脚小字
      「入企调研 · 公开参考价 5000 元 / 天」是这一页最硬的一句话 ——
      别人不敢写的它写了。可它现在 24px，压在 56px 的大标题下面、
      整节最底下，读到那儿人已经准备走了。
      这一版把落款条抬起来：加一层可见的地、上下收边、数字提到
      跟小标题一个量级，让整页最后一眼落在**能验证的事实**上，
      而不是落在空白上。

   一个字没改，一条链接没动。
   ═══════════════════════════════════════════════════════════════════ */

/* ── ① 人像 + 码 = 一张名片 ────────────────────────────────────

   🔴 第一版我把码那块拉到和人像等高（align-items:stretch），拍出来更糟：
   码只有 168px 见方，撑到 350px 高就成了一个中间飘着小方块的空框，
   比原来的「两块孤立」还难看。**等高只对两块内容量相当的东西成立**，
   照片配一枚码不属于这种。所以关系不靠等高建立，靠三件事：
   同一档金边、同一种内衬光、底边严格对齐 —— 再把码放大到撑得住它那半边。 */

html body .qcta2__who{
  align-items:end!important;
  grid-template-columns:minmax(0,1.18fr) minmax(0,1fr)!important}

html body .qcta2__who .qcta__qr{
  padding:clamp(16px,1.8vw,24px)!important;
  border:1px solid rgba(196,151,73,.26)!important;
  background:linear-gradient(180deg,var(--xh-bg4),var(--xh-bg3))!important;
  box-shadow:inset 0 1px 0 rgba(226,192,121,.06)}
html body .qcta2__who .qcta__qr img{
  max-width:none!important;width:100%!important}

/* 人像也换成同一档边，两块边框一致 = 一张卡的两半 */
html body .qcta2__who .qcta__face{
  border:1px solid rgba(196,151,73,.26)!important;
  box-shadow:0 30px 70px rgba(0,0,0,.34)}

/* ── ② 落款条：整页最后一个重音 ──────────────────────────────── */

html body .qcta2__facts{
  margin-top:clamp(40px,4.4vw,66px)!important;
  padding:0 clamp(18px,2vw,30px)!important;
  background:linear-gradient(180deg,
    rgba(196,151,73,.05) 0%, rgba(196,151,73,.012) 62%, transparent 100%)
    !important;
  border-top:1px solid rgba(196,151,73,.34)!important;
  border-bottom:1px solid var(--xh-hair)!important}

html body .qcta2__facts > div{
  padding:clamp(26px,3vw,40px) clamp(20px,2.4vw,36px)
          clamp(24px,2.8vw,36px) 0!important}

html body .qcta2__facts dt{
  color:var(--xh-gold)!important;
  font-size:11px!important;letter-spacing:.22em!important}

html body .qcta2__facts dd{
  font-size:clamp(15px,1.3vw,17.5px)!important;
  line-height:1.72!important;
  color:var(--xh-fg1)!important}

/* 5000 元 / 天 —— 这一页最硬的一句话，给它小标题的量级 */
html body .qcta2__facts dd b{
  display:inline-block;
  font-size:clamp(25px,2.5vw,36px)!important;
  line-height:1.15!important;
  color:var(--xh-gold-hi)!important;
  text-shadow:0 0 26px rgba(226,192,121,.16)}

/* ── ③ 收束线：读到这儿是真的到头了 ──────────────────────────── */
html body .qcta2::after{
  content:"";position:absolute;inset:auto 0 0;height:1px;
  background:linear-gradient(90deg,
    transparent 0%, rgba(196,151,73,.16) 30%,
    rgba(196,151,73,.16) 70%, transparent 100%)}

@media(max-width:900px){
  /* 单列之后「等高」没有意义了，还原成各自的自然高度 */
  html body .qcta2__who{align-items:center!important}
  html body .qcta2__who .qcta__qr{
    display:block!important}
  html body .qcta2__facts{
    padding:0 clamp(14px,3vw,20px)!important}
  html body .qcta2__facts dd b{
    font-size:clamp(23px,6vw,30px)!important}
  /* 手机上「叶玉浩 · 麒典 AI 创始人」会折成两行压在人像下沿，
     字间距收紧一档就够一行装下（这是拍手机图才看见的，桌面没有） */
  html body .qcta2__who .qcta__face figcaption{
    font-size:11px!important;letter-spacing:0!important;
    padding:8px 10px!important}
}
