@layer theme-custom {
/* 手機版首頁 Hero/區塊修正 v2 2026-07 by Claude */
@media (max-width: 767px){
  .index-editor{ overflow-x:hidden !important; }
  .index-editor .container{ max-width:100% !important; padding-left:14px !important; padding-right:14px !important; overflow-x:hidden !important; }
  .index-editor .row{ margin-left:0 !important; margin-right:0 !important; }
  .index-editor [class*="col-md-"]{ width:100% !important; max-width:100% !important; flex:0 0 100% !important; float:none !important; padding-left:0 !important; padding-right:0 !important; }
  .index-editor h1{ font-size:24px !important; line-height:1.35 !important; word-break:break-word !important; overflow-wrap:break-word !important; }
  .index-editor img{ max-width:100% !important; height:auto !important; }
}

/* 2026-08-03 AI 網頁實戰課（/event/ai-vibecoding-workshop）：
   平台封面已在頁首顯示同一張主視覺，隱藏內文重複的那張。
   選擇器只存在於該活動內文，不影響站上其他頁面。 */
#aiweb2026-embed .aiw-hero-image{ display:none; }

/* 2026-08-04 部落格文章內文可讀性。
   模板給內文容器掛了 small class（0.9rem＝14.4px），段落 margin 也只有 1rem，
   而平台樣式是 unlayered、優先權高於本檔的 @layer，所以這裡必須用 !important 才蓋得過。
   套用範圍只有文章內文容器 .blog-info-text.html-info，不影響列表頁、活動頁與首頁。
   要還原直接刪掉本段。 */
.blog-info-text.html-info{ font-size:17px !important; line-height:2.05 !important; }
.blog-info-text.html-info p{ font-size:17px !important; line-height:2.05 !important; }
.blog-info-text.html-info p:not([style*="margin"]){ margin-bottom:26px !important; }
.blog-info-text.html-info li{ font-size:17px !important; line-height:2.05 !important; margin-bottom:10px !important; }
.blog-info-text.html-info figcaption{ font-size:14px !important; line-height:1.7 !important; }
.blog-info-text.html-info figure{ margin-top:36px !important; margin-bottom:36px !important; }
.blog-info-text.html-info h2{ margin-top:52px !important; }
.blog-info-text.html-info h3{ margin-top:34px !important; }

/* 2026-08-04 修正英文單字被切斷。
   模板在內文容器設了 word-break:break-all，會讓 Lovable、ChatGPT 這類英文字
   從單字中間斷行（實際出現過「Lo / vable」）。改回 normal，中文仍然逐字斷行，
   超長網址則由 overflow-wrap:break-word 處理，不會撐破版面。 */
.blog-info-text.html-info,
.blog-info-text.html-info p,
.blog-info-text.html-info li,
.blog-info-text.html-info h1,
.blog-info-text.html-info h2,
.blog-info-text.html-info h3,
.blog-info-text.html-info h4,
.blog-info-text.html-info div,
.blog-info-text.html-info span,
.blog-info-text.html-info a,
.blog-info-text.html-info strong,
.blog-info-text.html-info figcaption{ word-break:normal !important; overflow-wrap:break-word !important; }
}