/* Start custom CSS for html, class: .elementor-element-1272c5d *//* =========================================================
   台鋼產險工具箱｜企業保險 CLEAN TEMPLATE
   Prefix: tsg-marine
   規範：單一樣式來源，不採覆蓋式追加。
   ========================================================= */

.tsg-marine-page {
  --gold:#F2A900;
  --gold-deep:#D98F00;
  --gold-soft:#FFF3D2;
  --ink:#111C24;
  --text:#333333;
  --muted:#696969;
  --line:#E2DED5;
  --soft:#F7F7F5;
  --card:#FCFCFB;
  --white:#FFFFFF;
  width:100%;
  color:var(--ink);
  background:var(--white);
  font-family:"Noto Serif TC","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  font-size:17px;
  line-height:1.8;
  box-sizing:border-box;
}
.tsg-marine-page *, .tsg-marine-page *::before, .tsg-marine-page *::after { box-sizing:inherit; }
.tsg-marine-page a { color:inherit; text-decoration:none; }
.tsg-marine-container { width:min(1180px,calc(100% - 48px)); margin:0 auto; }

.tsg-marine-hero {
  padding:46px 0 48px;
  border-bottom:1px solid var(--line);
  background:radial-gradient(circle at 88% 20%,rgba(242,169,0,.13),transparent 28%),linear-gradient(135deg,#FBF8F1 0%,#FFFFFF 65%);
}
.tsg-marine-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-bottom:26px; color:var(--muted); font-size:14px; }
.tsg-marine-breadcrumb a:hover { color:var(--gold-deep); }
.tsg-marine-eyebrow,.tsg-marine-label { color:var(--gold-deep); font-weight:800; letter-spacing:.12em; }
.tsg-marine-eyebrow { display:inline-block; margin-bottom:8px; font-size:12px; }
.tsg-marine-hero h1 { margin:0; font-size:clamp(34px,3.6vw,46px); line-height:1.3; font-weight:900; }
.tsg-marine-hero p { max-width:900px; margin:12px 0 0; color:var(--muted); font-size:18px; line-height:1.9; }
.tsg-marine-highlight {
  padding:0 .05em;
  background:linear-gradient(transparent 58%,rgba(242,169,0,.26) 58%,rgba(242,169,0,.26) 92%,transparent 92%);
  box-decoration-break:clone; -webkit-box-decoration-break:clone;
}

.tsg-marine-quick {
  position:sticky; top:0; z-index:40;
  padding:18px 0;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.96);
  box-shadow:0 6px 18px rgba(17,28,36,.05);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.tsg-marine-quick__title { margin-bottom:11px; font-size:16px; font-weight:900; }
