@charset "utf-8";
/* ============================================================
   維和法律事務所 — 前台設計系統
   依 2026-09-17 設計稿重新切版。載入順序在 A10501 各樣式表之後，
   因此同權重時以本檔為準。色值集中在 :root，之後微調只需改這裡。
   ============================================================ */

:root{
  /* 主色（取樣自 _design/ 兩張設計稿）*/
  --fs-navy:        #183048;   /* 深藍：版尾、信念帶、CTA */
  --fs-navy-deep:   #0c2436;   /* 更深：主視覺遮罩、版權列 */
  --fs-navy-soft:   #24425e;
  /* 輔色 */
  --fs-gold:        #a08757;   /* 古銅金：按鈕、小標、線條 */
  --fs-gold-light:  #bda275;
  --fs-gold-hover:  #8b7247;
  --fs-gold-pale:   #d6c3a0;
  /* 中性 */
  --fs-ivory:       #f7f5f1;   /* 區塊底 */
  --fs-ivory-2:     #faf9f6;   /* 更淺的紙感底 */
  --fs-card:        #f0ece8;   /* 引言卡等淺卡片 */
  --fs-line:        #e6e1d8;
  --fs-ink:         #1f2a33;   /* 內文主色 */
  --fs-ink-soft:    #55606a;   /* 次要文字 */
  --fs-white:       #ffffff;

  --fs-max:         1200px;    /* 內容最大寬 */
  --fs-gut:         24px;      /* 左右安全間距 */

  --fs-serif: "Noto Serif TC", "Source Han Serif TC", "PMingLiU", serif;
  --fs-sans:  "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
  --fs-latin: "Cormorant Garamond", "Noto Serif TC", Georgia, serif;
}

/* ---------- 基本 ---------- */
body{ font-family:var(--fs-sans); color:var(--fs-ink); background:var(--fs-white); -webkit-font-smoothing:antialiased; }
.fs-wrap{ max-width:var(--fs-max); margin:0 auto; padding-inline:var(--fs-gut); }
.fs-sec{ padding-block:80px; }
.fs-sec--ivory{ background:var(--fs-ivory); }
.fs-sec--paper{ background:var(--fs-ivory-2); }

/* 區塊標題：英文小標 + 中文大標 */
.fs-eyebrow{ font-family:var(--fs-latin); font-size:14px; letter-spacing:.34em; text-transform:uppercase; color:var(--fs-gold); margin:0 0 10px; font-weight:500; }
.fs-h2{ font-family:var(--fs-serif); font-weight:700; font-size:clamp(26px,3vw,36px); line-height:1.4; letter-spacing:.06em; color:var(--fs-navy); margin:0 0 28px; }
.fs-h2 + .fs-lead{ margin-top:-14px; }
.fs-lead{ font-size:15px; line-height:2; color:var(--fs-ink-soft); }

/* 連結型文字按鈕：了解更多 → */
.fs-more{ display:inline-flex; align-items:center; gap:.55em; font-size:14px; letter-spacing:.08em; color:var(--fs-gold); text-decoration:none; }
.fs-more::after{ content:"→"; font-size:1.05em; line-height:1; transition:transform .25s; }
.fs-more:hover::after{ transform:translateX(4px); }

/* 實心 / 外框按鈕 */
.fs-btn{ display:inline-flex; align-items:center; justify-content:center; gap:.8em; min-width:150px; padding:14px 28px;
  font-size:15px; letter-spacing:.12em; text-decoration:none; border:1px solid transparent; transition:background .25s,color .25s,border-color .25s; }
.fs-btn::after{ content:"→"; font-size:1.05em; line-height:1; }
.fs-btn--gold{ background:var(--fs-gold); color:#fff; }
.fs-btn--gold:hover{ background:var(--fs-gold-hover); }
.fs-btn--ghost{ border-color:rgba(255,255,255,.65); color:#fff; }
.fs-btn--ghost:hover{ background:rgba(255,255,255,.12); }

/* ============================================================
   版頭
   ============================================================ */
#header{ background:#fff; border-bottom:1px solid var(--fs-line); box-shadow:none; }
#header .page{ max-width:var(--fs-max); padding-inline:var(--fs-gut); align-items:center; min-height:76px; }
#header .logo{ display:flex; align-items:center; }
#header .logo img{ max-height:52px; width:auto; }

#header .nav{ display:flex; align-items:center; justify-content:flex-end; gap:28px; }
#header .syisnav{ gap:4px; align-items:center; }
#header .syisnav > li > a{ font-family:var(--fs-sans); font-size:16px; letter-spacing:.06em; color:var(--fs-navy);
  padding:28px 14px; position:relative; }
#header .syisnav > li > a::after{ content:""; position:absolute; left:14px; right:14px; bottom:22px; height:2px; background:var(--fs-gold); transform:scaleX(0); transition:transform .25s; }
#header .syisnav > li > a:hover::after,
#header .syisnav > li.is-active > a::after{ transform:scaleX(1); }
#header .syisnav li ul{ background:#fff; border-top:2px solid var(--fs-gold); width:auto; min-width:9em; box-shadow:0 8px 24px rgba(22,48,74,.12); }
#header .syisnav li ul li{ border-bottom:1px solid var(--fs-line); text-align:left; }
#header .syisnav li ul li a{ padding:.7em 1.1em; color:var(--fs-navy); font-size:14px; }

/* 語言切換：英文版尚未上線，先保留版位 */
.fs-lang{ display:flex; align-items:center; gap:18px; padding-left:22px; border-left:1px solid var(--fs-line); }
.fs-lang a{ font-family:var(--fs-latin); font-size:15px; letter-spacing:.14em; color:var(--fs-ink-soft); text-decoration:none; }
.fs-lang a:hover{ color:var(--fs-gold); }
.fs-lang[hidden]{ display:none; }

/* 行動版漢堡（沿用 js.js 的 .toggle / .nav 行為） */
#header .menu.toggle > div, #header .menu.toggle::before, #header .menu.toggle::after{ background:var(--fs-navy); }

/* ============================================================
   共用 CTA（首頁底部 / 各內頁下方）
   ============================================================ */
/* 套版的區塊多為 float:left，未清除浮動會讓本區可用寬度被擠成 0 */
.fs-cta{ position:relative; clear:both; width:100%; background:var(--fs-navy); color:#fff; overflow:hidden; }
.fs-cta__bg{ position:absolute; inset:0; }
.fs-cta__bg img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.fs-cta__bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(16,37,56,.94) 0%,rgba(16,37,56,.82) 55%,rgba(16,37,56,.72) 100%); }
.fs-cta__in{ position:relative; z-index:2; display:flex; align-items:center; gap:40px; flex-wrap:wrap; padding-block:56px; }
.fs-cta__txt{ flex:1 1 380px; }
.fs-cta__txt h2{ font-family:var(--fs-serif); font-size:clamp(22px,2.4vw,28px); font-weight:700; letter-spacing:.05em; margin:0 0 10px; }
.fs-cta__txt p{ margin:0; font-size:15px; line-height:1.9; color:rgba(255,255,255,.82); }
.fs-cta__act{ flex:0 0 auto; }
.fs-cta__side{ flex:0 0 auto; padding-left:40px; border-left:1px solid rgba(255,255,255,.22);
  font-family:var(--fs-latin); font-size:14px; letter-spacing:.22em; line-height:2; color:rgba(255,255,255,.55); text-transform:uppercase; }

