/* ==========================================================
   山下線｜網站共用設定
========================================================== */

.single .entry-meta,
.single .post-meta,
.single .entry-header .meta {
  display: none !important;
}


/* ==========================================================
   LOCAL PRACTICE GUIDE
   MASTER CSS V1
   2026.08

   共用於：
   - 指南首頁
   - Chapter 01 — 06
   - 各章內文章節

   TYPOGRAPHY SYSTEM
   - 純數字：11px
   - 功能標籤：12px
   - 正文：16px
   - 重點標題：17px
   - 導讀：17–18px

   DESIGN
   - Editorial / Typography
   - Desktop max-width：1280px
========================================================== */


/* ==========================================================
   00. DESIGN TOKENS
========================================================== */

.lpg-home,
.lpg-chapter-page {

  --lpg-paper: #f7f3ec;

  --lpg-ink: #202522;

  --lpg-text: #444b47;

  --lpg-muted: #686f6b;

  --lpg-line: rgba(32, 37, 34, 0.55);

  --lpg-line-light: rgba(32, 37, 34, 0.18);

  --lpg-accent: #bd5137;

  --lpg-soft: #e9e5dd;

  width: 100%;

  margin: 0;

  padding: 0;

  background: transparent;

  color: var(--lpg-ink);

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Noto Sans TC",
    "PingFang TC",
    "Microsoft JhengHei",
    sans-serif;
}


/* ==========================================================
   01. BOX MODEL
========================================================== */

.lpg-home *,
.lpg-home *::before,
.lpg-home *::after,
.lpg-chapter-page *,
.lpg-chapter-page *::before,
.lpg-chapter-page *::after {
  box-sizing: border-box;
}


/* ==========================================================
   02. BASIC RESET
========================================================== */

.lpg-home a,
.lpg-chapter-page a {
  color: inherit;
  text-decoration: none;
}


.lpg-home p,
.lpg-home h1,
.lpg-home h2,
.lpg-home figure,
.lpg-chapter-page p,
.lpg-chapter-page h1,
.lpg-chapter-page h2,
.lpg-chapter-page h3,
.lpg-chapter-page figure {
  margin-top: 0;
}


/* ==========================================================
   03. WORDPRESS PAGE TITLE

   12665 = 指南首頁
   12688 = 第一章
========================================================== */

body.page-id-12665 .entry-title,
body.page-id-12665 .entry-header,
body.page-id-12688 .entry-title,
body.page-id-12688 .entry-header {
  display: none !important;
}


body.page-id-12665 .entry-content,
body.page-id-12688 .entry-content {
  margin-top: 0 !important;
}


/* ==========================================================
   04. FUNCTION LABEL
========================================================== */

.lpg-function-label {
  display: block;

  color: var(--lpg-muted);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;

  letter-spacing: 0.045em;
}


/* ==========================================================
   PART A
   HOME PAGE
========================================================== */


/* ==========================================================
   05. HOME SHELL
========================================================== */

.lpg-shell {
  width: 100%;

  max-width: 1280px;

  margin: 0 auto;

  padding: 0 32px;
}


/* ==========================================================
   06. HOME MASTHEAD
========================================================== */

.lpg-masthead {
  display: flex;

  align-items: center;
  justify-content: space-between;

  min-height: 62px;

  border-bottom:
    1px solid
    var(--lpg-ink);

  color: var(--lpg-ink);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;

  letter-spacing: 0.07em;
}


.lpg-masthead__brand,
.lpg-masthead__meta {
  font-size: 12px;
}


.lpg-masthead__meta {
  color: var(--lpg-muted);
}


/* ==========================================================
   07. HOME HERO
========================================================== */

