@layer theme-custom {
/* 蕭張宅 新樣式草稿：首頁歡迎區、分類入口、文章卡片 */

/* 歡迎區 */
section.index-editor .dd-welcome {
  text-align: center;
  max-width: 820px;
  margin: 0 auto;
  padding: 56px 20px 40px;
}
section.index-editor .dd-eyebrow {
  display: inline-block;
  margin: 0 0 12px;
  padding: 4px 16px;
  border-radius: 999px;
  background: #e6f8fa;
  color: #00a3b3;
  font-size: 15px;
  letter-spacing: 0.12em;
}
section.index-editor .dd-title {
  margin: 0 0 18px;
  color: #00b8c9;
  font-weight: 700;
  letter-spacing: 0.04em;
}
section.index-editor .dd-lead {
  margin: 0 0 14px;
  color: #616161;
  font-size: 18px;
  line-height: 1.9;
}
section.index-editor .dd-slogan {
  margin: 0 0 24px;
  color: #009666;
  font-size: 18px;
  font-weight: 600;
}
section.index-editor .dd-btn {
  display: inline-block;
  padding: 11px 34px;
  border-radius: 999px;
  background: #00b8c9;
  color: #fff;
  text-decoration: none;
  letter-spacing: 0.08em;
  transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
section.index-editor .dd-btn:hover {
  background: #00a3b3;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0, 184, 201, 0.28);
}

/* 分類入口 */
section.index-editor .dd-cats {
  max-width: 1040px;
  margin: 0 auto;
  padding: 24px 20px 48px;
}
section.index-editor .dd-cats-title {
  margin: 0 0 28px;
  text-align: center;
  color: #00b8c9;
  font-weight: 700;
}
section.index-editor .dd-cats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
section.index-editor .dd-cat {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 22px 22px 20px;
  border-radius: 16px;
  border: 1px solid #d9f1f4;
  background: #f4fbfc;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
section.index-editor .dd-cat:hover {
  transform: translateY(-4px);
  border-color: #00b8c9;
  box-shadow: 0 10px 22px rgba(0, 184, 201, 0.18);
}
section.index-editor .dd-cat-name {
  color: #00a3b3;
  font-size: 22px;
  font-weight: 700;
}
section.index-editor .dd-cat-desc {
  color: #757575;
  font-size: 15px;
  line-height: 1.7;
}

/* 平板與手機 */
@media (max-width: 991px) {
  section.index-editor .dd-cats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  section.index-editor .dd-welcome {
    padding: 36px 16px 28px;
  }
  section.index-editor .dd-lead,
  section.index-editor .dd-slogan {
    font-size: 16px;
    line-height: 1.85;
  }
  section.index-editor .dd-cats {
    padding: 16px 16px 36px;
  }
  section.index-editor .dd-cats-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

/* 文章內頁：舒適閱讀 */
body.b_blog_detail .container img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}
body.b_blog_detail .container p {
  line-height: 1.9;
}
body.b_blog_detail .container blockquote {
  border-left: 4px solid #00b8c9;
  background: #f4fbfc;
  padding: 14px 18px;
  border-radius: 0 10px 10px 0;
}

/* ===== 頁尾樣式（方案B：淺薄荷底，配合主視覺青藍色系） ===== */
div.content footer {
  background: #e6f8fa !important;
  border-top: 3px solid #00b8c9 !important;
  color: #616161 !important;
  font-size: 16px !important;
  line-height: 1.9 !important;
}
/* 欄標題：關於跩跩、聯絡我們 */
div.content footer h1,
div.content footer h2,
div.content footer h3,
div.content footer h4 {
  color: #008a99 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
}
/* 一般文字與連結 */
div.content footer p,
div.content footer li,
div.content footer span,
div.content footer a {
  color: #616161 !important;
  font-size: 16px !important;
  line-height: 1.9 !important;
}
div.content footer a {
  text-decoration: none;
  transition: color 0.2s ease;
}
div.content footer a:hover,
div.content footer a:focus {
  color: #008a99 !important;
  text-decoration: underline;
}
/* 版權宣告 */
div.content footer h5,
div.content footer h6,
div.content footer .copyright,
div.content footer .copyright a {
  color: #757575 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}
div.content footer h5,
div.content footer .copyright {
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid #cdeef2;
}
/* 手機版 */
@media (max-width: 575px) {
  div.content footer {
    text-align: center;
    font-size: 15px !important;
  }
  div.content footer p,
  div.content footer li,
  div.content footer span,
  div.content footer a {
    font-size: 15px !important;
    line-height: 2 !important;
  }
  div.content footer h1,
  div.content footer h2,
  div.content footer h3,
  div.content footer h4 {
    font-size: 17px !important;
  }
  div.content footer h5,
  div.content footer h6 {
    font-size: 13px !important;
  }
}

/* ===== 頁尾修正（強化版）：清除主題原有的黃色底、提高文字對比 ===== */
footer,
body footer,
html body footer {
  background-color: #e6f8fa !important;
  background-image: none !important;
  border-top: 3px solid #00b8c9 !important;
  color: #424242 !important;
}
/* 頁尾內層容器一律透明，避免主題的黃色底蓋過去 */
footer *,
body footer *,
footer *::before,
footer *::after {
  background-color: transparent !important;
  background-image: none !important;
  text-shadow: none !important;
}
footer::before,
footer::after {
  background: none !important;
}
/* 文字顏色（深灰，與淺薄荷底對比足夠） */
footer *,
body footer * {
  color: #424242 !important;
}
/* 欄標題：深青色 */
footer h1, footer h2, footer h3, footer h4,
body footer h1, body footer h2, body footer h3, body footer h4 {
  color: #006f7c !important;
}
/* 連結 */
footer a,
body footer a {
  color: #00606b !important;
}
footer a:hover,
footer a:focus,
body footer a:hover,
body footer a:focus {
  color: #00b8c9 !important;
}
/* 版權宣告 */
footer h5, footer h6,
body footer h5, body footer h6 {
  color: #616161 !important;
}
/* 社群圖示、文字圖示使用深青色，避免在淺底上消失 */
footer i,
footer svg,
body footer i,
body footer svg {
  color: #00606b !important;
  fill: #00606b !important;
}

/* ===== 頁尾配色（最終版）：暖奶油底配深棕字，與整體網站暖調融合 ===== */
footer,
body footer,
html body footer {
  background-color: #fff6e0 !important;
  background-image: none !important;
  border-top: 3px solid #e8c98e !important;
  color: #4e3b2a !important;
}
footer *,
body footer * {
  color: #4e3b2a !important;
}
/* 欄標題 */
footer h1, footer h2, footer h3, footer h4,
body footer h1, body footer h2, body footer h3, body footer h4 {
  color: #6b4a2b !important;
}
/* 連結 */
footer a,
body footer a {
  color: #5a3e24 !important;
}
footer a:hover,
footer a:focus,
body footer a:hover,
body footer a:focus {
  color: #a0642a !important;
}
/* 版權宣告 */
footer h5, footer h6,
body footer h5, body footer h6 {
  color: #7a6247 !important;
}
div.content footer h5,
div.content footer .copyright {
  border-top: 1px solid #ebd9b4 !important;
}
/* 社群圖示 */
footer i,
footer svg,
body footer i,
body footer svg {
  color: #6b4a2b !important;
  fill: #6b4a2b !important;
}
}