Solution 要做什麼
對照完整答案、責任邊界與原因。
本主題檔案：files/style.css
定位：先列出 service-card 目前負責的 background、border、padding，再確認 utility 只改 margin。
Solution · code-edit
元件 class 與 utility class
對照完整答案、責任邊界與原因。
本階段驗收
頁面不會替你修改檔案；請在實作檔完成後重新整理確認。
目前要處理
卡片只有 service-card，外觀完整但沒有額外上距。
預期看到
runtime class 由 service-card 變 service-card space-stack-lg；背景／邊框仍由 service-card，margin 只由 utility 提供。
.service-card{background:var(--surface);border:1px solid var(--border)}.space-stack-lg{margin-block-start:2rem}檔案清單
只在本階段資料夾內操作，避免改到其他章節。
index.html
首頁入口：建立唯一 h1、main、Hero、服務摘要與服務頁 CTA。style.css
共用樣式：觀察 page-shell、hero、primary-button、focus 與窄版 media query。main.js
預寫驗收腳本：所有頁面都能安全載入，學生不修改本檔。services.html
服務頁入口：提供 CTA 的真實相對路徑目標，沒有 status/action 也不會造成 JS 錯誤。
證據：runtime before=service-card、after=service-card space-stack-lg、attribute=class；Styles 顯示 margin 與外觀分屬兩條規則
回到主題說明