/* 柒 聯絡資訊（單 3；單 3u 內文重做；單 3x 內文圖改門廳；單 lb1 門廳改寬版廣角；award_build/p_contact.py）：首屏對位十字線（非地圖）；內文＝資料列在上、門廳廣角圖在下（虛線整座門廳、實線一條動線）＋引線接資料主軸。
   規則同 base.css 檔頭：色只用 token、字重只用已載入樣式（Serif 600／其餘 400）、字級 --fs-*、間距 --s1～--s7；例外就地註明。 */

/* ── 首屏：對位十字線（1px 線；十字軸與同心圓強調色、刻度次要色） ───────────────────────── */
.p-con__plate svg * { vector-effect: non-scaling-stroke; }
.p-con__plate svg { stroke: var(--accent); }
.p-con__fdash { stroke-dasharray: 4 4; }
.p-con__fax { stroke-dasharray: 18 5 2 5; }          /* 一點鏈線（設計專利圖式的中心線型） */
.p-con__ftick { stroke: var(--fg-2); }

/* ── 版面量尺（例外：引線幾何，非間距級距）
   --tick-y：列頂到標籤中線＝列上內距 16 ＋ 標籤行高 22 的一半（每列短橫線的 y）。 */
.p-con { --tick-y: 27px; --tick-w: 24px; overflow: clip; }

/* ── 主軸與資料列：主軸實線，每列一條短橫線引出標籤，值放在下方 ─────────────────────────── */
.p-con__rows { border-left: 1px solid var(--line-claim); container-type: inline-size; }
.p-con__row { position: relative; padding: 16px 0 var(--s3) calc(var(--tick-w) + var(--s1)); }
dl.p-con__row { margin: 0; }
.p-con__row::before {
  content: ""; position: absolute; left: 0; top: var(--tick-y); width: var(--tick-w);
  border-top: 1px solid var(--line-claim);
}
.p-con__rows > .p-con__row:first-child::before { border-top-color: var(--accent); }
.p-con__rows > .p-con__row:first-child::after {       /* 第一列的引線落點（例外：圖示幾何） */
  content: ""; position: absolute; left: -3px; top: calc(var(--tick-y) - 2.5px); width: 6px; height: 6px;
  border-radius: 50%; background: var(--cur);
}
.p-con__k { font: 400 var(--fs-small)/22px var(--f-sans); letter-spacing: .16em; color: var(--fg-2); }
.p-con__v { margin: var(--s1) 0 0; font: 600 var(--fs-h3)/1.4 var(--f-serif); letter-spacing: .04em; overflow-wrap: anywhere; }
/* 值的尺度跟欄寬走（例外：資料是本頁主角，字級超出 --fs-*；cqi 不支援時退回 --fs-h3、--fs-h2） */
.p-con__v--xl, .p-con__v--l { font: 400 var(--fs-h2)/1.12 var(--f-latin); letter-spacing: 0; font-variant-numeric: lining-nums; }
@supports (font-size: 1cqi) {
  .p-con__v { font-size: clamp(20px, 5.1cqi, 34px); }
  .p-con__v--xl { font-size: clamp(30px, 8.8cqi, 60px); }
  .p-con__v--l { font-size: clamp(25px, 7.6cqi, 50px); }
}
.p-con__row--raw { font: 400 var(--fs-body)/1.7 var(--f-sans); overflow-wrap: anywhere; }      /* 解析失敗的整行：原樣、一般內文 */
.p-con__img { max-width: 760px; margin-top: var(--s4); }
.p-con__img img { width: 100%; height: auto; }

/* ── 所名：中文整行、英文橫排（各寬度都橫排，桌機中文另改直排，見 ≥1024 段） ──────────────────── */
.p-con__ll { margin: 0; font: 600 var(--fs-h2)/1.3 var(--f-serif); letter-spacing: .08em; }
.p-con__ll--en { margin-top: var(--s1); font: italic 400 var(--fs-lead)/1.4 var(--f-latin); letter-spacing: .02em; color: var(--accent); }
.p-con__lead--en .p-con__ll--en { margin-top: 0; }
.p-con__lead--en { margin-top: var(--s1); }
.p-con__lead > .p-con__row { padding-left: 0; }
.p-con__lead > .p-con__row::before { content: none; }