/* ============================================================
   版尾
   ============================================================ */
#footer{ background:var(--fs-navy); color:rgba(255,255,255,.8); padding:0; }
#footer .page{ max-width:var(--fs-max); padding-inline:var(--fs-gut); }
.fs-foot{ display:flex; align-items:flex-start; gap:48px; flex-wrap:wrap; padding-block:44px; }
.fs-foot__logo{ flex:0 0 auto; }
.fs-foot__logo img{ max-height:56px; width:auto; }
.fs-foot__brand{ display:block; text-decoration:none; padding-right:28px; border-right:1px solid rgba(255,255,255,.16); }
.fs-foot__brand-cn{ display:block; font-family:var(--fs-serif); font-weight:700; font-size:20px; letter-spacing:.14em; color:#fff; }
.fs-foot__brand-en{ display:block; font-family:var(--fs-latin); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.55); margin-top:4px; }
.fs-foot__info{ flex:1 1 320px; font-size:14px; line-height:2; color:rgba(255,255,255,.78); }
.fs-foot__info strong{ display:block; color:#fff; font-weight:500; letter-spacing:.08em; margin-bottom:2px; }
.fs-foot__info a{ color:inherit; text-decoration:none; }
.fs-foot__info a:hover{ color:var(--fs-gold-pale); }
/* flex-shrink 不能是 0，否則 5 個連結在手機上撐出橫向捲動 */
.fs-foot__nav{ flex:1 1 auto; min-width:0; display:flex; flex-wrap:wrap; gap:0 18px; font-size:14px; }
.fs-foot__nav a{ color:rgba(255,255,255,.78); text-decoration:none; position:relative; padding-right:18px; }
.fs-foot__nav a:not(:last-child)::after{ content:""; position:absolute; right:0; top:.35em; bottom:.35em; width:1px; background:rgba(255,255,255,.22); }
.fs-foot__nav a:hover{ color:#fff; }
.fs-copy{ border-top:1px solid rgba(255,255,255,.14); padding-block:16px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:13px; color:rgba(255,255,255,.55); }
.fs-copy .fs-copy__motto{ letter-spacing:.3em; }

/* 浮動聯絡鈕維持既有行為，只微調外觀 */
.fixedbtn a{ box-shadow:0 4px 14px rgba(22,48,74,.28); }

/* ============================================================
   響應式
   ============================================================ */
@media screen and (max-width:1024px){
  .fs-sec{ padding-block:60px; }
  .fs-cta__side{ display:none; }
}
@media screen and (max-width:767px){
  :root{ --fs-gut:18px; }
  .fs-sec{ padding-block:44px; }
  #header .page{ min-height:62px; }
  #header .logo img{ max-height:40px; }
  #header .nav{ display:none; flex-direction:column; align-items:stretch; gap:0; background:var(--fs-navy); padding:8px 0 16px; }
  #header .syisnav{ height:auto; }
  #header .syisnav > li{ padding:0; }
  #header .syisnav > li > a{ color:#fff; padding:14px 20px; font-size:16px; }
  #header .syisnav > li > a::after{ display:none; }
  #header .syisnav li ul{ position:static; transform:none; width:100%; box-shadow:none; background:rgba(255,255,255,.06); border-top:0; }
  #header .syisnav li ul li a{ color:rgba(255,255,255,.8); padding-left:34px; }
  .fs-lang{ border-left:0; border-top:1px solid rgba(255,255,255,.15); padding:14px 20px 0; }
  .fs-lang a{ color:rgba(255,255,255,.8); }
  .fs-cta__in{ padding-block:40px; gap:24px; }
  .fs-foot{ gap:26px; padding-block:34px; }
  .fs-foot__nav{ gap:2px 12px; font-size:13px; }
  /* 換行後最後一個連結的分隔線會落在行尾，一律移除 */
  .fs-foot__nav a{ padding-right:12px; }
  .fs-foot__nav a::after{ display:none; }
  .fs-copy{ flex-direction:column; gap:6px; }
  .fs-copy .fs-copy__motto{ letter-spacing:.2em; }
}

/* ============================================================
   首頁區塊（2026-09 改版）
   套版容器多為 float:left，每個區塊一律 clear:both + width:100%
   ============================================================ */
.fs-block{ clear:both; width:100%; position:relative; }

/* ---------- 區塊標頭：英文小標 + 中文大標 + 右側更多連結 ---------- */
.fs-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:38px; }
.fs-head__t{ flex:1 1 auto; }
.fs-head .fs-h2{ margin:0; }

/* ============================ 主視覺 ============================ */
.fs-hero{ clear:both; width:100%; position:relative; overflow:hidden; background:var(--fs-navy-deep); }
.fs-hero__slide{ position:relative; }
.fs-hero__bg{ position:absolute; inset:0; }
.fs-hero__bg img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.fs-hero__bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(12,36,54,.95) 0%,rgba(12,36,54,.90) 26%,rgba(12,36,54,.74) 44%,rgba(12,36,54,.66) 60%,rgba(12,36,54,.74) 100%); }
.fs-hero .fs-hero__slide{ min-height:560px; height:auto; }
/* slick 初始化後會把 slide 移進 .slick-track，故此規則只在初始化前生效 */
.fs-hero__track > .fs-hero__slide:not(:first-child){ display:none; }
/* 文字只輸出一次，疊在輪播之上；輪播僅負責換圖 */
.fs-hero__overlay{ position:absolute; inset:0; z-index:3; display:flex; align-items:center; pointer-events:none; }
.fs-hero__overlay > .fs-wrap{ width:100%; }
.fs-hero__overlay a{ pointer-events:auto; }
.fs-hero__in{ display:flex; align-items:center; gap:40px; padding-block:60px; }
.fs-hero__txt{ flex:1 1 560px; color:#fff; max-width:660px; }
.fs-hero__eyebrow{ font-family:var(--fs-latin); font-size:14px; letter-spacing:.32em; text-transform:uppercase; color:var(--fs-gold-pale); margin:0 0 18px; }
.fs-hero__txt h1{ font-family:var(--fs-serif); font-weight:700; font-size:clamp(30px,4.4vw,52px); line-height:1.3; letter-spacing:.1em; margin:0 0 12px; }
.fs-hero__motto{ font-size:clamp(16px,1.8vw,21px); letter-spacing:.34em; color:#fff; margin:0 0 22px; }
.fs-hero__txt p{ font-size:15px; line-height:2; color:rgba(255,255,255,.82); margin:0 0 30px; max-width:30em; }
.fs-hero__act{ display:flex; gap:14px; flex-wrap:wrap; }
.fs-hero__side{ flex:0 0 auto; align-self:center; padding-left:36px; border-left:1px solid rgba(255,255,255,.3);
  text-shadow:0 1px 6px rgba(6,20,32,.55); }
.fs-hero__side .fs-hero__zh{ font-family:var(--fs-serif); font-size:15px; letter-spacing:.24em; line-height:2.2; color:#fff; margin:0 0 20px; }
.fs-hero__side ul{ list-style:none; margin:0; padding:0; font-family:var(--fs-latin); font-size:13px; letter-spacing:.24em;
  text-transform:uppercase; line-height:2.1; color:rgba(255,255,255,.62); }
/* 專案未載入 slick-theme.css，指示點自行定義（避免多一支圖示字型）*/
.fs-hero .slick-dots{ position:absolute; left:0; right:0; bottom:26px; z-index:4;
  display:flex; justify-content:center; gap:10px; list-style:none; margin:0; padding:0; }
.fs-hero .slick-dots li{ margin:0; padding:0; line-height:0; }
.fs-hero .slick-dots li button{ display:block; width:38px; height:3px; padding:0; border:0; border-radius:0; cursor:pointer;
  background:rgba(255,255,255,.4); font-size:0; line-height:0; color:transparent; text-indent:-9999px; overflow:hidden;
  transition:background .25s; }
.fs-hero .slick-dots li button:hover{ background:rgba(255,255,255,.7); }
.fs-hero .slick-dots li.slick-active button{ background:var(--fs-gold-pale); }

/* ============================ 關於維和 ============================ */
.fs-about{ background:var(--fs-ivory-2); }
.fs-about__in{ display:flex; align-items:center; gap:48px; padding-block:84px; }
.fs-about__txt{ flex:1 1 400px; min-width:0; }
.fs-about__txt .fs-lead{ margin:0 0 18px; }
.fs-about__fig{ flex:0 0 300px; margin:0; aspect-ratio:4/5; position:relative; overflow:hidden; background:var(--fs-card); }
.fs-about__fig img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
/* 右欄：01 Professional 專業 … */
.fs-about__vals{ flex:0 0 210px; list-style:none; margin:0; padding:0; }
.fs-about__vals li{ display:flex; align-items:baseline; gap:18px; padding:20px 0; }
.fs-about__vals li + li{ border-top:1px solid var(--fs-line); }
.fs-about__vals b{ font-family:var(--fs-latin); font-weight:500; font-size:34px; line-height:1; color:var(--fs-gold-light); }
.fs-about__vals span{ display:block; }
.fs-about__vals em{ font-family:var(--fs-latin); font-style:normal; font-size:17px; letter-spacing:.06em; color:var(--fs-navy); display:block; margin-bottom:4px; }
.fs-about__vals i{ font-family:var(--fs-serif); font-style:normal; font-weight:700; font-size:18px; letter-spacing:.12em; color:var(--fs-navy); display:block; }

/* ============================ 專業法律服務 ============================ */
.fs-services{ background:var(--fs-ivory); }
.fs-services .fs-wrap{ padding-block:84px; }
.fs-grid4{ display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.fs-svc{ display:flex; flex-direction:column; text-decoration:none; }
.fs-svc__fig{ position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--fs-card); margin:0 0 18px; }
.fs-svc__fig img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; transition:transform .5s; }
.fs-svc:hover .fs-svc__fig img{ transform:scale(1.05); }
.fs-svc__no{ font-family:var(--fs-latin); font-size:20px; letter-spacing:.1em; color:var(--fs-gold); display:block; margin-bottom:8px; }
.fs-svc__t{ font-family:var(--fs-serif); font-size:19px; font-weight:700; letter-spacing:.05em; color:var(--fs-navy); margin:0 0 10px; line-height:1.5; }
.fs-svc__d{ font-size:14px; line-height:1.9; color:var(--fs-ink-soft); margin:0 0 16px; flex:1 1 auto; }
.fs-svc .fs-more{ margin-top:auto; }

/* ============================ 我們堅持的信念 ============================ */
.fs-why{ background:var(--fs-navy); color:#fff; position:relative; overflow:hidden; }
.fs-why__bg{ position:absolute; inset:0; opacity:.22; }
.fs-why__bg img{ width:100%; height:100%; object-fit:cover; display:block; }
.fs-why .fs-wrap{ position:relative; z-index:2; padding-block:70px; }
.fs-why .fs-eyebrow{ color:var(--fs-gold-pale); }
.fs-why .fs-h2{ color:#fff; }
.fs-why__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.fs-why__item{ padding:6px 30px; position:relative; display:flex; align-items:center; gap:22px; }
.fs-why__item + .fs-why__item::before{ content:""; position:absolute; left:0; top:10%; bottom:10%; width:1px; background:rgba(255,255,255,.2); }
.fs-why__ico{ flex:0 0 74px; width:74px; height:74px; margin:0; border:1px solid var(--fs-gold-light); border-radius:50%;
  display:flex; align-items:center; justify-content:center; }
.fs-why__tx{ min-width:0; }
.fs-why__ico svg{ width:36px; height:36px; stroke:var(--fs-gold-light); fill:none; stroke-width:1.4; }
.fs-why__ico img{ width:34px; height:34px; object-fit:contain; }
.fs-why__t{ font-family:var(--fs-serif); font-size:19px; font-weight:700; letter-spacing:.14em; margin:0 0 10px; color:#fff; }
.fs-why__d{ font-size:14px; line-height:1.9; color:rgba(255,255,255,.75); margin:0; }

/* ============================ 專業團隊 ============================ */
.fs-team{ background:var(--fs-ivory-2); }
.fs-team .fs-wrap{ padding-block:84px; }
.fs-team__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.fs-person{ text-decoration:none; display:block; }
.fs-person__fig{ position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--fs-card); margin:0 0 14px; }
.fs-person__fig img{ width:100%; height:100%; object-fit:cover; object-position:center 22%; display:block; transition:transform .5s; }
.fs-person:hover .fs-person__fig img{ transform:scale(1.04); }
.fs-person__n{ font-family:var(--fs-serif); font-size:18px; font-weight:700; letter-spacing:.08em; color:var(--fs-navy); margin:0 0 4px; }
.fs-person__r{ font-size:13px; letter-spacing:.06em; color:var(--fs-ink-soft); margin:0; }
.fs-quote{ background:var(--fs-card); padding:34px 30px; display:flex; flex-direction:column; justify-content:center; }
.fs-quote p{ font-family:var(--fs-serif); font-size:17px; line-height:2.1; letter-spacing:.06em; color:var(--fs-navy); margin:0 0 20px; }
.fs-quote cite{ font-family:var(--fs-latin); font-style:normal; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--fs-ink-soft); line-height:1.9; display:block; }
.fs-quote cite::before{ content:""; display:block; width:28px; height:1px; background:var(--fs-gold); margin-bottom:12px; }

/* ============================ 法律評論與新知 ============================ */
.fs-insights{ background:#fff; }
.fs-insights .fs-wrap{ padding-block:84px; }
.fs-grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.fs-post{ display:flex; flex-direction:column; text-decoration:none; border:1px solid var(--fs-line); background:#fff; transition:box-shadow .3s,transform .3s; }
.fs-post:hover{ box-shadow:0 12px 30px rgba(22,48,74,.1); transform:translateY(-3px); }
.fs-post__fig{ position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--fs-navy); }
.fs-post__fig img{ width:100%; height:100%; object-fit:cover; display:block; }
.fs-post__fig--none{ background:linear-gradient(135deg,var(--fs-navy) 0%,var(--fs-navy-soft) 100%); display:flex; align-items:center; justify-content:center; }
.fs-post__fig--none span{ font-family:var(--fs-latin); font-size:13px; letter-spacing:.3em; text-transform:uppercase; color:rgba(255,255,255,.45); }
.fs-post__body{ padding:22px 24px 24px; display:flex; flex-direction:column; flex:1 1 auto; }
.fs-post__cat{ font-size:12px; letter-spacing:.14em; color:var(--fs-gold); margin:0 0 10px; }
.fs-post__t{ font-family:var(--fs-serif); font-size:17px; font-weight:700; line-height:1.65; letter-spacing:.03em; color:var(--fs-navy); margin:0 0 14px; }
.fs-post__d{ font-family:var(--fs-latin); font-size:13px; letter-spacing:.1em; color:var(--fs-ink-soft); margin:0 0 16px; }
.fs-post .fs-more{ margin-top:auto; }

/* ============================ 響應式 ============================ */
@media screen and (max-width:1024px){
  .fs-hero .fs-hero__slide{ min-height:460px; }
  .fs-hero__side{ display:none; }
  .fs-about__in{ gap:30px; padding-block:60px; flex-wrap:wrap; }
  .fs-about__txt{ flex:1 1 100%; order:1; }
  .fs-about__fig{ flex:1 1 300px; order:2; aspect-ratio:3/2; }
  .fs-about__vals{ flex:1 1 240px; order:3; }
  .fs-services .fs-wrap, .fs-team .fs-wrap, .fs-insights .fs-wrap{ padding-block:60px; }
  .fs-grid4{ grid-template-columns:repeat(2,1fr); }
  .fs-team__grid{ grid-template-columns:repeat(2,1fr); }
  .fs-grid3{ grid-template-columns:repeat(2,1fr); }
  .fs-why__item{ padding:6px 18px; }
}
@media screen and (max-width:767px){
  .fs-hero{ position:static; }
  .fs-hero .fs-hero__slide{ min-height:0; }
  .fs-hero__bg{ position:relative; aspect-ratio:1/1; }
  /* 手機版文字改放在圖片下方，左右向漸層不再需要，換成上下淡遮罩 */
  .fs-hero__bg::after{ background:linear-gradient(180deg,rgba(12,36,54,.38) 0%,rgba(12,36,54,.10) 42%,rgba(12,36,54,.55) 100%); }
  .fs-hero__overlay{ position:static; display:block; background:var(--fs-navy-deep); }
  .fs-hero__in{ padding-block:40px; display:block; }
  .fs-hero__txt{ max-width:none; }
  .fs-hero__act .fs-btn{ min-width:0; flex:1 1 44%; padding:13px 16px; font-size:14px; }
  .fs-about__in{ display:block; padding-block:44px; }
  .fs-about__fig{ margin-top:28px; aspect-ratio:4/3; }
  .fs-about__vals{ margin-top:26px; }
  .fs-about__vals li{ padding:16px 0; }
  .fs-services .fs-wrap, .fs-team .fs-wrap, .fs-insights .fs-wrap{ padding-block:44px; }
  .fs-head{ margin-bottom:26px; }
  .fs-grid4, .fs-grid3, .fs-team__grid{ grid-template-columns:1fr; gap:22px; }
  .fs-why .fs-wrap{ padding-block:48px; }
  .fs-why__grid{ grid-template-columns:1fr; gap:30px; }
  .fs-why__item{ padding:0; gap:18px; }
  .fs-why__ico{ flex-basis:64px; width:64px; height:64px; }
  .fs-why__item + .fs-why__item::before{ left:18%; right:18%; top:-15px; bottom:auto; width:auto; height:1px; }
  .fs-quote{ padding:26px 22px; }
}

/* ============================================================
   內頁外框（2026-09 依設計稿）
   主視覺由 UC/PageHero.ascx 輸出在 #defaultimg 之內
     —— js.js 的 defaultimgtop() 會給 #defaultimg 加 margin-top 讓它閃開
        固定的 #header，所以主視覺一定要在 #defaultimg 裡面。
   套版原本的 .page.banner / .mask 仍由 Ch0002*.aspx.vb 產生，
   各內頁 .aspx 已把該控制項設為 Visible="false"，這裡再補一道保險。
   ============================================================ */
#defaultimg > .banner{ display:none; }
/* BasicCssSet-flex.css:104 給 #defaultimg 設了 line-height:0，文字要放回來 */
#defaultimg{ line-height:normal; }

.fs-ph{ position:relative; width:100%; overflow:hidden; background:var(--fs-navy); line-height:normal; }
.fs-ph__bg{ position:absolute; inset:0; line-height:0; }
.fs-ph__bg img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
/* 左側深藍、右半露出照片；最右端再壓深一點，讓 PEOPLE/IDEAS 讀得清楚 */
.fs-ph__bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(24,48,72,.97) 0%,rgba(24,48,72,.95) 36%,rgba(24,48,72,.70) 50%,rgba(24,48,72,.50) 66%,rgba(24,48,72,.62) 100%); }
/* 不用套版的 .page：2002111.css:13 的 #defaultimg .page{padding:0} 是 id+class 權重，會蓋掉留白 */
.fs-ph__wrap{ position:relative; z-index:2; max-width:var(--fs-max); margin:0 auto; padding-inline:var(--fs-gut); }
.fs-ph__in{ position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:40px;
  min-height:272px; padding:64px 0 34px; }

/* ---------- 麵包屑 ---------- */
.fs-crumb{ position:absolute; top:26px; left:0; font-size:13px; letter-spacing:.06em; line-height:1.6;
  color:rgba(255,255,255,.75); }
.fs-crumb a{ color:rgba(255,255,255,.75); text-decoration:none; }
.fs-crumb a:hover{ color:var(--fs-gold-pale); text-decoration:underline; }
.fs-crumb em{ font-style:normal; color:#fff; }
.fs-crumb i{ font-style:normal; margin:0 .6em; color:rgba(255,255,255,.45); }

/* ---------- 標題區 ----------
   中文大標由 PageHero 以頁面名稱產生；英文副標與標語來自後台「主視覺標題」，
   以「段落順序」取樣式，後台編輯器把 class 吃掉也不會走樣。 */
.fs-ph__tx{ flex:1 1 auto; max-width:58%; min-width:0; color:#fff; }
.fs-ph__t{ display:block; font-family:var(--fs-serif); font-weight:700; font-size:clamp(27px,3.2vw,42px);
  line-height:1.3; letter-spacing:.2em; color:#fff; margin:0 0 6px; }
.fs-ph__tx p{ margin:0; }
/* 第一段 ＝ 英文副標 */
.fs-ph__tx > p:first-of-type{ font-family:var(--fs-latin); font-size:clamp(15px,1.4vw,19px); letter-spacing:.32em;
  text-transform:uppercase; color:var(--fs-gold-pale); margin:0 0 15px; line-height:1.4; }
/* 之後的段落 ＝ 標語 */
.fs-ph__tx > p:first-of-type ~ p{ font-size:15px; line-height:1.95; letter-spacing:.1em; color:rgba(255,255,255,.9); }

/* ---------- 右下角品牌標語 ---------- */
.fs-ph__motto{ flex:0 0 auto; list-style:none; margin:0; padding:0 0 4px;
  font-family:var(--fs-latin); font-size:13px; letter-spacing:.24em; text-transform:uppercase;
  line-height:2.1; color:rgba(255,255,255,.88); text-shadow:0 1px 6px rgba(6,20,32,.6); }
.fs-ph__motto li{ position:relative; }
.fs-ph__motto li:first-child{ padding-left:44px; }
.fs-ph__motto li:first-child::before{ content:""; position:absolute; left:0; top:1em; width:30px; height:1px;
  background:rgba(255,255,255,.7); }

/* ============================================================
   內容區外框
   .content 上會有後台 CssClass 塞進來的類別（.prodetail / .MBLayout /
   .syis-showsubnav / .A0406 / .IFLayout…），這些是舊有勾子，不要動。
   ============================================================ */
#container > .content,
#defaultimg + .content,
.content{ background:var(--fs-ivory-2); padding:0; }
.content > .page{ max-width:var(--fs-max); width:100%; margin:0 auto; padding-inline:var(--fs-gut); }
.content .main{ padding:72px 0; }
.content .side{ padding:72px 0 0; }
/* 有側欄時，主欄留一點溝槽 */
.content .col-9.main{ padding-left:48px; }
.content .side.right{ padding-left:40px; }
.content .col-8.main{ padding-right:0; }

/* 頁面層級的路徑與分類標題：主視覺已有完整麵包屑，這裡就不重複
   （要恢復的話，改後台該頁 Element 的 P／C 旗標即可） */
.content .main > .path:first-child{ display:none; }
.content .main > .ptit{ display:none; }

/* ---------- 側欄選單 ---------- */
.content .sidetit{ font-family:var(--fs-serif); font-size:19px; font-weight:700; letter-spacing:.1em;
  color:var(--fs-navy); padding:0 0 14px; margin:0 0 4px; border-bottom:1px solid var(--fs-line); }
.content #submenu{ border:0; border-radius:0; box-shadow:none; background:transparent; }
.content .subnav ul{ font-size:15px; }
.content .subnav ul li{ border-bottom:1px solid var(--fs-line); }
.content .subnav ul li a{ color:var(--fs-navy); font-weight:400; padding:.85em .2em; letter-spacing:.04em; }
.content .subnav ul li a:hover,
.content .subnav ul li a.hit{ color:var(--fs-gold); }
.content .subnav ul li ul li a{ color:var(--fs-ink-soft); font-size:14px; padding:.6em .2em .6em 1.1em; position:relative; }
.content .subnav ul li ul li a::before{ content:""; position:absolute; left:.1em; top:1.05em; width:5px; height:1px;
  background:var(--fs-gold-light); }
.content .subtoggle{ border-bottom:1px solid var(--fs-line); color:var(--fs-navy); font-weight:700; }

/* ---------- 聯絡我們的右欄資訊卡 ---------- */
.IFLayout .side > div.col-12{ background:#fff; border:1px solid var(--fs-line); padding:26px 24px; }
.IFLayout .side h3{ font-family:var(--fs-serif); font-size:19px; font-weight:700; letter-spacing:.1em;
  color:var(--fs-navy); margin:0 0 14px; padding-bottom:12px; border-bottom:1px solid var(--fs-line); }
.IFLayout .side p[class*='col-']{ border-bottom:1px dashed var(--fs-line); font-size:14px; line-height:1.9;
  color:var(--fs-ink-soft); }
.IFLayout .side .subtit{ color:var(--fs-gold); font-family:var(--fs-latin); letter-spacing:.14em; font-weight:500; }
.IFLayout .side a{ color:var(--fs-ink-soft); }
.IFLayout .side a:hover{ color:var(--fs-gold); }

/* ============================================================
   後台所見即所得的內文：一律以元素選取，不依賴 class
   注意 UC/Multi_Content.ascx 固定輸出三個 .innerhtml（可能全空），
   所以 .innerhtml 本身不給 margin／padding／border，只給裡面的元素。
   ============================================================ */
.content .main .innerhtml{ font-size:15px; line-height:2; color:var(--fs-ink-soft); }
.content .main .innerhtml > :first-child{ margin-top:0; }
.content .main .innerhtml > :last-child{ margin-bottom:0; }
.content .main .innerhtml h1,
.content .main .innerhtml h2{ font-family:var(--fs-serif); font-weight:700; font-size:clamp(23px,2.4vw,31px);
  line-height:1.45; letter-spacing:.06em; color:var(--fs-navy); margin:52px 0 20px; }
.content .main .innerhtml h3{ font-family:var(--fs-serif); font-weight:700; font-size:20px; line-height:1.6;
  letter-spacing:.06em; color:var(--fs-navy); margin:40px 0 14px; padding-left:14px;
  border-left:3px solid var(--fs-gold); }
.content .main .innerhtml h4,
.content .main .innerhtml h5,
.content .main .innerhtml h6{ font-family:var(--fs-sans); font-weight:700; font-size:17px; letter-spacing:.06em;
  color:var(--fs-navy); margin:32px 0 12px; }
.content .main .innerhtml p{ margin:0 0 1.6em; }
.content .main .innerhtml strong,
.content .main .innerhtml b{ color:var(--fs-navy); font-weight:700; }
.content .main .innerhtml a{ color:var(--fs-gold); text-decoration:underline; text-underline-offset:.2em; }
.content .main .innerhtml a:hover{ color:var(--fs-gold-hover); }
.content .main .innerhtml ul,
.content .main .innerhtml ol{ margin:0 0 1.6em; padding-left:1.4em; }
.content .main .innerhtml ul{ list-style:none; padding-left:0; }
.content .main .innerhtml ul > li{ position:relative; padding-left:1.4em; margin-bottom:.55em; }
.content .main .innerhtml ul > li::before{ content:""; position:absolute; left:.25em; top:.92em; width:6px; height:6px;
  background:var(--fs-gold); transform:rotate(45deg); }
.content .main .innerhtml ol > li{ margin-bottom:.55em; }
.content .main .innerhtml hr{ border:0; border-top:1px solid var(--fs-line); margin:40px 0; }
.content .main .innerhtml blockquote{ margin:32px 0; padding:4px 0 4px 22px; border-left:2px solid var(--fs-gold);
  font-family:var(--fs-serif); font-size:17px; line-height:2; color:var(--fs-navy); }
.content .main .innerhtml table{ width:100%; border-collapse:collapse; margin:0 0 1.6em; font-size:14px; }
.content .main .innerhtml table th,
.content .main .innerhtml table td{ border:1px solid var(--fs-line); padding:12px 14px; text-align:left;
  vertical-align:top; line-height:1.8; }
.content .main .innerhtml table th{ background:var(--fs-card); color:var(--fs-navy); font-weight:700; }
/* 後台貼進來的固定寬度表格會撐破版面 */
.content .main .innerhtml table[width]{ width:100% !important; }
.content .main .innerhtml iframe,
.content .main .innerhtml embed,
.content .main .innerhtml video{ max-width:100%; }
/* 空的 .innerhtml（Multi_Content 固定輸出三個）不要留下空白 */
.content .main .innerhtml:empty{ display:none; }

/* 明細頁標題（Ch0002_detail 的 h1.syis）與日期 */
.content .main h1.syis{ font-family:var(--fs-serif); font-weight:700; font-size:clamp(23px,2.6vw,32px);
  line-height:1.5; letter-spacing:.06em; color:var(--fs-navy); margin:0 0 10px; }
.content .main > .path{ font-family:var(--fs-latin); font-size:14px; letter-spacing:.1em; color:var(--fs-ink-soft);
  margin:0 0 26px; padding-bottom:22px; border-bottom:1px solid var(--fs-line); }
.content .main .btn{ margin-top:3em; }
.content .main .btn a{ display:inline-flex; align-items:center; gap:.6em; padding:12px 26px; font-size:14px;
  letter-spacing:.1em; color:var(--fs-navy); border:1px solid var(--fs-line); background:#fff; cursor:pointer;
  text-decoration:none; }
.content .main .btn a:hover{ border-color:var(--fs-gold); color:var(--fs-gold); }
.content .main .relativelink{ list-style:none; margin:0; padding:0; }
.content .main .relativelink:empty{ display:none; }
.content .main h4.tit{ font-family:var(--fs-serif); font-size:17px; letter-spacing:.08em; color:var(--fs-navy);
  margin:34px 0 12px; padding-bottom:10px; border-bottom:1px solid var(--fs-line); }

/* ============================================================
   響應式（套版斷點：1286 / 960 / 767）
   ============================================================ */
@media screen and (max-width:1285px){
  .fs-ph__in{ min-height:236px; padding:56px 0 30px; }
  .content .col-9.main{ padding-left:34px; }
}
@media screen and (max-width:960px){
  .fs-ph__in{ min-height:200px; padding:52px 0 26px; }
  .fs-ph__tx{ max-width:100%; }
  .fs-ph__motto{ display:none; }
  .fs-ph__bg::after{ background:linear-gradient(90deg,rgba(24,48,72,.96) 0%,rgba(24,48,72,.88) 48%,rgba(24,48,72,.66) 100%); }
  .content .main{ padding:54px 0; }
  .content .side{ padding:54px 0 0; }
  .content .col-9.main,
  .content .side.right{ padding-left:24px; }
}
@media screen and (max-width:767px){
  .fs-ph__in{ min-height:0; padding:20px 0 28px; display:block; }
  .fs-ph__bg::after{ background:rgba(20,42,64,.88); }
  .fs-crumb{ position:static; margin-bottom:18px; font-size:12px; }
  .fs-ph__t{ letter-spacing:.14em; }
  .fs-ph__tx > p:first-of-type{ letter-spacing:.24em; }
  .content > .page{ padding-inline:var(--fs-gut); }
  .content .main{ padding:38px 0; }
  .content .side{ padding:0 0 30px; }
  .content .col-9.main,
  .content .side.right{ padding-left:0; }
  .content .main .innerhtml h1,
  .content .main .innerhtml h2{ margin:34px 0 16px; }
  .content .main .innerhtml h3{ margin:28px 0 12px; }
  /* 表格改為可橫向捲動，避免撐破 */
  .content .main .innerhtml table{ display:block; overflow-x:auto; }
  .IFLayout .side > div.col-12{ padding:20px 18px; }
}

/* ---------- 列表列（A0901／A1505／A1706 共用 .list 結構）----------
   只調字體與線條，版面沿用套版原本的 .list.imgl / .A0406 規則。
   用直接子選擇器，避免誤中明細頁小圖庫的 .simg .list。 */
.content .main > .list{ border-bottom:1px solid var(--fs-line); padding:24px 0; }
.content .main > .list:last-of-type{ border-bottom:0; }
.content .main > .list .frm{ padding:0; text-decoration:none; }
.content .main > .list h3.subject{ font-family:var(--fs-serif); font-weight:700; font-size:18px; line-height:1.65;
  letter-spacing:.04em; color:var(--fs-navy); margin:0 0 8px; padding:0; transition:color .25s; }
.content .main > .list .frm:hover h3.subject{ color:var(--fs-gold); }
.content .main > .list .path{ font-family:var(--fs-latin); font-size:13px; letter-spacing:.12em;
  color:var(--fs-ink-soft); display:block; margin:0 0 8px; }
.content .main > .list .innerhtml{ font-size:14px; line-height:1.9; color:var(--fs-ink-soft); padding-top:0; }
.content .main > .list .more{ text-align:left; margin:14px 0 0; }
.content .main > .list .more span{ display:inline-flex; align-items:center; gap:.5em; font-size:13px;
  letter-spacing:.1em; color:var(--fs-gold); }
.content .main > .list .more span::after{ content:"→"; transition:transform .25s; }
/* 套版原本 hover 會把 more 變成紅色 */
.content .main > .list .frm:hover .more{ color:inherit; }
.content .main > .list .frm:hover .more span::after{ transform:translateX(4px); }
.content .main > .list figure{ background:var(--fs-card); overflow:hidden; }
.content .main > .list figure img{ display:block; width:100%; height:auto; }
.content .main > .list .frm:hover figure img{ transform:scale(1.03); }
/* 團隊列表：人像統一 4:5，避免每列高度參差 */
.content .main > .list.imgl figure{ aspect-ratio:4/5; }
.content .main > .list.imgl figure img{ width:100%; height:100%; max-width:none; object-fit:cover;
  object-position:center 20%; }
@media screen and (max-width:767px){
  .content .main > .list{ padding:20px 0; }
  .content .main > .list.imgl figure{ aspect-ratio:3/2; }
}

/* A1706 明細頁的 CssClass 是 prodetail，Selfedit.css 讓 h1 浮動半寬（原本搭配左側大圖）。
   本站服務明細沒有圖，改回整寬。 */
.prodetail .main h1.syis{ width:100%; float:none; }
.prodetail .main .cnt::before{ display:none; }

/* ============================================================
   聯絡表單（Contact4）
   套版 BasicCssSet-flex.css:178-179 把 input／textarea 設成
   border:none; background:#fff，在淺色底上等於看不見，這裡整組重寫。
   ============================================================ */
.content .main .syisform{ padding:0; margin:34px -10px 0; line-height:1.8; }
.content .main .syisform div[class*="col-"]{ padding:0 10px 22px; }

.content .main .syisform label{ display:block; font-size:14px; font-weight:700; letter-spacing:.06em;
  color:var(--fs-navy); margin:0 0 8px; }
.content .main .syisform label i{ font-style:normal; color:#c0392b; margin-right:.35em; }

.content .main .syisform input[type='text'],
.content .main .syisform input[type='tel'],
.content .main .syisform input[type='email'],
.content .main .syisform input[type='password'],
.content .main .syisform select,
.content .main .syisform textarea{
  width:100%; box-sizing:border-box; display:block;
  background:#fff; border:1px solid #cfc8bb; border-radius:0;
  height:48px; padding:0 14px;
  font-family:var(--fs-sans); font-size:15px; line-height:1.6; color:var(--fs-ink);
  transition:border-color .2s, box-shadow .2s; -webkit-appearance:none; appearance:none; }
.content .main .syisform textarea{ height:auto; min-height:180px; padding:13px 14px; line-height:1.9;
  resize:vertical; }
.content .main .syisform input:hover,
.content .main .syisform textarea:hover{ border-color:var(--fs-gold-light); }
.content .main .syisform input:focus,
.content .main .syisform textarea:focus{ outline:0; border-color:var(--fs-gold);
  box-shadow:0 0 0 3px rgba(160,135,87,.18); }
.content .main .syisform input::placeholder,
.content .main .syisform textarea::placeholder{ color:#a7a19a; }
/* 瀏覽器內建驗證：只在使用者真的填過又不合格時才標紅。
   不能用 :invalid（沒填的必填欄位一載入就是 invalid，整排會變紅）。 */
.content .main .syisform input:user-invalid,
.content .main .syisform textarea:user-invalid{ border-color:#c0392b; }

/* 驗證碼：圖片與輸入框同一列 */
.content .main .syisform .fs-vc__row{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
/* 驗證碼圖只有 52x20，拉高會模糊，改用內距把外框撐到與輸入框同高 */
.content .main .syisform .fs-vc__row img{ display:block; height:auto; width:auto; max-height:22px;
  border:1px solid #cfc8bb; background:#fff; padding:12px 16px; box-sizing:content-box; }
.content .main .syisform .fs-vc__row input[type='text']{ width:8em; letter-spacing:.2em; text-align:center; }

/* 送出／清除 */
.content .main .syisform .btn{ display:flex; gap:12px; flex-wrap:wrap; margin-top:4px; text-align:left; }
.content .main .syisform .fs-formbtn{ display:inline-flex; align-items:center; justify-content:center;
  min-width:160px; padding:14px 30px; font-size:15px; letter-spacing:.12em; cursor:pointer;
  text-decoration:none; border:1px solid #cfc8bb; background:#fff; color:var(--fs-navy);
  transition:background .2s, border-color .2s, color .2s; }
.content .main .syisform .fs-formbtn:hover{ border-color:var(--fs-navy); }
.content .main .syisform .fs-formbtn--send{ background:var(--fs-gold); border-color:var(--fs-gold); color:#fff; }
.content .main .syisform .fs-formbtn--send:hover{ background:var(--fs-gold-hover);
  border-color:var(--fs-gold-hover); color:#fff; }

/* 表單上方的說明文字 */
.Contact4 .main > .innerhtml{ font-size:15px; line-height:2; color:var(--fs-ink-soft);
  padding-bottom:22px; border-bottom:1px solid var(--fs-line); }

/* 頁尾地圖（在 .page 之外，滿版） */
.gmap{ clear:both; width:100%; line-height:0; }
.gmap iframe{ width:100%; display:block; border:0; }

@media screen and (max-width:767px){
  .content .main .syisform{ margin-top:26px; }
  .content .main .syisform div[class*="col-"]{ padding:0 10px 18px; }
  .content .main .syisform .fs-formbtn{ flex:1 1 100%; min-width:0; }
  .content .main .syisform textarea{ min-height:150px; }
}

/* ---------- 內文中的圖片列（後台以 <div class="fs-figrow"> 包住多張圖）----------
   三張圖統一裁成 16:9；橫式的招牌照在 16:9 不會被切掉邊框，
   直式的照片則取中段，整列高度才會一致。 */
.content .main .innerhtml .fs-figrow{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
  margin:10px 0 1.6em; }
.content .main .innerhtml .fs-figrow figure{ margin:0; position:relative; aspect-ratio:16/9; overflow:hidden;
  background:var(--fs-card); border:1px solid var(--fs-line); }
.content .main .innerhtml .fs-figrow a{ display:block; width:100%; height:100%; text-decoration:none; }
.content .main .innerhtml .fs-figrow img{ width:100%; height:100%; max-width:none; object-fit:cover;
  object-position:center; display:block; transition:transform .6s ease; }
.content .main .innerhtml .fs-figrow a:hover img{ transform:scale(1.05); }
/* 點擊放大的提示：右下角一個小十字 */
.content .main .innerhtml .fs-figrow a::after{ content:""; position:absolute; right:10px; bottom:10px;
  width:26px; height:26px; background:rgba(12,36,54,.72); opacity:0; transition:opacity .25s; z-index:2; }
.content .main .innerhtml .fs-figrow a::before{ content:""; position:absolute; right:21px; bottom:15px;
  width:4px; height:16px; box-shadow:-6px 6px 0 0 #fff, 0 0 0 0 #fff; opacity:0; transition:opacity .25s; z-index:3; }
.content .main .innerhtml .fs-figrow a:hover::after,
.content .main .innerhtml .fs-figrow a:hover::before{ opacity:1; }
.content .main .innerhtml .fs-figrow figcaption{ position:absolute; left:0; right:0; bottom:0; padding:8px 12px;
  font-size:13px; letter-spacing:.04em; color:#fff; background:linear-gradient(180deg,rgba(12,36,54,0),rgba(12,36,54,.78)); }

/* 單獨成段的圖片（後台直接貼圖時）：置中、限寬，不要整欄撐滿 */
.content .main .innerhtml p > img:only-child{ display:block; margin:0 auto; max-width:min(100%,760px); }

@media screen and (max-width:960px){
  .content .main .innerhtml .fs-figrow{ gap:14px; }
}
@media screen and (max-width:767px){
  .content .main .innerhtml .fs-figrow{ grid-template-columns:1fr; gap:16px; }
}

/* ---------- 專業團隊列表（A0901）----------
   列表摘要放的是每位律師的「經歷」，長度從 1 到 10 項不等，
   所以用多欄排版把右側空白填掉，列高由照片決定，整排才會整齊。 */
.syis-showsubnav .main > .list{ padding:30px 0; }
.syis-showsubnav .main > .list.imgl figure{ width:220px; aspect-ratio:4/5; padding:0; }
.syis-showsubnav .main > .list.imgl section{ width:calc(100% - 220px); padding:2px 0 0 32px; }
.syis-showsubnav .main > .list h3.subject{ font-size:21px; letter-spacing:.06em; margin:0 0 14px;
  padding-bottom:14px; border-bottom:1px solid var(--fs-line); }
/* 經歷清單 */
.syis-showsubnav .main > .list .innerhtml{ position:relative; }
.syis-showsubnav .main > .list .innerhtml::before{ content:"經歷"; display:block;
  font-family:var(--fs-latin); font-size:12px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--fs-gold); margin:0 0 10px; }
.syis-showsubnav .main > .list .innerhtml ul{ list-style:none; margin:0; padding:0;
  columns:2; column-gap:34px; }
.syis-showsubnav .main > .list .innerhtml ul li{ break-inside:avoid; -webkit-column-break-inside:avoid;
  position:relative; padding-left:15px; margin:0 0 .5em; font-size:14px; line-height:1.75;
  color:var(--fs-ink-soft); }
.syis-showsubnav .main > .list .innerhtml ul li::before{ content:""; position:absolute; left:0; top:.72em;
  width:5px; height:5px; background:var(--fs-gold-light); transform:rotate(45deg); }
.syis-showsubnav .main > .list .more{ margin-top:16px; }

@media screen and (max-width:1285px){
  .syis-showsubnav .main > .list.imgl figure{ width:190px; }
  .syis-showsubnav .main > .list.imgl section{ width:calc(100% - 190px); padding-left:26px; }
}
@media screen and (max-width:960px){
  .syis-showsubnav .main > .list .innerhtml ul{ columns:1; }
}
@media screen and (max-width:767px){
  .syis-showsubnav .main > .list{ padding:22px 0; }
  /* 經歷擠在照片旁邊會讓每列高矮差很多，手機改成照片在上、文字整寬 */
  .syis-showsubnav .main > .list.imgl figure{ width:144px; aspect-ratio:4/5; }
  .syis-showsubnav .main > .list.imgl section{ width:100%; padding:16px 0 0; }
  .syis-showsubnav .main > .list h3.subject{ font-size:17px; margin-bottom:10px; padding-bottom:10px; }
  .syis-showsubnav .main > .list .innerhtml ul li{ font-size:13px; line-height:1.7; }
}

/* ============================================================
   律師明細頁（A0901_detail，後台 CssClass = MBLayout）
   套版原本讓照片 33% 浮左、標題 66% 浮右，但介紹內容是 100% 寬、
   排在照片「下方」，照片右側整塊留白。改成 grid 兩欄：
   左欄照片，右欄姓名＋完整介紹。
   （grid 項目會忽略 float，套版的 float:left/right 自動失效）
   ============================================================ */
.MBLayout .main{ display:grid; grid-template-columns:330px minmax(0,1fr); column-gap:46px;
  align-items:start; }
/* 照片要跨滿所有列，否則第 1 列會被照片撐高，介紹就被推到照片下方 */
.MBLayout .main > figure{ grid-column:1; grid-row:1 / span 99; width:100%; max-width:none; margin:0;
  padding:0; overflow:hidden; background:var(--fs-card); align-self:start; }
.MBLayout .main > figure img{ width:100%; height:auto; max-width:none; display:block; }
.MBLayout .main > h1.syis{ grid-column:2; grid-row:1; width:auto; float:none; padding:0;
  margin:0 0 4px; }
.MBLayout .main > .innerhtml{ grid-column:2; width:auto; float:none; }
.MBLayout .main > .path{ grid-column:1 / -1; }
/* 介紹第一段的 h3（學歷）緊接在姓名下方，不需要再留一大段上緣 */
.MBLayout .main > .innerhtml.cnt > h3:first-child{ margin-top:22px; }

@media screen and (max-width:1285px){
  .MBLayout .main{ grid-template-columns:280px minmax(0,1fr); column-gap:34px; }
}
@media screen and (max-width:767px){
  /* 手機：照片與姓名並排，介紹整寬排在下面 */
  .MBLayout .main{ grid-template-columns:144px minmax(0,1fr); column-gap:16px; }
  .MBLayout .main > figure{ grid-column:1; grid-row:1; align-self:start; }
  .MBLayout .main > h1.syis{ grid-column:2; grid-row:1; align-self:center; font-size:19px; }
  .MBLayout .main > .innerhtml{ grid-column:1 / -1; }
  .MBLayout .main > .innerhtml.cnt > h3:first-child{ margin-top:26px; }
}

/* ---------- 專業團隊列表：手機版 ----------
   姓名要在照片右邊，經歷整寬排在下面。姓名與經歷原本都包在 <section> 裡，
   用 display:contents 讓它們直接成為 .frm 這個 grid 的項目。 */
@media screen and (max-width:767px){
  .syis-showsubnav .main > .list .frm{ display:grid; grid-template-columns:144px minmax(0,1fr);
    column-gap:16px; row-gap:0; align-items:start; }
  .syis-showsubnav .main > .list.imgl figure{ grid-column:1; grid-row:1; width:100%; padding:0; }
  .syis-showsubnav .main > .list.imgl section{ display:contents; }
  .syis-showsubnav .main > .list h3.subject{ grid-column:2; grid-row:1; align-self:center;
    margin:0; padding:0 0 12px; border-bottom:1px solid var(--fs-line); }
  .syis-showsubnav .main > .list .innerhtml{ grid-column:1 / -1; grid-row:2; padding-top:18px; }
}