.lpg-editorial-hero {
  display: grid;

  grid-template-columns:
    minmax(320px, 0.82fr)
    minmax(0, 1.18fr);

  column-gap: 56px;

  padding:
    48px 0
    42px;

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-editorial-hero__text {
  display: flex;

  flex-direction: column;

  justify-content: flex-end;

  padding-bottom: 10px;
}


.lpg-kicker {
  margin-bottom: 24px;

  color: var(--lpg-accent);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;

  letter-spacing: 0.035em;
}


/* 首頁展示大標 */

.lpg-editorial-hero__title {
  display: flex;

  flex-direction: column;

  margin-bottom:
    28px !important;

  color: var(--lpg-ink);

  font-size:
    clamp(56px, 5.1vw, 72px);

  font-weight: 700;
  line-height: 1.02;

  letter-spacing: -0.055em;
}


.lpg-editorial-hero__title span {
  display: block;
}


/* 首頁導讀 */

.lpg-editorial-hero__lead {
  max-width: 390px;

  color: var(--lpg-text);

  font-size: 18px;
  line-height: 1.8;
}


/* ==========================================================
   08. HOME IMAGE
========================================================== */

.lpg-editorial-hero__media {
  width: 100%;

  aspect-ratio: 16 / 10;

  overflow: hidden;

  background: var(--lpg-soft);
}


.lpg-editorial-hero__media img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  object-position: center 48%;
}


/* ==========================================================
   09. HOME IMAGE CAPTION
========================================================== */

.lpg-editorial-hero__caption {
  grid-column: 2;

  display: grid;

  grid-template-columns:
    190px
    minmax(0, 1fr);

  gap: 26px;

  padding-top: 12px;

  color: var(--lpg-muted);

  font-size: 12px;
  line-height: 1.7;
}


.lpg-editorial-hero__caption span {
  color: var(--lpg-ink);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;

  letter-spacing: 0.045em;
}


/* ==========================================================
   10. HOME EDITORIAL SECTION
========================================================== */

.lpg-index,
.lpg-about {
  padding:
    48px 0
    52px;

  border-bottom:
    1px solid
    var(--lpg-ink);
}


/* ==========================================================
   11. EDITORIAL HEADING
========================================================== */

.lpg-editorial-heading {
  display: grid;

  grid-template-columns:
    52px
    minmax(250px, 0.78fr)
    minmax(0, 1.22fr);

  column-gap: 30px;

  align-items: start;

  margin-bottom: 34px;
}


.lpg-editorial-heading__number {
  padding-top: 3px;

  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;

  letter-spacing: 0.04em;
}


.lpg-editorial-heading__title span {
  display: block;

  margin-bottom: 7px;

  color: var(--lpg-muted);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;

  letter-spacing: 0.07em;
}


.lpg-editorial-heading__title h2 {
  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;

  letter-spacing: -0.01em;
}


.lpg-editorial-heading__intro {
  max-width: 540px;

  color: var(--lpg-text);

  font-size: 17px;
  line-height: 1.8;
}


/* ==========================================================
   12. HOME CHAPTER LIST
========================================================== */

.lpg-chapter-list {
  display: block;

  width: 100%;

  border-top:
    1px solid
    var(--lpg-ink);
}


.lpg-chapter-row {
  display: grid;

  grid-template-columns:
    52px
    minmax(0, 1fr)
    145px
    24px;

  column-gap: 30px;

  align-items: center;

  min-height: 70px;

  padding: 12px 0;

  border-bottom:
    1px solid
    var(--lpg-line-light);

  transition:
    padding-left 0.18s ease,
    border-color 0.18s ease;
}


.lpg-chapter-row:hover {
  padding-left: 8px;
}


.lpg-chapter-row__number {
  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;

  letter-spacing: 0.04em;
}


.lpg-chapter-row__title {
  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.55;

  letter-spacing: -0.01em;
}


.lpg-chapter-row__meta {
  color: var(--lpg-muted);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;

  letter-spacing: 0.05em;
}


.lpg-chapter-row__arrow {
  justify-self: end;

  color: var(--lpg-accent);

  font-size: 17px;
  line-height: 1;
}


/* ==========================================================
   13. HOME ABOUT
========================================================== */

.lpg-about__grid {
  display: grid;

  grid-template-columns:
    minmax(300px, 0.85fr)
    minmax(0, 1.15fr);

  gap: 72px;

  padding-left: 82px;
}


.lpg-about__statement {
  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.8;
}


