/* ════════════════════════════════════════════════════════════════
   PRESNSE — INDUSTRY · CHINESE MEDICINE  ·  bespoke SIGNATURE layer
   ----------------------------------------------------------------
   This file holds ONLY the page's invented signature module — the
   bilingual EN / 繁 search-system split. Everything else reuses the
   shared .ind-* language in industry.css. Consumes tokens from
   foundation.css ONLY — no raw colour.

   SIGNATURE motif (10a · the one mid-page dark band): two light panels
   glow on the dark substrate — an English query column beside a
   Traditional Chinese query column for the SAME patient intent. The
   columns surface different SERP makeup, different competitors, and
   different volumes — proving the two languages are separate search
   systems, not translations. Lime marks the parity verdict / status.
   ════════════════════════════════════════════════════════════════ */

/* root label + intent rail */
.tcm-sig{margin-top:44px;}
.tcm-root{display:inline-flex;align-items:center;gap:11px;font-family:var(--mono);font-size:var(--label-md);
  letter-spacing:.06em;text-transform:uppercase;color:var(--white);border:1px solid var(--line-on-mid);
  border-radius:var(--radius-sm);padding:11px 18px;margin-bottom:24px;}
.tcm-root .d{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px var(--lime-glow-2);}
.tcm-root .zh{font-family:"Noto Sans HK","PingFang HK",var(--sans);color:var(--lime);}

/* the split: two language columns either side of a parity spine */
.tcm-split{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(16px,2.4vw,30px);align-items:stretch;}

/* a language column — a light panel glowing on the dark substrate (13d) */
.tcm-col{background:var(--paper-card);border:1px solid var(--line-mid);box-shadow:var(--shadow-card);
  display:flex;flex-direction:column;}
.tcm-col-head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 18px;border-bottom:1px dashed var(--line-dash);}
.tcm-col-head .lang{font-family:var(--mono);font-size:var(--label-sm);letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center;gap:8px;}
.tcm-col-head .lang .d{width:7px;height:7px;border-radius:50%;background:var(--faint);}
.tcm-col-head .lang.zh-on .d{background:var(--lime);box-shadow:0 0 0 3px var(--lime-glow);}
.tcm-col-head .vol{font-family:var(--mono);font-size:var(--label-xs);letter-spacing:.06em;
  text-transform:uppercase;color:var(--lime-ink);border:1px dashed var(--green-line);
  border-radius:var(--radius-tag);padding:3px 8px;white-space:nowrap;}
.tcm-col-head .vol.thin{color:var(--muted);border-color:var(--line-rule);}

/* the query the patient actually types */
.tcm-query{display:flex;align-items:center;gap:9px;padding:14px 18px;border-bottom:1px dashed var(--line-soft);}
.tcm-query .mag{width:13px;height:13px;color:var(--faint);flex:0 0 auto;}
.tcm-query .qt{font-size:.96rem;color:var(--ink);font-weight:500;}
.tcm-query .qt .zh{font-family:"Noto Sans HK","PingFang HK",var(--sans);}

/* what the SERP for that query is actually made of */
.tcm-serp{padding:6px 18px 4px;}
.tcm-srow{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:center;
  padding:10px 0;border-bottom:1px dashed var(--line-soft);}
.tcm-srow:last-child{border-bottom:none;}
.tcm-srow .ic{width:8px;height:8px;border-radius:var(--radius-bar);background:var(--faint);flex:0 0 auto;}
.tcm-srow.dir .ic{background:var(--serp-slate);}
.tcm-srow.gov .ic{background:var(--amber);}
.tcm-srow.maps .ic{background:var(--lime);box-shadow:0 0 0 3px var(--lime-glow);}
.tcm-srow .st{font-size:.86rem;color:var(--ink-soft);line-height:1.4;}
.tcm-srow .st .zh{font-family:"Noto Sans HK","PingFang HK",var(--sans);}
.tcm-srow .st small{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.04em;
  text-transform:uppercase;color:var(--muted);margin-top:3px;}

/* per-column intent note */
.tcm-note{margin-top:auto;padding:13px 18px;border-top:1px dashed var(--line-dash);
  font-family:var(--mono);font-size:var(--label-xs);letter-spacing:.04em;color:var(--muted);line-height:1.55;}
.tcm-note .zh{font-family:"Noto Sans HK","PingFang HK",var(--sans);}

/* the parity spine between the two columns */
.tcm-spine{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  min-width:96px;padding:8px 0;}
.tcm-spine .rail{width:1px;flex:1;background:var(--line-on-dash);min-height:30px;}
.tcm-spine .verdict{font-family:var(--mono);font-size:var(--label-xs);letter-spacing:.08em;
  text-transform:uppercase;color:var(--lime);text-align:center;border:1px solid var(--line-on-mid);
  border-radius:var(--radius-sm);padding:9px 11px;background:var(--wash-on);line-height:1.4;}
.tcm-spine .verdict b{display:block;color:var(--white);font-weight:600;margin-bottom:4px;letter-spacing:.06em;}

/* horizontal volume bars — proves English tools under-report demand */
.tcm-vol{margin-top:clamp(22px,3vw,34px);border-top:1px dashed var(--line-on-dash);padding-top:clamp(20px,2.6vw,30px);}
.tcm-vol .vh{font-family:var(--mono);font-size:var(--label-sm);letter-spacing:.1em;text-transform:uppercase;
  color:var(--tx-on-60);display:flex;align-items:center;gap:9px;margin-bottom:16px;}
.tcm-vol .vh .d{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px var(--lime-glow-2);}
.tcm-vrow{display:grid;grid-template-columns:148px 1fr auto;gap:14px;align-items:center;padding:9px 0;}
.tcm-vrow .vl{font-size:.88rem;color:var(--tx-on-75);}
.tcm-vrow .vl .zh{font-family:"Noto Sans HK","PingFang HK",var(--sans);}
.tcm-vrow .vl small{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--tx-on-45);margin-top:2px;}
.tcm-bar{height:9px;background:var(--wash-on-em);border-radius:var(--radius-bar);overflow:hidden;}
.tcm-bar i{display:block;height:100%;width:0;border-radius:var(--radius-bar);background:var(--line-on-strong);
  transition:width 1.1s var(--ease);}
.tcm-bar.zh-on i{background:var(--lime);}
.tcm-vrow.in .tcm-bar i{width:var(--w,0%);}
.tcm-vrow .vn{font-family:var(--mono);font-size:.72rem;color:var(--tx-on-62);white-space:nowrap;}
.tcm-vrow.zh-on .vn{color:var(--lime);}

.tcm-note-foot{margin-top:20px;font-family:var(--mono);font-size:var(--label-sm);color:var(--tx-on-60);
  border-left:2px solid var(--lime);padding-left:16px;max-width:78ch;line-height:1.6;letter-spacing:.01em;}
.tcm-note-foot .zh{font-family:"Noto Sans HK","PingFang HK",var(--sans);}

/* ── RESPONSIVE ── */
@media(max-width:960px){
  .tcm-split{grid-template-columns:1fr;gap:18px;}
  .tcm-spine{flex-direction:row;min-width:0;width:100%;gap:12px;}
  .tcm-spine .rail{width:auto;height:1px;flex:1;min-height:0;}
  .tcm-vrow{grid-template-columns:120px 1fr auto;gap:11px;}
}
@media(max-width:560px){
  .tcm-vrow{grid-template-columns:1fr;gap:6px;}
  .tcm-vrow .vn{justify-self:start;}
}