.tsg-marine-quick__grid {
  display:flex; flex-wrap:nowrap; gap:8px;
  overflow-x:auto; overflow-y:hidden;
  padding-bottom:2px; scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.tsg-marine-quick__grid::-webkit-scrollbar { display:none; }
.tsg-marine-quick__grid a {
  display:inline-flex; flex:0 0 auto; align-items:center;
  min-height:40px; padding:8px 13px;
  border:1px solid var(--line); border-radius:999px; background:var(--white);
  font-size:14px; font-weight:700; line-height:1.35; white-space:nowrap;
}
.tsg-marine-quick__grid a:hover { border-color:var(--gold); background:var(--gold-soft); }

.tsg-marine-intro { padding:40px 0 34px; border-bottom:1px solid var(--line); }
.tsg-marine-section-head { margin-bottom:22px; }
.tsg-marine-section-head h2 { margin:0; font-size:clamp(28px,2.8vw,38px); line-height:1.4; font-weight:900; }
.tsg-marine-section-head p { margin:8px 0 0; color:var(--muted); font-size:16px; }
.tsg-marine-diff-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.tsg-marine-diff-card {
  min-width:0; padding:20px 20px 18px;
  border:1px solid var(--line); border-radius:15px; background:var(--card);
  box-shadow:0 3px 10px rgba(17,28,36,.03);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.tsg-marine-diff-card:hover { transform:translateY(-2px); border-color:rgba(242,169,0,.72); box-shadow:0 8px 20px rgba(17,28,36,.06); }
.tsg-marine-diff-tag { display:inline-block; margin:0 0 12px; padding:5px 10px; border-radius:999px; background:var(--gold-soft); color:var(--gold-deep); font-size:12px; font-weight:900; line-height:1.45; }
.tsg-marine-diff-card h3 { margin:0 0 8px; color:var(--ink); font-size:18px; font-weight:900; line-height:1.55; }
.tsg-marine-diff-card p { margin:0; color:var(--muted); font-size:15px; line-height:1.8; }
.tsg-marine-memory { margin-top:16px; padding:14px 17px; border-left:4px solid var(--gold); border-radius:0 10px 10px 0; background:var(--gold-soft); color:var(--text); font-size:15px; line-height:1.8; }

.tsg-marine-section { padding:34px 0; scroll-margin-top:116px; }
.tsg-marine-section--soft { background:var(--soft); }
.tsg-marine-card { padding:30px 32px 24px; border:1px solid var(--line); border-radius:18px; background:var(--white); box-shadow:0 8px 26px rgba(17,28,36,.035); }
.tsg-marine-card__head { display:flex; align-items:center; gap:16px; }
.tsg-marine-number { flex:0 0 50px; width:50px; height:50px; display:grid; place-items:center; border-radius:13px; background:var(--gold); color:#000; font-size:15px; font-weight:900; }
.tsg-marine-label { display:block; margin-bottom:2px; font-size:11px; }
.tsg-marine-card h2 { margin:0; font-size:clamp(26px,2.4vw,32px); line-height:1.4; font-weight:900; }
.tsg-marine-lead { margin:18px 0; color:var(--text); font-size:17px; line-height:1.9; }
.tsg-marine-focus { margin:0 0 12px; }
.tsg-marine-focus span { display:inline-block; padding:4px 10px; border-radius:999px; background:rgba(242,169,0,.12); color:var(--gold-deep); font-size:12px; font-weight:900; }

.tsg-marine-info-grid,.tsg-marine-scenario-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.tsg-marine-scenario-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.tsg-marine-info-card,.tsg-marine-scenario-card {
  min-width:0; padding:17px 18px; border:1px solid var(--line); border-radius:12px; background:var(--card);
}
.tsg-marine-info-card h3,.tsg-marine-scenario-card h3 {
  position:relative; display:inline-block; margin:0 0 10px; padding-bottom:5px;
  color:var(--ink); font-size:16px; font-weight:900; line-height:1.5;
}
.tsg-marine-info-card h3::after,.tsg-marine-scenario-card h3::after {
  content:""; position:absolute; left:0; bottom:0; width:100%; max-width:110px; height:3px; border-radius:999px;
  background:linear-gradient(90deg,var(--gold),rgba(242,169,0,.12));
}
.tsg-marine-info-card p,.tsg-marine-scenario-card p { margin:0; color:var(--muted); font-size:15px; line-height:1.85; }

.tsg-marine-note { margin-top:16px; padding:14px 17px; border-left:4px solid var(--gold); border-radius:0 10px 10px 0; background:var(--gold-soft); color:var(--text); font-size:15px; line-height:1.85; }
.tsg-marine-actions { display:flex; justify-content:flex-end; margin-top:20px; }
.tsg-marine-back { display:inline-flex; align-items:center; min-height:40px; padding:9px 16px; border:1px solid rgba(242,169,0,.65); border-radius:999px; background:var(--white); font-size:14px; font-weight:800; }
.tsg-marine-back:hover { background:var(--gold-soft); }

.tsg-marine-disclaimer { padding:18px 0 34px; }
.tsg-marine-disclaimer p { margin:0; color:#777; font-size:12px; line-height:1.8; }

@media (max-width:1024px) {
  .tsg-marine-container { width:min(100% - 40px,1180px); }
  .tsg-marine-diff-grid,.tsg-marine-scenario-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .tsg-marine-page { font-size:16px; }
  .tsg-marine-container { width:calc(100% - 28px); }
  .tsg-marine-hero { padding:30px 0 32px; }
  .tsg-marine-breadcrumb { margin-bottom:18px; font-size:12px; }
  .tsg-marine-hero h1 { font-size:29px; }
  .tsg-marine-hero p { font-size:16px; }
  .tsg-marine-quick { padding:10px 0 11px; }
  .tsg-marine-quick__title { margin-bottom:8px; font-size:14px; }
  .tsg-marine-quick__grid a { min-height:38px; font-size:13.5px; }
  .tsg-marine-intro { padding:30px 0 26px; }
  .tsg-marine-section-head h2 { font-size:28px; }
  .tsg-marine-diff-grid,.tsg-marine-info-grid,.tsg-marine-scenario-grid { grid-template-columns:1fr; }
  .tsg-marine-diff-card { padding:18px 17px; }
  .tsg-marine-section { padding:25px 0; scroll-margin-top:108px; }
  .tsg-marine-card { padding:22px 19px 18px; border-radius:14px; }
  .tsg-marine-card__head { align-items:flex-start; gap:12px; }
  .tsg-marine-number { flex-basis:43px; width:43px; height:43px; font-size:13px; }
  .tsg-marine-card h2 { font-size:23px; }
  .tsg-marine-lead { margin:14px 0 16px; font-size:15.5px; }
  .tsg-marine-actions { margin-top:17px; }
  .tsg-marine-back { font-size:13.5px; }
}/* End custom CSS */