.lpg-about__body {
  max-width: 680px;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-about__body p {
  margin-bottom: 14px;
}


.lpg-about__body p:last-child {
  margin-bottom: 0;
}


/* ==========================================================
   14. HOME PRINCIPLES
========================================================== */

.lpg-principles {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-principle {
  min-height: 170px;

  padding:
    26px
    28px
    28px
    0;

  border-right:
    1px solid
    var(--lpg-line-light);
}


.lpg-principle + .lpg-principle {
  padding-left: 28px;
}


.lpg-principle:last-child {
  border-right: 0;
}


.lpg-principle span {
  display: block;

  margin-bottom: 30px;

  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-principle strong {
  display: block;

  margin-bottom: 8px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-principle p {
  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.8;
}


/* ==========================================================
   15. HOME FOOTER
========================================================== */

.lpg-home-footer {
  display: flex;

  align-items: center;
  justify-content: space-between;

  min-height: 70px;

  color: var(--lpg-muted);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;

  letter-spacing: 0.05em;
}


/* ==========================================================
   PART B
   CHAPTER SYSTEM
========================================================== */


/* ==========================================================
   16. CHAPTER SHELL
========================================================== */

.lpg-chapter-shell {
  width: 100%;

  max-width: 1280px;

  margin: 0 auto;

  padding:
    0 32px 80px;
}


/* ==========================================================
   17. CHAPTER TOP BAR
========================================================== */

.lpg-chapter-top {
  display: flex;

  align-items: center;
  justify-content: space-between;

  min-height: 62px;

  border-bottom:
    1px solid
    var(--lpg-ink);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;

  letter-spacing: 0.06em;
}


.lpg-chapter-top__meta {
  color: var(--lpg-muted);
}


/* ==========================================================
   18. CHAPTER INTRO
========================================================== */

.lpg-chapter-intro {
  display: grid;

  grid-template-columns:
    52px
    minmax(360px, 1.15fr)
    minmax(260px, 0.85fr);

  column-gap: 38px;

  align-items: end;

  padding:
    54px 0
    48px;

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-chapter-intro__number {
  align-self: start;

  padding-top: 5px;

  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-chapter-intro__kicker {
  margin-bottom: 14px;

  color: var(--lpg-accent);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}


.lpg-chapter-intro__title {
  margin:
    0 0
    22px !important;

  color: var(--lpg-ink);

  font-size:
    clamp(38px, 4vw, 52px);

  font-weight: 700;
  line-height: 1.12;

  letter-spacing: -0.04em;
}


.lpg-chapter-intro__lead {
  max-width: 680px;

  margin: 0;

  color: var(--lpg-text);

  font-size: 18px;
  line-height: 1.85;
}


.lpg-chapter-intro__side {
  align-self: end;

  padding:
    18px 0
    4px;

  border-top:
    1px solid
    var(--lpg-line-light);
}


.lpg-chapter-intro__side p {
  margin:
    10px 0 0;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.8;
}


/* ==========================================================
   19. CHAPTER COMMON BLOCK
========================================================== */

.lpg-chapter-block {
  padding:
    48px 0
    52px;

  border-bottom:
    1px solid
    var(--lpg-ink);
}


/* ==========================================================
   20. CHAPTER HEADING
========================================================== */

.lpg-chapter-heading {
  display: grid;

  grid-template-columns:
    52px
    minmax(300px, 0.9fr)
    minmax(0, 1.1fr);

  column-gap: 30px;

  align-items: start;

  margin-bottom: 34px;
}


.lpg-chapter-heading__number {
  padding-top: 3px;

  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-chapter-heading__main h2 {
  margin:
    7px 0 0;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-chapter-heading__lead {
  max-width: 560px;

  margin: 0;

  color: var(--lpg-text);

  font-size: 17px;
  line-height: 1.8;
}


/* ==========================================================
   21. RESOURCE COMPARISON
========================================================== */

.lpg-resource-compare {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  border-top:
    1px solid
    var(--lpg-ink);

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-resource-type {
  padding:
    30px 34px
    30px 0;
}


.lpg-resource-type + .lpg-resource-type {
  padding-left: 34px;

  padding-right: 0;

  border-left:
    1px solid
    var(--lpg-line-light);
}


.lpg-resource-type__head {
  display: flex;

  align-items: center;

  gap: 16px;

  margin-bottom: 22px;
}


.lpg-resource-type__number {
  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-resource-type h3 {
  margin:
    0 0
    10px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-resource-type__statement {
  margin:
    0 0
    22px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 600;
  line-height: 1.75;
}


.lpg-resource-type ul {
  margin:
    0 0
    26px;

  padding-left: 1.15em;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-resource-type li {
  margin-bottom: 4px;
}


/* ==========================================================
   22. TEXT LINK
========================================================== */

.lpg-text-link {
  display: flex;

  align-items: center;
  justify-content: space-between;

  padding-top: 13px;

  border-top:
    1px solid
    var(--lpg-line-light);

  color: var(--lpg-text) !important;

  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}


.lpg-text-link span {
  color: var(--lpg-accent);

  font-size: 17px;
}


/* ==========================================================
   23. SUMMARY LINE
========================================================== */

.lpg-summary-line {
  display: grid;

  grid-template-columns:
    150px
    minmax(0, 1fr);

  gap: 30px;

  margin-top: 30px;

  padding:
    20px 0 0;

  border-top:
    1px solid
    var(--lpg-line-light);
}


.lpg-summary-line__label {
  color: var(--lpg-accent);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}


.lpg-summary-line p {
  max-width: 720px;

  margin: 0;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-summary-line strong {
  color: var(--lpg-ink);
}


/* ==========================================================
   24. GUIDE SECTION
========================================================== */

.lpg-guide-section {
  padding:
    50px 0
    54px;

  border-bottom:
    1px solid
    var(--lpg-ink);

  scroll-margin-top: 90px;
}


/* ==========================================================
   25. GUIDE HEADING
========================================================== */

.lpg-guide-heading {
  display: grid;

  grid-template-columns:
    minmax(220px, 0.7fr)
    minmax(0, 1.3fr);

  gap: 56px;

  margin-bottom: 32px;
}


.lpg-guide-heading__side {
  display: flex;

  flex-direction: column;

  gap: 8px;
}


.lpg-guide-heading__type {
  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-guide-heading__main h2 {
  margin:
    7px 0
    9px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-guide-heading__main p {
  max-width: 680px;

  margin: 0;

  color: var(--lpg-text);

  font-size: 17px;
  line-height: 1.8;
}


/* ==========================================================
   26. QUICK LIST
========================================================== */

.lpg-quick-list {
  display: block;

  width: 100%;

  border-top:
    1px solid
    var(--lpg-ink);
}


.lpg-quick-row {
  display: grid;

  grid-template-columns:
    52px
    minmax(0, 1fr)
    24px;

  column-gap: 30px;

  align-items: center;

  min-height: 76px;

  padding: 12px 0;

  border-bottom:
    1px solid
    var(--lpg-line-light);

  transition:
    padding-left 0.18s ease;
}


.lpg-quick-row:hover {
  padding-left: 8px;
}


.lpg-quick-row__number {
  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-quick-row__main {
  display: grid;

  grid-template-columns:
    minmax(160px, 0.45fr)
    minmax(0, 1fr);

  gap: 30px;

  align-items: center;
}


.lpg-quick-row__main strong {
  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-quick-row__main span {
  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.75;
}


.lpg-quick-row__arrow {
  justify-self: end;

  color: var(--lpg-accent);

  font-size: 17px;
}


/* ==========================================================
   27. CHAPTER NEXT
========================================================== */

.lpg-chapter-next {
  display: grid;

  grid-template-columns:
    80px
    minmax(0, 1fr)
    36px;

  gap: 28px;

  align-items: center;

  padding:
    36px 0;

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-chapter-next__number {
  color: var(--lpg-muted);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-chapter-next__main strong {
  display: block;

  margin:
    7px 0
    5px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-chapter-next__main p {
  max-width: 680px;

  margin: 0;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.8;
}


.lpg-chapter-next__arrow {
  justify-self: end;

  color: var(--lpg-accent) !important;

  font-size: 22px;
}


/* ==========================================================
   PART C
   ARTICLE SECTION SYSTEM V2

   1-1 / 1-2 / 1-3 ...
========================================================== */


/* ==========================================================
   28. ARTICLE WRAPPER

   ★ 每個正式小節上方新增分隔線
========================================================== */

.lpg-article-section {
  position: relative;

  padding:
    34px 0
    58px;

  border-top:
    1px solid
    var(--lpg-ink);

  border-bottom:
    1px solid
    var(--lpg-ink);

  scroll-margin-top: 86px;
}


/* ==========================================================
   29. ARTICLE HEADER

   ★ 標題導讀與正文正式分層
========================================================== */

.lpg-article-header {
  display: grid;

  grid-template-columns:
    52px
    minmax(300px, 0.9fr)
    minmax(0, 1.1fr);

  column-gap: 30px;

  align-items: start;

  margin-bottom: 32px;

  padding-bottom: 30px;

  border-bottom:
    1px solid
    var(--lpg-line-light);
}


/* ==========================================================
   30. ARTICLE NUMBER
========================================================== */

.lpg-article-header__number {
  padding-top: 4px;

  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


/* ==========================================================
   31. ARTICLE LABEL
========================================================== */

.lpg-article-header__label {
  display: block;

  margin-bottom: 8px;

  color: var(--lpg-muted);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;

  letter-spacing: 0.04em;
}


/* ==========================================================
   32. ARTICLE TITLE
========================================================== */

.lpg-article-header__title {
  margin: 0 !important;

  color: var(--lpg-ink);

  font-size: 28px;
  font-weight: 700;
  line-height: 1.35;

  letter-spacing: -0.025em;
}


/* ==========================================================
   33. ARTICLE LEAD

   ★ 右側導讀加入朱紅直線
========================================================== */

.lpg-article-header__lead {
  position: relative;

  max-width: 590px;

  margin: 0;

  padding:
    2px 0
    2px 24px;

  border-left:
    2px solid
    var(--lpg-accent);

  color: var(--lpg-text);

  font-size: 17px;
  font-weight: 500;
  line-height: 1.85;
}


/* ==========================================================
   34. ARTICLE BODY
========================================================== */

.lpg-article-body {
  width: 100%;

  max-width: 930px;

  margin-left: 82px;
}


.lpg-article-body > p {
  max-width: 820px;

  margin:
    0 0
    17px;

  color: var(--lpg-text);

  font-size: 16px;
  font-weight: 400;
  line-height: 1.9;
}


/* ==========================================================
   35. CASE IMAGE
========================================================== */

.lpg-case-figure {
  width: 100%;

  margin:
    32px 0
    38px;
}


.lpg-case-figure__frame {
  width: 100%;

  padding: 24px;

  background: #fff;
}


.lpg-case-figure img {
  display: block;

  width: 100%;
  height: auto;

  margin: 0;
}


.lpg-case-figure figcaption {
  display: grid;

  grid-template-columns:
    52px
    minmax(0, 1fr);

  gap: 18px;

  margin-top: 12px;

  color: var(--lpg-muted);

  font-size: 12px;
  line-height: 1.65;
}


.lpg-case-figure__mark {
  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
}


/* ==========================================================
   36. CASE INTRO
========================================================== */

.lpg-case-intro {
  max-width: 820px;

  margin:
    0 0
    22px;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.9;
}


/* ==========================================================
   37. ANALYSIS LIST
========================================================== */

.lpg-analysis-list {
  width: 100%;

  margin-top: 28px;

  border-top:
    1px solid
    var(--lpg-ink);
}


.lpg-analysis-item {
  display: grid;

  grid-template-columns:
    52px
    minmax(210px, 0.48fr)
    minmax(0, 1fr);

  column-gap: 28px;

  padding:
    25px 0
    27px;

  border-bottom:
    1px solid
    var(--lpg-line-light);
}


.lpg-analysis-item__number {
  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-analysis-item__title {
  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.65;
}


.lpg-analysis-item__body {
  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-analysis-item__body p {
  margin: 0;
}


/* ==========================================================
   38. SECTION CONCLUSION
========================================================== */

.lpg-section-conclusion {
  display: grid;

  grid-template-columns:
    52px
    minmax(0, 1fr);

  gap: 28px;

  margin-top: 30px;

  padding-top: 26px;

  border-top:
    1px solid
    var(--lpg-line-light);
}


.lpg-section-conclusion__label {
  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
}


.lpg-section-conclusion p {
  max-width: 820px;

  margin: 0;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.9;
}


/* ==========================================================
   39. READING POINT
========================================================== */

.lpg-reading-point {
  display: grid;

  grid-template-columns:
    160px
    minmax(0, 1fr);

  gap: 32px;

  margin-top: 38px;

  padding:
    24px 0;

  border-top:
    1px solid
    var(--lpg-ink);

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-reading-point__label {
  color: var(--lpg-accent);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}


.lpg-reading-point__content {
  max-width: 760px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 600;
  line-height: 1.8;
}


/* ==========================================================
   40. ARTICLE NEXT
========================================================== */

.lpg-article-next {
  display: grid;

  grid-template-columns:
    82px
    minmax(0, 1fr)
    26px;

  gap: 28px;

  align-items: center;

  margin-top: 42px;

  padding:
    24px 0;

  border-top:
    1px solid
    var(--lpg-line-light);
}


.lpg-article-next__label {
  color: var(--lpg-muted);

  font-size: 12px;
  font-weight: 700;
}


.lpg-article-next__main span {
  display: block;

  margin-bottom: 4px;

  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
}


.lpg-article-next__main strong {
  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-article-next__arrow {
  justify-self: end;

  color: var(--lpg-accent) !important;

  font-size: 18px;
}


/* ==========================================================
   PART D
   COMMON ARTICLE COMPONENTS
========================================================== */


/* ==========================================================
   41. GENERIC SECTION
========================================================== */

.lpg-section {
  width: 100%;

  padding:
    40px 0;

  border-bottom:
    1px solid
    var(--lpg-line-light);
}


.lpg-section-title {
  max-width: 880px;

  margin-bottom: 18px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-body {
  max-width: 880px;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-body p {
  margin:
    0 0
    15px;
}


.lpg-body p:last-child {
  margin-bottom: 0;
}


/* ==========================================================
   42. HIGHLIGHT
========================================================== */

.lpg-highlight {
  max-width: 880px;

  margin:
    22px 0;

  padding:
    19px 22px;

  border-left:
    2px solid
    var(--lpg-accent);

  background:
    rgba(32, 37, 34, 0.035);

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.8;
}


/* ==========================================================
   PART E
   TABLET
========================================================== */

@media (max-width: 1050px) {

  .lpg-shell {
    padding:
      0 26px;
  }


  .lpg-editorial-hero {
    grid-template-columns:
      minmax(260px, 0.82fr)
      minmax(0, 1.18fr);

    column-gap: 36px;
  }


  .lpg-editorial-hero__title {
    font-size: 52px;
  }


  .lpg-editorial-heading {
    grid-template-columns:
      46px
      minmax(220px, 0.8fr)
      minmax(0, 1.2fr);

    column-gap: 22px;
  }


  .lpg-chapter-row {
    grid-template-columns:
      46px
      minmax(0, 1fr)
      120px
      22px;

    column-gap: 22px;
  }


  .lpg-about__grid {
    padding-left: 68px;

    gap: 46px;
  }


  .lpg-chapter-shell {
    padding:
      0 26px 70px;
  }


  .lpg-chapter-intro {
    grid-template-columns:
      46px
      minmax(300px, 1.15fr)
      minmax(220px, 0.85fr);

    gap: 26px;
  }


  .lpg-chapter-heading {
    grid-template-columns:
      46px
      minmax(260px, 0.9fr)
      minmax(0, 1.1fr);

    gap: 22px;
  }


  .lpg-quick-row {
    grid-template-columns:
      46px
      minmax(0, 1fr)
      22px;

    gap: 22px;
  }


  .lpg-article-body {
    margin-left: 68px;
  }

}


/* ==========================================================
   PART F
   MOBILE
========================================================== */

@media (max-width: 680px) {

  /* HOME */

  .lpg-shell {
    padding:
      0 18px;
  }


  .lpg-masthead {
    min-height: 54px;

    font-size: 12px;
  }


  .lpg-masthead__brand,
  .lpg-masthead__meta {
    font-size: 12px;
  }


  .lpg-editorial-hero {
    display: block;

    padding:
      30px 0;
  }


  .lpg-editorial-hero__text {
    padding-bottom: 27px;
  }


  .lpg-kicker {
    margin-bottom: 17px;

    font-size: 12px;
  }


  .lpg-editorial-hero__title {
    margin-bottom:
      18px !important;

    font-size: 46px;
  }


  .lpg-editorial-hero__lead {
    font-size: 17px;
  }


  .lpg-editorial-hero__media {
    aspect-ratio: 4 / 3;
  }


  .lpg-editorial-hero__caption {
    display: block;

    padding-top: 11px;

    font-size: 12px;
  }


  .lpg-editorial-hero__caption span {
    display: block;

    margin-bottom: 7px;

    font-size: 12px;
  }


  .lpg-index,
  .lpg-about {
    padding:
      36px 0
      40px;
  }


  .lpg-editorial-heading {
    grid-template-columns:
      36px
      minmax(0, 1fr);

    column-gap: 12px;

    margin-bottom: 27px;
  }


  .lpg-editorial-heading__intro {
    grid-column: 2;

    padding-top: 9px;

    font-size: 17px;
  }


  .lpg-editorial-heading__title span {
    font-size: 12px;
  }


  .lpg-editorial-heading__title h2 {
    font-size: 17px;
  }


  .lpg-chapter-row {
    grid-template-columns:
      36px
      minmax(0, 1fr)
      20px;

    gap: 11px;

    min-height: 64px;
  }


  .lpg-chapter-row__meta {
    display: none;
  }


  .lpg-chapter-row__title {
    font-size: 17px;
  }


  .lpg-about__grid {
    display: block;

    padding-left: 0;
  }


  .lpg-about__statement {
    margin-bottom: 24px;

    font-size: 17px;
  }


  .lpg-about__body {
    font-size: 16px;
  }


  .lpg-principles {
    display: block;
  }


  .lpg-principle,
  .lpg-principle + .lpg-principle {
    min-height: auto;

    padding:
      24px 0;

    border-right: 0;

    border-bottom:
      1px solid
      var(--lpg-line-light);
  }


  .lpg-principle:last-child {
    border-bottom: 0;
  }


  .lpg-principle span {
    margin-bottom: 17px;
  }


  .lpg-home-footer {
    min-height: 62px;

    font-size: 12px;
  }


  /* CHAPTER */

  .lpg-chapter-shell {
    padding:
      0 18px
      56px;
  }


  .lpg-chapter-top {
    min-height: 54px;
  }


  .lpg-chapter-intro {
    grid-template-columns:
      34px
      minmax(0, 1fr);

    gap: 12px;

    padding:
      34px 0
      36px;
  }


  .lpg-chapter-intro__main {
    grid-column: 2;
  }


  .lpg-chapter-intro__side {
    grid-column: 2;

    margin-top: 24px;
  }


  .lpg-chapter-intro__title {
    font-size: 38px;
  }


  .lpg-chapter-intro__lead {
    font-size: 17px;
  }


  .lpg-chapter-block,
  .lpg-guide-section {
    padding:
      36px 0
      40px;
  }


  .lpg-chapter-heading {
    grid-template-columns:
      34px
      minmax(0, 1fr);

    gap: 12px;

    margin-bottom: 27px;
  }


  .lpg-chapter-heading__lead {
    grid-column: 2;

    padding-top: 8px;
  }


  .lpg-resource-compare {
    display: block;
  }


  .lpg-resource-type {
    padding:
      26px 0;
  }


  .lpg-resource-type + .lpg-resource-type {
    padding:
      26px 0;

    border-left: 0;

    border-top:
      1px solid
      var(--lpg-line-light);
  }


  .lpg-summary-line {
    display: block;
  }


  .lpg-summary-line__label {
    display: block;

    margin-bottom: 10px;
  }


  .lpg-guide-heading {
    display: block;

    margin-bottom: 26px;
  }


  .lpg-guide-heading__side {
    margin-bottom: 22px;
  }


  .lpg-quick-row {
    grid-template-columns:
      34px
      minmax(0, 1fr)
      18px;

    gap: 10px;

    min-height: 76px;
  }


  .lpg-quick-row__main {
    display: block;
  }


  .lpg-quick-row__main strong {
    display: block;

    margin-bottom: 3px;
  }


  .lpg-quick-row__main span {
    display: block;
  }


  .lpg-chapter-next {
    grid-template-columns:
      52px
      minmax(0, 1fr)
      24px;

    gap: 12px;

    padding:
      28px 0;
  }


  /* ARTICLE */

  .lpg-article-section {
    padding:
      28px 0
      42px;
  }


  .lpg-article-header {
    grid-template-columns:
      34px
      minmax(0, 1fr);

    gap: 12px;

    margin-bottom: 26px;

    padding-bottom: 26px;
  }


  .lpg-article-header__main {
    grid-column: 2;
  }


  .lpg-article-header__lead {
    grid-column: 2;

    margin-top: 16px;

    padding:
      2px 0
      2px 16px;

    font-size: 17px;
  }


  .lpg-article-header__title {
    font-size: 25px;
  }


  .lpg-article-body {
    max-width: none;

    margin-left: 0;
  }


  .lpg-case-figure__frame {
    padding: 12px;
  }


  .lpg-case-figure figcaption {
    grid-template-columns:
      34px
      minmax(0, 1fr);

    gap: 10px;
  }


  .lpg-analysis-item {
    grid-template-columns:
      34px
      minmax(0, 1fr);

    gap: 10px;

    padding:
      22px 0;
  }


  .lpg-analysis-item__title {
    grid-column: 2;
  }


  .lpg-analysis-item__body {
    grid-column: 2;

    padding-top: 7px;
  }


  .lpg-section-conclusion {
    grid-template-columns:
      34px
      minmax(0, 1fr);

    gap: 10px;
  }


  .lpg-reading-point {
    display: block;

    padding:
      20px 0;
  }


  .lpg-reading-point__label {
    display: block;

    margin-bottom: 10px;
  }


  .lpg-article-next {
    grid-template-columns:
      54px
      minmax(0, 1fr)
      20px;

    gap: 10px;
  }

}

/* ==========================================================
   CHAPTER 01
   DUAL RESOURCE GUIDE
   左欄補助案 / 右欄政府標案
========================================================== */

.lpg-dual-guide-block {
  padding:
    48px 0
    54px;

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-dual-guide-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  border-top:
    1px solid
    var(--lpg-ink);

  border-bottom:
    1px solid
    var(--lpg-ink);
}


.lpg-dual-guide-col {
  padding:
    28px 34px
    34px 0;
}


.lpg-dual-guide-col + .lpg-dual-guide-col {
  padding-left: 34px;
  padding-right: 0;

  border-left:
    1px solid
    var(--lpg-line-light);
}


.lpg-dual-guide-col__title {
  margin:
    0 0
    12px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-dual-guide-col__statement {
  margin:
    0 0
    18px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 600;
  line-height: 1.75;
}


.lpg-dual-guide-col__list {
  margin:
    0 0
    24px;

  padding-left: 1.15em;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-dual-guide-col__list li {
  margin-bottom: 4px;
}


.lpg-mini-guide {
  margin-top: 8px;

  padding-top: 22px;

  border-top:
    1px solid
    var(--lpg-line-light);
}


.lpg-mini-guide__title {
  margin:
    8px 0
    10px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
}


.lpg-mini-guide__intro {
  margin:
    0 0
    18px;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-mini-guide-list {
  display: block;

  width: 100%;

  border-top:
    1px solid
    var(--lpg-line-light);
}


.lpg-mini-guide-row {
  display: grid;

  grid-template-columns:
    40px
    minmax(0, 1fr);

  gap: 16px;

  align-items: start;

  padding:
    14px 0;

  border-bottom:
    1px solid
    var(--lpg-line-light);

  transition:
    padding-left 0.18s ease;
}


.lpg-mini-guide-row:hover {
  padding-left: 6px;
}


.lpg-mini-guide-row__number {
  padding-top: 2px;

  color: var(--lpg-accent);

  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}


.lpg-mini-guide-row__content strong {
  display: block;

  margin-bottom: 4px;

  color: var(--lpg-ink);

  font-size: 17px;
  font-weight: 700;
  line-height: 1.55;
}


.lpg-mini-guide-row__content span {
  display: block;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.75;
}


.lpg-dual-guide-summary {
  display: grid;

  grid-template-columns:
    150px
    minmax(0, 1fr);

  gap: 30px;

  padding:
    22px 0 0;

  border-top:
    1px solid
    var(--lpg-line-light);
}


.lpg-dual-guide-summary__label {
  color: var(--lpg-accent);

  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}


.lpg-dual-guide-summary p {
  max-width: 720px;

  margin: 0;

  color: var(--lpg-text);

  font-size: 16px;
  line-height: 1.85;
}


.lpg-dual-guide-summary strong {
  color: var(--lpg-ink);
}


@media (max-width: 680px) {

  .lpg-dual-guide-block {
    padding:
      36px 0
      40px;
  }

  .lpg-dual-guide-grid {
    display: block;
  }

  .lpg-dual-guide-col {
    padding:
      24px 0
      28px;
  }

  .lpg-dual-guide-col + .lpg-dual-guide-col {
    padding:
      24px 0
      28px;

    border-left: 0;

    border-top:
      1px solid
      var(--lpg-line-light);
  }

  .lpg-dual-guide-summary {
    display: block;
  }

  .lpg-dual-guide-summary__label {
    display: block;

    margin-bottom: 10px;
  }

  .lpg-mini-guide-row {
    grid-template-columns:
      34px
      minmax(0, 1fr);

    gap: 10px;
  }

}