/* ============================================================
   錦品徵信社｜關於我們 about.css
   設計語言：奶油色底 × 橘黃主色 × 白色圓角卡片 × 幾何裝飾
   命名皆以 ab- 前綴，避免與 style0903.css 衝突
   ============================================================ */

:root{
  --ab-cream:#FBF2E3;        /* 全頁底色 */
  --ab-cream-soft:#FDF8EF;   /* 淺色面板 */
  --ab-white:#FFFFFF;
  --ab-orange:#E8702A;       /* 主橘 */
  --ab-orange-deep:#D25514;  /* 深橘（hover） */
  --ab-orange-soft:#F5B078;  /* 淺橘 */
  --ab-yellow:#F3B71E;       /* 主黃 */
  --ab-ink:#694209;          /* 主要文字（深棕黑） */
  --ab-ink-soft:#6E6252;     /* 次要文字 */
  --ab-line:#EFDFC6;         /* 分隔線 */
  --ab-radius:14px;
  --ab-shadow:0 6px 24px rgba(210,110,40,.08);
}

.ab-body {}
.ab-main {background:var(--ab-cream);color:var(--ab-ink);}
.ab-main p{line-height:1.95;font-size: 16px;font-weight: 600;}
.ab-main a{color:var(--ab-orange);}
.ab-main strong{color:var(--ab-orange-deep);}
.ab-wrap{max-width:1080px;margin:0 auto;padding:0 20px;}
.ab-section{padding:70px 0;}
.ab-section--panel{background:var(--ab-white);border-radius:32px;margin:0 16px;padding:70px 0;}

/* ---------- Eyebrow 小節標 ---------- */
.ab-eyebrow{
  color:var(--ab-orange);
  font-weight:700;
  font-size:15px;
  letter-spacing:2px;
  display:flex;align-items:center;gap:6px;
  margin-bottom:14px;
}
.ab-eyebrow--center{justify-content:center;}
.ab-dot{width:10px;height:10px;border-radius:50%;background:var(--ab-orange);display:inline-block;}
.ab-dot--light{background:var(--ab-yellow);margin-left:-2px;}

/* ---------- 區塊標題 ---------- */
.ab-sec-title{
  font-size:clamp(24px,3vw,34px);
  line-height:1.5;
  margin-bottom:14px;
  padding-bottom:18px;
  border-bottom:2px solid var(--ab-line);
  position:relative;
}
.ab-sec-title::after{
  content:"";position:absolute;left:0;bottom:-2px;
  width:120px;height:2px;background:var(--ab-orange);
}

/* ---------- HERO ---------- */
.ab-hero{padding:60px 0 80px;}
.ab-hero-inner{
  max-width:1140px;margin:0 auto;padding:0 20px;
  display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;
}
.ab-hero h1{
  font-size:clamp(26px,3.4vw,40px);
  line-height:1.55;
  margin:6px 0 24px;
}
.ab-mark{
  background:linear-gradient(transparent 62%, var(--ab-yellow) 62%);
  color:var(--ab-orange-deep);
  padding:0 4px;
}
.ab-hero-lead{color:var(--ab-ink-soft);margin-bottom:16px;text-align:justify;}
.ab-hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px;justify-content:flex-start;}
.ab-cta .ab-hero-cta{justify-content:center;}

/* ---------- 按鈕 ---------- */
.ab-btn{
  display:inline-block;
  padding:14px 30px;
  border-radius:999px;
  font-weight:700;
  font-size:16px;
  transition:transform .25s ease, background-color .25s ease, color .25s ease, box-shadow .25s ease;
}
.ab-btn--solid{background:var(--ab-orange);color:#fff !important;box-shadow:var(--ab-shadow);}
.ab-btn--solid:hover{background:var(--ab-orange-deep);transform:translateY(-3px);}
.ab-btn--ghost{border:2px solid var(--ab-orange);color:var(--ab-orange) !important;background:transparent;}
.ab-btn--ghost:hover{background:var(--ab-yellow);border-color:var(--ab-yellow);color:var(--ab-ink) !important;transform:translateY(-3px);}

/* ---------- Placeholder 圖片色塊 ---------- */
.ab-ph{
  position:relative;
  border-radius:var(--ab-radius);
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  overflow:hidden;
  background:
    repeating-linear-gradient(45deg, rgba(255,255,255,.28) 0 14px, transparent 14px 28px),
    linear-gradient(135deg, var(--ab-yellow), var(--ab-orange));
}
.ab-ph-label{
  background:rgba(255,255,255,.92);
  color:var(--ab-ink);
  font-size:13px;
  line-height:1.8;
  font-weight:700;
  padding:10px 16px;
  border-radius:10px;
  letter-spacing:1px;
}
.ab-ph--hero{aspect-ratio:3/2;box-shadow:var(--ab-shadow);}
.ab-ph--card{aspect-ratio:4/3;width:100%;}
.ab-ph--story{aspect-ratio:1000/420;margin-bottom:28px;}

/* 卡片實際圖片 */
.ab-card-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
  border-radius:var(--ab-radius);
}

/* 主視覺圖片 */
.ab-hero-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
}

/* 案例故事圖片 */
.ab-story img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1000/420;
  object-fit:cover;
  border-radius:var(--ab-radius);
  margin-bottom:28px;
}