/* ── 內文門廳圖：虛線＝不主張（整座門廳）、實線＝主張（一條動線）；底色面（--lm）遮住被擋的線 ──────── */
/* 寬版廣角（單 lb1）：圖寬跟欄寬走、高度照 viewBox 比例；viewBox 的 y=0＝圖頂，主張線從穹頂直上到圖頂，接引線（::after） */
.p-con__fig { position: relative; pointer-events: none; }
.p-con__bsvg { display: block; width: 100%; height: auto; fill: none; stroke: var(--fg-2); }
.p-con__fig::after {                                  /* 引線：主軸（資料列左緣）→ 圖中軸（圖頂），水平一段 */
  content: ""; position: absolute; left: 0; top: 0; width: 50%;
  border-top: 1px solid var(--accent);
}
.p-con__bsvg * { vector-effect: non-scaling-stroke; }
.p-con__lm { fill: var(--bg); stroke: none; }
.p-con__la { stroke-dasharray: 5 3; }
.p-con__lb { stroke: color-mix(in srgb, var(--fg-2) 55%, transparent); stroke-dasharray: 2 3; }
.p-con__ln { stroke: var(--fg); stroke-dasharray: 6 3; }      /* 近景（巨柱、穹頂主環）：色最深、虛線最長，靠線重分出前後 */
.p-con__lc { stroke: var(--accent); stroke-width: 1.5px; }
.p-con__le { stroke: var(--accent); stroke-dasharray: 12 3 2 3; }   /* 穹頂中心線（一點鏈線） */
.p-con__lo { fill: var(--bg); stroke: var(--accent); }        /* 主張線起點：空心小圓（同 p-team 主軸節點語言），終點＝第一列的實心落點 */

/* ── 手機（<768）：所名橫排、資料在前；主軸往下，引線進圖頂中軸；簡化版寬圖出血到螢幕兩緣，不隔開資料與下一章 ─────── */
@media (max-width: 767.98px) {
  /* 手機首屏（單 3m2 A5）：email 早進第一屏——段上留白與所名下距各收兩級、資料列上下內距各收一級（字級、列序不變）；
     --tick-y 跟著列上內距改（8＋標籤行高 22 的一半） */
  .p-con { --tick-y: 19px; }
  .p-con.aw-section { padding: var(--s2) 0 var(--s5); }
  .p-con__lead { margin-bottom: var(--s1); }
  .p-con__row { padding-top: var(--s1); padding-bottom: var(--s2); }
  .p-con__lead--v:not(:last-child) { margin-bottom: 0; }
  .p-con__ll { font-size: min(8.6vw, 44px); }     /* 例外：滿版所名，字級跟視窗寬 */
  .p-con__ll--en { font-size: var(--fs-lead); }
  .p-con__rows { padding-bottom: var(--s1); order: 2; }
  .p-con__fig { order: 3; margin-inline: calc(-1 * var(--aw-margin)); }    /* 寬圖出血到螢幕兩緣 */
  .p-con__fig::after { left: var(--aw-margin); width: calc(50% - var(--aw-margin)); }
  .p-con__img { order: 4; }
  .p-con__bclip { display: none; }
}

/* ── ≥768：資料在上、寬圖在下，兩者同欄寬；圖頂緊接資料列底，主軸往下接引線 ─────────────────────── */
@media (min-width: 768px) {
  .p-con.aw-section { padding: var(--s4) 0; }
  .p-con__grid { align-items: start; }
  .p-con__lead { grid-column: 1 / -1; grid-row: 1; }
  .p-con__lead--en { grid-column: 1 / -1; grid-row: 2; }
  .p-con__rows { grid-column: 1 / -1; grid-row: 3; margin-top: var(--s3); }
  .p-con__fig { grid-column: 1 / -1; grid-row: 4; }
  .p-con__img { grid-column: 1 / -1; grid-row: 5; }
  .p-con__bsvg--s { display: none; }
}

/* ── 768～1023：資料單欄、不滿版（值的字級跟欄寬走，滿版會比桌機還大）；引線從主軸水平接到圖中軸 ── */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .p-con__rows { grid-column: 1 / 10; }
}