/* ---------- 幾何裝飾（設計簽名元素） ---------- */
.ab-hero-visual{position:relative;isolation:isolate;}
.ab-shape{position:absolute;pointer-events:none;}
.ab-shape--quarter{
  width:84px;height:84px;
  background:var(--ab-yellow);
  border-radius:0 0 84px 0;
  top:-28px;left:-28px;
  z-index:-1;
}
.ab-shape--ring{
  width:64px;height:64px;
  border:12px solid var(--ab-orange-soft);
  border-radius:50%;
  bottom:-22px;right:-18px;
  z-index:-1;
}

/* ---------- Promise 卡片 ---------- */
.ab-card{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:38px;
  margin-top:34px;
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:36px;
  align-items:center;
}
.ab-card:nth-of-type(even){grid-template-columns:.7fr 1.3fr;}
.ab-card:nth-of-type(even) .ab-card-body{order:2;}
.ab-card:nth-of-type(even) .ab-card-visual{order:1;}
.ab-card-no{
  color:var(--ab-orange);font-weight:700;font-size:14px;letter-spacing:2px;
  display:flex;align-items:center;gap:8px;margin-bottom:10px;
}
.ab-card-no .ab-dot{width:8px;height:8px;}
.ab-card-h{font-size:clamp(20px,2.2vw,26px);line-height:1.6;margin-bottom:16px;}
.ab-card-body p{color:var(--ab-ink-soft);margin-bottom:12px;text-align:justify;}

/* ---------- 案例故事 ---------- */
.ab-story{margin-top:30px;}
.ab-story p{color:var(--ab-ink-soft);margin-bottom:16px;text-align:justify;}
.ab-note{
  background:var(--ab-cream-soft);
  border-left:6px solid var(--ab-yellow);
  border-radius:0 var(--ab-radius) var(--ab-radius) 0;
  padding:22px 26px;
  margin-top:24px;
}
.ab-note p{margin:0;}

/* ---------- Flow 步驟卡 ---------- */
.ab-flow{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  gap:12px;
  align-items:stretch;
  margin:36px 0 10px;
}
.ab-flow-step{
  border:2px solid var(--ab-orange);
  border-radius:var(--ab-radius);
  background:var(--ab-cream-soft);
  padding:22px 18px;
  transition:transform .25s ease, box-shadow .25s ease;
}
.ab-flow-step:hover{transform:translateY(-4px);box-shadow:var(--ab-shadow);}
.ab-flow-no{color:var(--ab-orange);font-weight:700;font-size:13px;letter-spacing:2px;margin-bottom:8px;text-align:center;}
.ab-flow-h{font-size:18px;text-align:center;margin-bottom:10px;padding-bottom:10px;border-bottom:1px dashed var(--ab-line);}
.ab-flow-step p:last-child{font-size:14px;color:var(--ab-ink-soft);line-height:1.8;text-align:justify;}
.ab-flow-arrow{align-self:center;color:var(--ab-orange);font-size:14px;}

/* ---------- FAQ 手風琴 ---------- */
.ab-faq{margin-top:30px;}
.ab-faq-item{border-bottom:1px solid var(--ab-line);background:transparent;}
.ab-faq-item:first-child{border-top:1px solid var(--ab-line);}
.ab-faq-q{margin:0;}
.ab-faq-btn{
  width:100%;height:auto;
  display:flex;align-items:center;gap:14px;
  background:transparent;border:none;border-radius:0;
  padding:20px 8px;
  font-size:17px;font-weight:700;color:var(--ab-ink);
  text-align:left;cursor:pointer;
  font-family:inherit;letter-spacing:1px;
  transition:color .2s ease;
}
.ab-faq-btn:hover{color:var(--ab-orange);}
.ab-faq-btn:focus-visible{outline:3px solid var(--ab-yellow);outline-offset:2px;}
.ab-faq-mark{
  flex:none;
  width:32px;height:32px;border-radius:50%;
  background:var(--ab-orange);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:900;
}
.ab-faq-toggle{
  margin-left:auto;flex:none;
  width:22px;height:22px;position:relative;
}
.ab-faq-toggle::before,.ab-faq-toggle::after{
  content:"";position:absolute;background:var(--ab-orange);
  transition:transform .3s ease;
}
.ab-faq-toggle::before{left:0;top:10px;width:22px;height:2px;}
.ab-faq-toggle::after{left:10px;top:0;width:2px;height:22px;}
.ab-faq-btn[aria-expanded="true"] .ab-faq-toggle::after{transform:scaleY(0);}
.ab-faq-a{
  max-height:0;overflow:hidden;
  transition:max-height .35s ease;
}
.ab-faq-a-inner{padding:0 8px 22px 54px;}
.ab-faq-a-inner p{color:var(--ab-ink-soft);}

/* ---------- CTA ---------- */
.ab-cta{
  position:relative;
  text-align:center;
  background:var(--ab-cream-soft);
  border-top:1px solid var(--ab-line);
  padding:80px 20px 90px;
  overflow:hidden;
}
.ab-cta-title{font-size:clamp(22px,2.8vw,32px);font-weight:900;margin-bottom:10px;}
.ab-cta-sub{color:var(--ab-ink-soft);}
/* 幾何愛心（方塊＋圓組合） */
.ab-shape--heart{top:24px;right:6%;width:96px;height:96px;opacity:.85;}
.ab-shape--heart i{position:absolute;display:block;}
.ab-shape--heart i:nth-child(1){width:48px;height:48px;background:var(--ab-orange);border-radius:50% 50% 0 0;left:0;top:14px;}
.ab-shape--heart i:nth-child(2){width:48px;height:48px;background:var(--ab-yellow);border-radius:50% 50% 0 0;left:38px;top:14px;transform:rotate(90deg);}
.ab-shape--heart i:nth-child(3){width:48px;height:48px;background:var(--ab-orange-soft);left:19px;top:40px;transform:rotate(45deg);}

/* ---------- 進場動畫 ---------- */
.ab-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease, transform .7s ease;}
.ab-reveal.is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .ab-reveal{opacity:1;transform:none;transition:none;}
  .ab-btn,.ab-flow-step{transition:none;}
}

/* ============================================================
   響應式
   ============================================================ */
@media (max-width: 992px){
  .ab-hero{padding:40px 0 56px;}
  .ab-hero-inner{grid-template-columns:1fr;gap:32px;}
  .ab-card,.ab-card:nth-of-type(even){grid-template-columns:1fr;padding:26px;}
  .ab-card:nth-of-type(even) .ab-card-body{order:1;}
  .ab-card:nth-of-type(even) .ab-card-visual{order:2;}
  .ab-flow{grid-template-columns:1fr 1fr;}
  .ab-flow-arrow{display:none;}
}
@media (max-width: 600px){
  .ab-section{padding:48px 0;}
  .ab-section--panel{margin:0 8px;border-radius:20px;}
  .ab-main p{font-size:15px;}
  .ab-flow{grid-template-columns:1fr;}
  .ab-hero-cta{flex-direction:column;}
  .ab-btn{text-align:center;}
  .ab-faq-btn{font-size:15px;padding:16px 4px;}
  .ab-faq-a-inner{padding-left:46px;}
  .ab-shape--heart{display:none;}
}

/* ============================================================
   ser16.html｜徵信社服務項目全解析 追加樣式
   沿用 about.css 的 --ab-* 設計變數（奶油底 × 橘黃主色 × 白卡片）
   新增前綴：sv-（service）
   ============================================================ */

/* ---------- 快速導覽 目錄卡 ---------- */
.sv-toc{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  border-left:6px solid var(--ab-orange);
  padding:30px 34px;
  margin-top:28px;
}
.sv-toc-h{
  font-size:20px;
  margin-bottom:16px;
  padding-bottom:12px;
  border-bottom:1px dashed var(--ab-line);
  display:flex;align-items:center;gap:10px;
}
.sv-toc-h .ab-dot{width:10px;height:10px;}
.sv-toc ol{
  list-style:none;
  margin:0;padding:0;
  counter-reset:svtoc;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:10px 26px;
  width:100%;
}
.sv-toc ol li{display:block;width:auto;margin:0;list-style:none;}
.sv-toc li{counter-increment:svtoc;}
/* 注意：.sv-toc 本身是 <nav>，需覆寫 style0903.css 的全域 nav a 樣式
   （nav a{width:100px} 第25行、nav a:hover{transform:scale(1.2)} 第27行、
     nav a{width:7%;max-width:130px} 第148行 @media max-width:992px） */