/* ── ≥1024：寬圖在第 2–12 欄（無直排所名＝全寬）、英文所名橫排在圖下；中文所名直排一欄（例外：字級跟視窗寬）。
   資料兩欄（p-con__grid--two，由 p_contact.py 判定）：主軸移到資料區正中、與寬圖中軸同一條直線（主張線出穹頂直上就是主軸，不再要水平引線）；
   右欄＝標籤含電話的列（p-con__row--r），左欄＝其餘列，各欄照 DOM 順序由上而下（dense 填空，不留洞）；左欄靠右對齊、短橫線往左引出（鏡像），
   右欄照舊往右；第一列落點在主軸頂。值的字級改跟各列自己的欄寬走（cqi 的容器從整個資料區改成每一列）。
   退路（左右有一欄會空＝沒有 --two）：資料單欄、不滿版，引線從主軸水平接到圖中軸（同 768～1023） ────────────────── */
@media (min-width: 1024px) {
  .p-con.aw-section { padding-top: var(--s3); }      /* 四列在 1440×900 第一屏內 */
  .p-con__row { padding-bottom: var(--s2); }
  .p-con__rows { grid-column: 1 / 9; }
  .p-con__grid--two .p-con__rows {
    grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row dense;
    position: relative; border-left: 0; container-type: normal;
  }
  .p-con__grid--two .p-con__rows::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; border-left: 1px solid var(--line-claim); }
  .p-con__grid--two .p-con__rows > * {
    grid-column: 1; container-type: inline-size; padding-left: 0; padding-right: calc(var(--tick-w) + var(--s1)); text-align: right;
  }
  .p-con__grid--two .p-con__rows > *::before { left: auto; right: 0; }
  .p-con__grid--two .p-con__rows > .p-con__row--r { grid-column: 2; padding-left: calc(var(--tick-w) + var(--s1)); padding-right: 0; text-align: left; }
  .p-con__grid--two .p-con__rows > .p-con__row--r::before { left: 0; right: auto; }
  .p-con__grid--two .p-con__rows > .p-con__row:first-child:not(.p-con__row--r)::after { left: auto; right: -3px; }
  .p-con__grid--two .p-con__fig::after { content: none; }
  .p-con__grid--v .p-con__lead--v {
    grid-column: 1 / 2; grid-row: 1 / span 2; writing-mode: vertical-rl; justify-self: start;
    padding-top: var(--s2); position: relative; z-index: 1;
  }
  .p-con__grid--v .p-con__lead--v .p-con__ll { font-size: clamp(36px, 3.34vw, 48px); line-height: 1.1; letter-spacing: .02em; }
  .p-con__grid--v .p-con__rows { grid-column: 2 / 9; grid-row: 1; margin-top: 0; }
  .p-con__grid--v.p-con__grid--two .p-con__rows { grid-column: 2 / 13; }
  .p-con__grid--v .p-con__fig { grid-column: 2 / 13; grid-row: 2; }
  .p-con__grid--v .p-con__lead--en { grid-column: 1 / 13; grid-row: 3; margin-top: var(--s2); }
  .p-con__grid--v .p-con__img { grid-column: 2 / 13; grid-row: 4; }
}

/* ── 矮視窗（寬 ≥1200、高 ≤800；例外：字級跟視窗高）：四列與直排所名完整進第一屏。收列距與字級，電話仍是全段最大的字。 ── */
@media (min-width: 1200px) and (max-height: 800px) {
  .p-con { --tick-y: 16px; }                         /* 列上內距 6 ＋ 標籤行高 20 的一半 */
  .p-con.aw-section { padding-top: var(--s2); }
  .p-con__row { padding: 6px 0; padding-left: calc(var(--tick-w) + var(--s1)); }
  .p-con__k { line-height: 20px; }
  .p-con__v { margin-top: 2px; font-size: min(5.1cqi, 3.5vh); }
  .p-con__v--xl { font-size: min(8.8cqi, 6vh); }
  .p-con__v--l { font-size: min(7.6cqi, 5.2vh); }
  .p-con__grid--v .p-con__lead--v { padding-top: var(--s1); }
  .p-con__grid--v .p-con__lead--v .p-con__ll { font-size: min(clamp(36px, 3.34vw, 48px), 4.6vh); }
}