nav.sv-toc ol li a{
  display:flex;align-items:flex-start;gap:12px;
  width:auto !important;max-width:none !important;height:auto;
  margin:0;text-align:left;
  padding:10px 12px;
  border-radius:10px;
  font-weight:700;
  font-size:15.5px;
  line-height:1.7;
  color:var(--ab-ink) !important;
  transform:none;
  transition:background-color .25s ease, transform .25s ease, color .25s ease;
}
nav.sv-toc ol li a::before{
  content:counter(svtoc,decimal-leading-zero);
  flex:none;
  width:28px;height:28px;border-radius:50%;
  background:var(--ab-yellow);color:var(--ab-ink);
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:900;letter-spacing:0;
}
nav.sv-toc ol li a:hover{background:var(--ab-cream-soft);color:var(--ab-orange-deep) !important;transform:translateX(4px) scale(1);}
nav.sv-toc ol li a:hover::before{background:var(--ab-orange);color:#fff;}

/* ---------- 服務項目 磁磚牆 ---------- */
.sv-tiles{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:14px;
  margin-top:28px;
}
.sv-tile{
  position:relative;
  display:flex;align-items:center;gap:12px;
  background:var(--ab-white);
  border:2px solid var(--ab-line);
  border-radius:var(--ab-radius);
  padding:18px 18px 18px 16px;
  font-weight:700;
  font-size:16px;
  line-height:1.6;
  color:var(--ab-ink) !important;
  overflow:hidden;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease, color .25s ease;
}
.sv-tile::before{
  content:"";
  flex:none;
  width:10px;height:10px;border-radius:50%;
  background:var(--ab-orange-soft);
  transition:background-color .25s ease, transform .25s ease;
}
.sv-tile::after{
  content:"";
  position:absolute;right:-18px;bottom:-18px;
  width:56px;height:56px;border-radius:50%;
  background:var(--ab-yellow);
  opacity:.18;
  transition:transform .3s ease, opacity .3s ease;
}
.sv-tile:hover{
  border-color:var(--ab-orange);
  color:var(--ab-orange-deep) !important;
  transform:translateY(-4px);
  box-shadow:var(--ab-shadow);
}
.sv-tile:hover::before{background:var(--ab-orange);transform:scale(1.3);}
.sv-tile:hover::after{transform:scale(1.35);opacity:.32;}

/* ---------- 服務項目 分類群組 ---------- */
.sv-group{margin-top:30px;}
.sv-group + .sv-group{margin-top:34px;}
.sv-group-h{
  display:flex;align-items:center;gap:12px;
  font-size:18px;line-height:1.5;
  margin-bottom:16px;
  padding-bottom:12px;
  border-bottom:2px solid var(--ab-line);
}
/* 群組序號徽章（純 CSS，無需圖片） */
.sv-group-badge{
  flex:none;
  width:34px;height:34px;border-radius:10px;
  background:linear-gradient(135deg,var(--ab-yellow),var(--ab-orange));
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:900;letter-spacing:0;
}
.sv-group-note{
  font-size:14px;font-weight:700;
  color:var(--ab-ink-soft);
  margin-left:auto;
  letter-spacing:.5px;
}
.sv-group .sv-tiles{margin-top:0;}

@media (max-width: 600px){
  .sv-group-h{font-size:16.5px;gap:9px;flex-wrap:wrap;}
  .sv-group-badge{width:30px;height:30px;font-size:13px;}
  .sv-group-note{margin-left:0;flex-basis:100%;font-size:13px;}
}

/* ---------- 四大服務類型 卡片 ---------- */
.sv-types{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
  margin-top:32px;
}
.sv-type{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:0 0 26px;
  overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .28s ease, box-shadow .28s ease;
}
.sv-type:hover{transform:translateY(-5px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
/* 類型卡頂部為 CSS 漸層色帶。若日後要換成實際圖片，建議尺寸 640×360px（16:9），檔名如 img/ser16-type01.jpg */
.sv-type-top{
  position:relative;
  padding:22px 26px 20px;
  background:linear-gradient(135deg,var(--ab-yellow),var(--ab-orange));
  color:#fff;
}
.sv-type:nth-child(2) .sv-type-top{background:linear-gradient(135deg,var(--ab-orange-soft),var(--ab-orange-deep));}
.sv-type:nth-child(3) .sv-type-top{background:linear-gradient(135deg,var(--ab-orange),var(--ab-yellow));}
.sv-type:nth-child(4) .sv-type-top{background:linear-gradient(135deg,var(--ab-orange-deep),var(--ab-orange-soft));}
.sv-type-no{
  font-size:13px;font-weight:900;letter-spacing:3px;
  opacity:.9;margin-bottom:6px;
}
.sv-type-h{font-size:clamp(19px,2vw,22px);line-height:1.55;color:#fff;margin:0;}
.sv-type-sub{
  display:block;
  font-size:14px;font-weight:700;
  opacity:.92;margin-top:6px;letter-spacing:.5px;
}
/* 幾何裝飾：右上角半透明圓 */
.sv-type-top::after{
  content:"";position:absolute;top:-26px;right:-26px;
  width:78px;height:78px;border-radius:50%;
  background:rgba(255,255,255,.22);
}
.sv-type-body{padding:22px 26px 0;}
.sv-type-body p{color:var(--ab-ink-soft);text-align:justify;margin:0;}

/* ---------- 延伸服務 標籤群 ---------- */
.sv-extend{
  background:var(--ab-cream-soft);
  border-radius:var(--ab-radius);
  border:2px dashed var(--ab-orange-soft);
  padding:28px 30px;
  margin-top:30px;
}
.sv-extend-h{font-size:19px;margin-bottom:8px;}
.sv-extend > p{color:var(--ab-ink-soft);margin-bottom:16px;text-align:justify;}
.sv-tags{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;}
.sv-tags li{margin:0;}
.sv-tag{
  display:inline-block;
  background:var(--ab-white);
  border:1px solid var(--ab-line);
  border-radius:999px;
  padding:9px 18px;
  font-size:15px;font-weight:700;
  color:var(--ab-ink) !important;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease, transform .22s ease;
}
.sv-tag:hover{background:var(--ab-orange);border-color:var(--ab-orange);color:#fff !important;transform:translateY(-2px);}
.sv-tag--plain{cursor:default;}
.sv-tag--plain:hover{background:var(--ab-yellow);border-color:var(--ab-yellow);color:var(--ab-ink) !important;}

/* ---------- 委託注意事項 檢核清單 ---------- */
.sv-checks{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
  margin-top:32px;
  counter-reset:svchk;
}
.sv-check{
  counter-increment:svchk;
  position:relative;
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:28px;
  border-top:5px solid var(--ab-orange);
  transition:transform .25s ease, box-shadow .25s ease;
}
.sv-check:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
.sv-check-no{
  position:absolute;top:-2px;right:22px;
  font-size:44px;font-weight:900;line-height:1;
  color:var(--ab-yellow);opacity:.55;
  pointer-events:none;
}
.sv-check-h{
  font-size:18px;line-height:1.6;
  margin-bottom:12px;padding-bottom:12px;
  border-bottom:1px dashed var(--ab-line);
  display:flex;align-items:flex-start;gap:10px;
  position:relative;z-index:1;
}
.sv-check-h::before{
  content:"\2713";
  flex:none;
  width:26px;height:26px;border-radius:50%;
  background:var(--ab-orange);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:900;
}
.sv-check p{color:var(--ab-ink-soft);text-align:justify;margin:0;}

/* ---------- 品保雙軌 對照 ---------- */
.sv-split{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:18px;align-items:stretch;
  margin-top:32px;
}
.sv-split-col{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:28px 26px;
  border-top:5px solid var(--ab-yellow);
}
.sv-split-col:last-child{border-top-color:var(--ab-orange);}
.sv-split-h{font-size:18px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px dashed var(--ab-line);}
.sv-split-col p{color:var(--ab-ink-soft);text-align:justify;margin:0;}
.sv-split-mid{
  align-self:center;
  width:46px;height:46px;border-radius:50%;
  background:var(--ab-orange);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:900;
  box-shadow:var(--ab-shadow);
}

/* ---------- 側欄 徵信服務連結 ---------- */
.sv-aside{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:0 0 26px;
  overflow:hidden;
  margin-top:34px;
}
.sv-aside-head{
  background:linear-gradient(135deg,var(--ab-orange),var(--ab-yellow));
  color:#fff;
  padding:22px 26px;
}
.sv-aside-head p{margin:0;font-size:20px;font-weight:900;letter-spacing:1px;}
.sv-aside-head span{display:block;font-size:14px;font-weight:700;opacity:.92;margin-top:4px;letter-spacing:1px;}
.sv-aside-group{padding:22px 26px 0;}
.sv-aside-group-h{
  font-size:17px;
  margin-bottom:12px;
  display:flex;align-items:center;gap:8px;
}
.sv-aside-group-h .ab-dot{width:8px;height:8px;}
.sv-aside-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:9px;}
.sv-aside-list li{margin:0;}
.sv-aside-list a{
  display:inline-block;
  background:var(--ab-cream-soft);
  border:1px solid var(--ab-line);
  border-radius:999px;
  padding:8px 16px;
  font-size:14.5px;font-weight:700;
  color:var(--ab-ink) !important;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease, transform .22s ease;
}
.sv-aside-list a:hover{background:var(--ab-orange);border-color:var(--ab-orange);color:#fff !important;transform:translateY(-2px);}

/* ---------- 頁內 H3 小節標題 ---------- */
.sv-sub-h{
  font-size:clamp(19px,2.1vw,23px);
  line-height:1.6;
  margin:34px 0 14px;
  padding-left:16px;
  border-left:5px solid var(--ab-orange);
}

/* ---------- 錨點偏移（避免固定元素遮住標題） ---------- */
.sv-anchor{scroll-margin-top:24px;}

/* ============================================================
   ser16 響應式
   ============================================================ */
@media (max-width: 992px){
  .sv-toc ol{grid-template-columns:1fr;}
  .sv-types{grid-template-columns:1fr;}
  .sv-checks{grid-template-columns:1fr;}
  .sv-split{grid-template-columns:1fr;}
  .sv-split-mid{transform:rotate(90deg);margin:0 auto;}
}
@media (max-width: 600px){
  .sv-toc{padding:22px 20px;}
  .sv-tiles{grid-template-columns:1fr;}
  .sv-tile{font-size:15px;padding:15px 16px;}
  .sv-type-top,.sv-type-body{padding-left:20px;padding-right:20px;}
  .sv-extend{padding:22px 20px;}
  .sv-check{padding:22px 20px;}
  .sv-aside-head,.sv-aside-group{padding-left:20px;padding-right:20px;}
  .sv-check-no{font-size:34px;right:16px;}
}

/* ============================================================
   affair.html｜外遇合法蒐證抓姦 追加樣式
   沿用 about.css 的 --ab-* 設計變數（奶油底 × 橘黃主色 × 白卡片）
   新增前綴：af-（affair）
   ============================================================ */

/* ---------- 頁內導覽 膠囊列（原 #nav2） ---------- */
.af-subnav{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  border-left:6px solid var(--ab-orange);
  padding:26px 30px;
  margin-top:28px;
}
.af-subnav-h{
  font-size:19px;
  margin-bottom:16px;
  padding-bottom:12px;
  border-bottom:1px dashed var(--ab-line);
  display:flex;align-items:center;gap:10px;
}
.af-subnav-h .ab-dot{width:10px;height:10px;}
.af-subnav ul{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;gap:10px;
}
.af-subnav ul li{margin:0;display:block;width:auto;list-style:none;}
/* 注意：.af-subnav 是 <nav>，須覆寫 style0903.css 的全域 nav a
   （第25行 nav a{width:100px;margin:5px}、
     第27行 nav a:hover{transform:scale(1.2)}、
     第148行 @media(max-width:992px) nav a{width:7%;max-width:130px}） */
nav.af-subnav ul li a{
  display:inline-block;
  width:auto !important;max-width:none !important;height:auto;
  margin:0;text-align:left;transform:none;
  background:var(--ab-cream-soft);
  border:1px solid var(--ab-line);
  border-radius:999px;
  padding:10px 20px;
  font-size:15px;font-weight:700;
  line-height:1.6;
  color:var(--ab-ink) !important;
  transition:background-color .22s ease, color .22s ease, border-color .22s ease, transform .22s ease;
}
nav.af-subnav ul li a:hover{
  background:var(--ab-orange);border-color:var(--ab-orange);
  color:#fff !important;transform:translateY(-2px) scale(1);
}

/* ---------- 十種外遇徵兆 網格 ---------- */
.af-signs{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:18px;
  margin-top:32px;
  counter-reset:afsign;
}
.af-sign{
  counter-increment:afsign;
  position:relative;
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:26px 22px 22px;
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}
.af-sign:hover{transform:translateY(-5px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
/* 徵兆序號圓標（純 CSS，取代原 img/affair-b1box01~10.png 圖示；
   若日後要換回圖片，建議尺寸 120×120px 正方形 PNG 透明背景） */
.af-sign::before{
  content:counter(afsign,decimal-leading-zero);
  position:absolute;top:-10px;right:10px;
  font-size:52px;font-weight:900;line-height:1;
  color:var(--ab-yellow);opacity:.42;
  pointer-events:none;
}
.af-sign-h{
  font-size:18px;line-height:1.55;
  margin-bottom:12px;padding-bottom:12px;
  border-bottom:2px solid var(--ab-line);
  position:relative;z-index:1;
  display:flex;align-items:center;gap:10px;
}
.af-sign-h::before{
  content:"";flex:none;
  width:12px;height:12px;border-radius:50%;
  background:var(--ab-orange);
}
.af-sign p{color:var(--ab-ink-soft);font-size:15px;text-align:justify;margin:0;}

/* ---------- 離婚爭執四大要素 ---------- */
.af-factors{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin:30px 0;
}
.af-factor{
  position:relative;
  border-radius:var(--ab-radius);
  padding:30px 18px 26px;
  text-align:center;
  color:#fff;
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
  /* 四大要素色塊（純 CSS，取代原 img/affair-b2box01~04.png；
     若改用圖片，建議尺寸 300×300px 正方形） */
  background:linear-gradient(135deg,var(--ab-yellow),var(--ab-orange));
}
.af-factor:nth-child(2){background:linear-gradient(135deg,var(--ab-orange-soft),var(--ab-orange-deep));}
.af-factor:nth-child(3){background:linear-gradient(135deg,var(--ab-orange),var(--ab-yellow));}
.af-factor:nth-child(4){background:linear-gradient(135deg,var(--ab-orange-deep),var(--ab-orange-soft));}
.af-factor:hover{transform:translateY(-5px);box-shadow:0 14px 34px rgba(210,110,40,.2);}
.af-factor::after{
  content:"";position:absolute;top:-24px;right:-24px;
  width:72px;height:72px;border-radius:50%;
  background:rgba(255,255,255,.22);
}
.af-factor-h{
  font-size:22px;line-height:1.4;color:#fff;margin:0;
  position:relative;z-index:1;letter-spacing:2px;
}
.af-factor-no{
  display:block;font-size:12px;font-weight:900;
  letter-spacing:3px;opacity:.9;margin-bottom:8px;
}

/* ---------- 討公道 六大做法 ---------- */
.af-ways{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:20px;
  margin-top:32px;
}
.af-way{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  border-top:5px solid var(--ab-orange);
  padding:26px 26px 24px;
  transition:transform .25s ease, box-shadow .25s ease;
}
.af-way:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
.af-way-h{
  font-size:19px;line-height:1.55;
  margin-bottom:12px;padding-bottom:12px;
  border-bottom:1px dashed var(--ab-line);
  display:flex;align-items:center;gap:10px;
}
/* 序號徽章（純 CSS，無需圖片） */
.af-way-badge{
  flex:none;
  width:32px;height:32px;border-radius:9px;
  background:linear-gradient(135deg,var(--ab-yellow),var(--ab-orange));
  color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:900;letter-spacing:0;
}
.af-way p{color:var(--ab-ink-soft);text-align:justify;margin:0;}

/* ---------- 具體方案 卡片（原 #affair-b5） ---------- */
.af-plans{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:20px;
  margin-top:32px;
}
.af-plan{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .26s ease, box-shadow .26s ease;
}
.af-plan:hover{transform:translateY(-5px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
/* 方案卡視覺區｜圖片 img/affair-sv01.jpg ～ img/affair-sv08.jpg
   建議尺寸 600×400px（3:2）。底色為圖片載入前／失敗時的備援 */
.af-plan-visual{
  position:relative;
  aspect-ratio:3/2;
  overflow:hidden;
  background:linear-gradient(135deg, var(--ab-yellow), var(--ab-orange));
}
.af-plan-visual img{
  display:block;
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.af-plan:hover .af-plan-visual img{transform:scale(1.06);}
/* 圖片上方的淡橘漸層，讓白色標題區與圖片銜接更柔和 */
.af-plan-visual::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, transparent 62%, rgba(105,66,9,.16) 100%);
  pointer-events:none;
}
.af-plan-body{padding:22px 22px 24px;}
.af-plan-h{
  font-size:19px;line-height:1.5;
  margin-bottom:10px;padding-bottom:10px;
  border-bottom:1px dashed var(--ab-line);
}
.af-plan-body p{color:var(--ab-ink-soft);font-size:15px;text-align:justify;margin:0;}

/* ---------- 重點引言（大字強調） ---------- */
.af-lead{
  background:var(--ab-cream-soft);
  border-radius:var(--ab-radius);
  border-left:6px solid var(--ab-orange);
  padding:26px 30px;
  margin-top:28px;
}
.af-lead p{
  font-size:17px;
  color:var(--ab-ink);
  text-align:justify;
  margin:0 0 12px;
}
.af-lead p:last-child{margin-bottom:0;}
.af-lead mark{
  background:linear-gradient(transparent 60%, var(--ab-yellow) 60%);
  color:var(--ab-orange-deep);
  font-weight:900;
  padding:0 3px;
}

/* ============================================================
   affair 響應式
   ============================================================ */
@media (max-width: 992px){
  .af-factors{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width: 600px){
  .af-subnav{padding:22px 20px;}
  nav.af-subnav ul li a{font-size:14px;padding:9px 16px;}
  .af-signs{grid-template-columns:1fr;}
  .af-factors{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .af-factor-h{font-size:19px;}
  .af-ways,.af-plans{grid-template-columns:1fr;}
  .af-lead{padding:22px 20px;}
  .af-lead p{font-size:16px;}
}

/* ============================================================
   savemarriage.html｜尋人查址 追加樣式
   沿用 about.css 的 --ab-* 設計變數（奶油底 × 橘黃主色 × 白卡片）
   新增前綴：sm-（savemarriage）
   ============================================================ */

/* ---------- 三大迷思（H1 下方） ---------- */
.sm-myths{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:30px;
  counter-reset:smmyth;
}
.sm-myth{
  counter-increment:smmyth;
  position:relative;
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  border-top:5px solid var(--ab-orange);
  padding:26px 24px 24px;
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}
.sm-myth:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
/* 迷思序號水印（純 CSS，無需圖片） */
.sm-myth::before{
  content:"MYTH " counter(smmyth,decimal-leading-zero);
  position:absolute;top:12px;right:14px;
  font-size:13px;font-weight:900;letter-spacing:1px;
  color:var(--ab-yellow);
  pointer-events:none;
}
.sm-myth-h{
  font-size:18px;line-height:1.55;
  margin-bottom:12px;padding-bottom:12px;
  border-bottom:1px dashed var(--ab-line);
  display:flex;align-items:flex-start;gap:10px;
  padding-right:60px;
}
/* 驚嘆號圓標 */
.sm-myth-h::before{
  content:"!";
  flex:none;
  width:26px;height:26px;border-radius:50%;
  background:var(--ab-orange);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:900;letter-spacing:0;
}
.sm-myth p{color:var(--ab-ink-soft);font-size:15px;text-align:justify;margin:0;}

/* ---------- 無障礙：僅供螢幕閱讀器讀取的文字 ---------- */
.sr-only{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* ---------- 資料表格（合法管道／適用情境） ---------- */
.sm-table-wrap{
  margin-top:30px;
  overflow-x:auto;
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  background:var(--ab-white);
}
.sm-table{
  width:100%;
  border-collapse:collapse;
  min-width:560px;
}
.sm-table thead th{
  background:linear-gradient(135deg,var(--ab-orange),var(--ab-yellow));
  color:#fff;
  font-size:16px;font-weight:900;
  letter-spacing:1px;
  text-align:left;
  padding:16px 20px;
}
.sm-table thead th:first-child{width:30%;}
.sm-table tbody th{
  text-align:left;
  vertical-align:top;
  padding:18px 20px;
  font-size:16px;font-weight:900;
  color:var(--ab-ink);
  background:var(--ab-cream-soft);
  border-bottom:1px solid var(--ab-line);
  white-space:nowrap;
}
.sm-table tbody td{
  vertical-align:top;
  padding:18px 20px;
  font-size:15.5px;
  line-height:1.9;
  font-weight:600;
  color:var(--ab-ink-soft);
  text-align:justify;
  border-bottom:1px solid var(--ab-line);
}
.sm-table tbody tr:last-child th,
.sm-table tbody tr:last-child td{border-bottom:none;}
.sm-table tbody tr{transition:background-color .22s ease;}
.sm-table tbody tr:hover td{background:rgba(243,183,30,.07);}
/* 表格左側標題的橘色圓點 */
.sm-table tbody th::before{
  content:"";
  display:inline-block;
  width:9px;height:9px;border-radius:50%;
  background:var(--ab-orange);
  margin-right:9px;
  vertical-align:middle;
}

/* ---------- 適用情境卡（哪些情況需要專業服務） ---------- */
.sm-cases{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:20px;
  margin-top:30px;
}
.sm-case{
  position:relative;
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:0 0 24px;
  overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .26s ease, box-shadow .26s ease;
}
.sm-case:hover{transform:translateY(-5px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
/* 情境卡頂部漸層帶（純 CSS；若改用圖片建議尺寸 640×360px／16:9） */
.sm-case-top{
  position:relative;
  padding:20px 24px 18px;
  background:linear-gradient(135deg,var(--ab-yellow),var(--ab-orange));
  color:#fff;
  overflow:hidden;
}
.sm-case:nth-child(2) .sm-case-top{background:linear-gradient(135deg,var(--ab-orange-soft),var(--ab-orange-deep));}
.sm-case:nth-child(3) .sm-case-top{background:linear-gradient(135deg,var(--ab-orange),var(--ab-yellow));}
.sm-case:nth-child(4) .sm-case-top{background:linear-gradient(135deg,var(--ab-orange-deep),var(--ab-orange-soft));}
.sm-case:nth-child(5) .sm-case-top{background:linear-gradient(135deg,var(--ab-yellow),var(--ab-orange-deep));}
.sm-case-top::after{
  content:"";position:absolute;top:-26px;right:-26px;
  width:76px;height:76px;border-radius:50%;
  background:rgba(255,255,255,.2);
}
.sm-case-no{
  font-size:12px;font-weight:900;letter-spacing:3px;
  opacity:.9;margin-bottom:6px;
  position:relative;z-index:1;
}
.sm-case-h{
  font-size:19px;line-height:1.5;color:#fff;margin:0;
  position:relative;z-index:1;
}
.sm-case-body{padding:20px 24px 0;}
.sm-case-body p{color:var(--ab-ink-soft);text-align:justify;margin:0;}

/* ---------- 委託流程（四步驟） ---------- */
.sm-steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-top:30px;
  counter-reset:smstep;
}
.sm-step{
  counter-increment:smstep;
  position:relative;
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:0 0 24px;
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}
.sm-step:hover{transform:translateY(-5px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
/* 步驟標籤橫幅（純 CSS，無需圖片）
   使用 padding 撐開而非固定寬高，避免繼承 .ab-main p 的 line-height 造成溢出跑版 */
.sm-step-no{
  display:block;
  margin:0;
  padding:12px 18px;
  background:linear-gradient(135deg,var(--ab-yellow),var(--ab-orange));
  color:#fff;
  font-size:14px;
  font-weight:900;
  line-height:1.5;
  letter-spacing:3px;
  text-align:center;
}
.sm-step-h{
  font-size:17px;line-height:1.55;
  margin:20px 20px 12px;
  padding-bottom:12px;
  border-bottom:1px dashed var(--ab-line);
  text-align:center;
}
.sm-step p:not(.sm-step-no){
  color:var(--ab-ink-soft);
  font-size:15px;
  text-align:justify;
  margin:0 20px;
}

/* ---------- 費用重點框 ---------- */
.sm-price{
  display:flex;align-items:center;gap:26px;
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  border-left:6px solid var(--ab-orange);
  padding:28px 32px;
  margin-top:28px;
}
.sm-price-tag{
  flex:none;
  text-align:center;
  padding:20px 30px;
  border-radius:var(--ab-radius);
  /* 改用深橘實色，白字對比度 4.91:1 通過 WCAG AA
     （原本是黃→橘漸層，白字落在淺黃處僅 1.81:1，幾乎看不見） */
  background:#C24A10;
  color:#fff !important;
  box-shadow:0 6px 18px rgba(210,110,40,.28);
}
.sm-price-tag b{
  display:block;
  font-size:34px;line-height:1.15;
  letter-spacing:1px;
  color:#fff;
}
.sm-price-tag span{
  display:block;
  font-size:14px;font-weight:700;
  margin-top:6px;
  padding-top:6px;
  letter-spacing:1px;
  color:#fff;
  border-top:1px solid rgba(255,255,255,.45);
}
.sm-price p{color:var(--ab-ink-soft);text-align:justify;margin:0;}

/* ---------- 一證二看三認證 ---------- */
.sm-trust{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  margin-top:30px;
}
.sm-trust-item{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:0 0 24px;
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease;
}
.sm-trust-item:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(210,110,40,.16);}
/* 大字標記（一／二／三），純 CSS 無需圖片 */
.sm-trust-mark{
  position:relative;
  padding:22px 24px 18px;
  background:linear-gradient(135deg,var(--ab-orange),var(--ab-yellow));
  color:#fff;
  display:flex;align-items:center;gap:14px;
  overflow:hidden;
}
.sm-trust-item:nth-child(2) .sm-trust-mark{background:linear-gradient(135deg,var(--ab-orange-soft),var(--ab-orange-deep));}
.sm-trust-item:nth-child(3) .sm-trust-mark{background:linear-gradient(135deg,var(--ab-orange-deep),var(--ab-yellow));}
.sm-trust-mark::after{
  content:"";position:absolute;top:-24px;right:-24px;
  width:72px;height:72px;border-radius:50%;
  background:rgba(255,255,255,.2);
}
.sm-trust-num{
  flex:none;
  width:46px;height:46px;border-radius:12px;
  background:rgba(255,255,255,.94);
  color:var(--ab-orange-deep);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:900;letter-spacing:0;
  position:relative;z-index:1;
}
.sm-trust-h{font-size:19px;line-height:1.4;color:#fff;margin:0;position:relative;z-index:1;}
.sm-trust-item > p{padding:20px 24px 0;color:var(--ab-ink-soft);text-align:justify;margin:0;}


/* ---------- 案例故事（實務案例分享） ---------- */
.sm-story{
  background:var(--ab-white);
  border-radius:var(--ab-radius);
  box-shadow:var(--ab-shadow);
  padding:32px 36px;
  margin-top:30px;
  position:relative;
  overflow:hidden;
}
/* 引號裝飾 */
.sm-story::before{
  content:"Case";
  position:absolute;top:-18px;right:24px;
  font-size:120px;line-height:1;
  color:var(--ab-yellow);opacity:.3;
  pointer-events:none;
}
.sm-story-tag{
  display:inline-block;
  background:var(--ab-yellow);
  color:var(--ab-ink);
  border-radius:999px;
  padding:6px 18px;
  font-size:13px;font-weight:900;letter-spacing:1px;
  margin-bottom:16px;
}
.sm-story p{color:var(--ab-ink-soft);text-align:justify;margin:0 0 14px;position:relative;z-index:1;}
.sm-story p:last-child{margin-bottom:0;}

/* ============================================================
   savemarriage 響應式
   ============================================================ */
@media (max-width: 992px){
  .sm-myths{grid-template-columns:1fr;}
  .sm-steps{grid-template-columns:repeat(2,minmax(0,1fr));}
  .sm-trust{grid-template-columns:1fr;}
}
@media (max-width: 600px){
  .sm-steps{grid-template-columns:1fr;}
  .sm-cases{grid-template-columns:1fr;}
  .sm-price{flex-direction:column;align-items:stretch;gap:18px;padding:24px 20px;}
  .sm-story{padding:24px 20px;}
  .sm-story::before{font-size:80px;right:12px;}
  .sm-price-tag{padding:16px;}
  .sm-table thead th,.sm-table tbody th,.sm-table tbody td{padding:14px 16px;font-size:15px;}
}