/* 社區支援分類頁（長者中心 / 康健中心 / 社區客廳）
   hero 與篩選器尺寸對齊「賽馬會照顧者中心」，修正統一層 padding-bottom:132px 造成 hero 過高。 */
.community-support-page main {
  width:100%!important; max-width:none!important;
  margin-left:0!important; margin-right:0!important; padding:0 0 76px!important;
}

.community-support-page .support-hero {
  position:relative; z-index:20; display:grid;
  grid-template-columns:minmax(0,1fr) 260px; align-items:center; gap:22px 50px;
  width:100%!important; max-width:none!important; margin-left:0!important; margin-right:0!important;
  padding:42px max(16px,calc((100% - 1400px)/2)) 36px; overflow:visible;
}

/* 內容區與 hero 同一欄寬（min(1400px, 100% - 32px) 居中），跟日間護理一致 */
.community-support-page .support-search,
.community-support-page .support-next-step,
.community-support-page .support-sources {
  width:min(1400px,calc(100% - 32px))!important; margin-left:auto!important; margin-right:auto!important;
  box-sizing:border-box;
}
.community-support-page .support-hero>div:first-child { align-self:center }
.community-support-page .support-hero h1 { margin:8px 0; font-size:clamp(34px,3.3vw,48px); line-height:1.15; font-weight:700; letter-spacing:-.025em }
.community-support-page .support-hero p { margin:0; color:#fff; font-size:16px; line-height:1.7; font-weight:400 }

.community-support-page .support-hero>.carer-overview-stat {
  display:flex; align-items:center; justify-content:center; gap:18px; min-height:78px;
  padding:0; border:0; border-bottom:2px solid rgba(255,255,255,.72); border-radius:0; background:transparent;
}
.community-support-page .carer-overview-stat strong { color:#fff; font-size:58px; line-height:1; font-weight:700 }
.community-support-page .carer-overview-stat span { color:#fff; font-size:14px; line-height:1.45; font-weight:600 }

.community-support-page .support-filters {
  position:relative!important; top:auto!important; grid-column:1/-1;
  display:grid!important; grid-template-columns:minmax(320px,1.55fr) minmax(250px,.7fr);
  gap:12px; width:100%; margin:0!important; padding:0!important;
  border:0!important; background:transparent!important; box-shadow:none!important;
}
.community-support-page .support-filters>label { padding:0!important; border:0!important; background:transparent!important }
.community-support-page .support-filters>label>span,
.community-support-page .support-filter-multi>span {
  position:absolute!important; width:1px!important; height:1px!important; margin:-1px!important;
  padding:0!important; overflow:hidden!important; clip:rect(0 0 0 0)!important; white-space:nowrap!important; border:0!important;
}
.community-support-page .support-filters input,
.community-support-page #supportDistrictTrigger,
.community-support-page #supportKindTrigger {
  width:100%; box-sizing:border-box; height:54px;
  border:1px solid rgba(255,255,255,.24); border-radius:999px;
  background:rgba(3,103,96,.76); padding:0 20px; color:#fff; font:inherit;
}
.community-support-page .support-filters input::placeholder { color:rgba(255,255,255,.72) }
.community-support-page .support-multi-options { z-index:1000 }
.community-support-page .support-filters .support-multi-options label>span {
  color:#202426!important;
  font-size:15px!important;
  font-weight:500!important;
}

.community-support-page .support-search {
  z-index:1!important; width:min(1400px,calc(100% - 48px)); margin:0 auto; padding:28px 0 54px;
}

@media(max-width:900px){
  .community-support-page .support-hero { grid-template-columns:1fr }
  .community-support-page .support-filters { grid-template-columns:1fr }
}
@media(max-width:620px){
  .community-support-page .support-hero { padding:30px 16px }
  .community-support-page .support-search { width:calc(100% - 32px) }
}

/* ══ 卡片外觀與日間護理頁（elderly-day-care-centres.html）統一 ══
   數值取自該頁實際計算樣式：圖片欄 450×300、標題 21px、標籤 15px 無底色、
   右側按鈕青綠實心 18px。資料來源為 photos:[[<圖片URL>, <說明>], ...]
   （單張可只用 photo:"<URL>"）；空值顯示「圖片待更新」佔位。
   ⚠ 必須用 media query 包住基底規則，否則會蓋掉統一層的響應式欄寬。 */

@media(min-width:1101px){
  .community-support-page .support-card {
    grid-template-columns:450px minmax(0,1fr) 174px;
    grid-template-rows:minmax(300px,auto);
    align-items:stretch; gap:0; padding:0; overflow:hidden;
    border:1px solid #d6e5e4; border-radius:14px;
    box-shadow:0 5px 18px rgba(23,60,72,.05);
  }
  .community-support-page .support-card:hover { border-color:#bdd7d5; box-shadow:0 12px 28px rgba(23,60,72,.1) }
  .community-support-page .support-card>.support-photo { grid-row:1; width:450px; height:100%; min-height:300px; border-radius:0 }
}
@media(max-width:1100px){
  .community-support-page .support-card {
    grid-template-columns:minmax(0,450px) minmax(0,1fr);
    grid-template-rows:auto auto;
    align-items:stretch; gap:0; padding:0; overflow:hidden;
    border:1px solid #d6e5e4; border-radius:14px;
  }
  .community-support-page .support-card>.support-photo { grid-column:1; grid-row:1/3; width:100%; height:100%; min-height:360px; border-radius:0 }
  .community-support-page .support-card-main { grid-column:2; grid-row:1 }
  .community-support-page .support-card-action,
  .community-support-page .support-card-actions { grid-column:2; grid-row:2; margin:0 22px 18px }
}
@media(max-width:620px){
  .community-support-page .support-card { grid-template-columns:1fr; grid-template-rows:auto auto auto }
  .community-support-page .support-card>.support-photo { grid-column:1; grid-row:1; width:100%; height:190px; min-height:190px }
  .community-support-page .support-card-main { grid-column:1; grid-row:2 }
  .community-support-page .support-card-action,
  .community-support-page .support-card-actions { grid-column:1; grid-row:3; margin:0 18px 18px }
}

/* 圖片欄 */
.community-support-page .support-card>.support-photo {
  position:relative; display:block; box-sizing:border-box;
  margin:0; padding:0; border:0; background:#edf4f3; overflow:hidden; cursor:pointer;
}
.community-support-page .support-card>.support-photo img {
  display:block; width:100%; height:100%; max-width:none; min-height:inherit;
  object-fit:cover; transition:transform .25s ease;
}
.community-support-page .support-card>.support-photo:hover img { transform:scale(1.03) }
.community-support-page .support-card>.support-photo span {
  position:absolute; right:12px; bottom:12px; border-radius:6px;
  background:rgba(0,67,64,.82); color:#fff; padding:5px 8px;
  font-size:11px; font-weight:700; line-height:1.3;
}
.community-support-page .support-card>.support-photo.is-empty {
  cursor:default;
  background:linear-gradient(rgba(8,68,65,.12),rgba(8,68,65,.12)),url("images/hero-community.webp") center/cover;
}
.community-support-page .support-card>.support-photo.is-empty:hover img { transform:none }

/* 卡片文字 */
.community-support-page .support-card-main { min-width:0; align-self:center; padding:17px 22px 16px }
.community-support-page .support-card-main>.support-card-type {
  display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 8px;
}
.community-support-page .support-card-main>.support-card-type span,
.community-support-page .support-card-main>.support-card-type b {
  border-radius:999px; padding:5px 9px; font-size:12px; font-weight:400; line-height:1.35;
}
.community-support-page .support-card-main>.support-card-type span { background:#e8f6f3; color:#078d8f }
.community-support-page .support-card-main>.support-card-type b { background:#f1f5f4; color:#61767c }
.community-support-page .support-card-main h3 { margin:0 0 7px; color:#282828; font-size:21px; font-weight:750; line-height:1.42 }
.community-support-page .support-card-main>small { display:block; margin:0; color:#61767c; font-size:14px; font-weight:650 }
.community-support-page .support-card-main>p { margin:10px 0; color:#536b70; font-size:14px; line-height:1.55 }

/* 服務標籤（日間護理：3 欄、無底色、15.2px） */
.community-support-page .support-tags {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  row-gap:0; column-gap:14px; margin:12px 0 0;
}
.community-support-page .support-tags span {
  display:flex; align-items:center; gap:6px; min-height:32px;
  border-radius:0; background:transparent; color:#202426;
  padding:4px 0; font-size:15.2px; font-weight:500; line-height:1.4;
}
/* 服務項目的圖標：本站自備線性圖標（與日間護理標籤同色） */
.community-support-page .support-tags span svg {
  width:21px; height:21px; flex:0 0 21px;
  fill:none; stroke:#008f89; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}

/* 右側動作按鈕（與日間護理一致）：電話=青綠實心（主要），官網／電郵／PDF=描邊（次要）
   —— 按「按鈕類型」固定，不按位置，避免同一個「官方網站」在不同頁面樣式不同 */
.community-support-page .support-card-action,
.community-support-page .support-card-actions a {
  box-sizing:border-box; display:flex; flex-direction:row; min-height:42px;
  align-items:center; justify-content:center; gap:8px;
  border:1px solid #9dd8d4; border-radius:8px; background:#fff; color:#078d8f;
  padding:9px 13px; font-size:14px; font-weight:700; text-align:center; text-decoration:none;
}
.community-support-page .support-card-action.phone,
.community-support-page .support-card-actions a.phone {
  border:0; background:#00b7aa; color:#fff;
  min-height:44px; padding:9px 16px; font-size:18px; font-weight:400;
}
.community-support-page .support-card-action small { display:none }
.community-support-page .support-card-action strong,
.community-support-page .support-card-actions a strong { font-size:16px }
/* 按鈕圖示：與日間護理 .day-care-phone/.day-care-email 同一套線性 SVG */
.community-support-page .support-card-actions svg {
  width:19px; height:19px; flex:none; fill:none; stroke:currentColor;
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}

/* ══ 逐項對齊日間護理頁（1440px 實測差異修正）══ */
.community-support-page .support-hero h1 { font-weight:700!important }
.community-support-page .support-cards { gap:16px }
.community-support-page .support-card-main>.support-card-type span,
.community-support-page .support-card-main>.support-card-type b { margin:0 }
.community-support-page .support-card-actions {
  display:flex; flex-direction:column; align-self:stretch; justify-content:flex-end;
  gap:9px; margin:82px 20px 18px 0;
}
.community-support-page .support-sources { margin:0 16px 52px!important; padding:20px 24px }
.community-support-page .support-pager { margin:26px 0 }

/* 地址：與日間護理一致（定位圖示 + 7px 間距） */
.community-support-page .support-card-main>p.support-address {
  display:flex; align-items:flex-start; gap:7px;
  margin:10px 0; color:#536b70; font-size:14px; line-height:1.55;
}
.community-support-page .support-card-main>p.support-address svg {
  width:18px; height:18px; flex:0 0 18px; margin-top:1px;
  fill:none; stroke:#61d1cd; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}
.community-support-page .support-card-main>p.support-hours {
  margin:0 0 10px; color:#61767c; font-size:14px; line-height:1.55;
}
.community-support-page .support-card-main>p.support-hours strong { color:#40575e }

/* 服務時間：照「賽馬會照顧者中心」排版（左標籤 76px + 右側分段條目，每段一行、可多欄） */
.community-support-page .support-hours {
  display:grid; grid-template-columns:76px minmax(0,1fr); align-items:start; gap:12px; margin-top:10px;
}
.community-support-page .support-hours>small {
  align-self:baseline; color:#607277; font-size:13px; font-weight:500; white-space:nowrap;
}
.community-support-page .support-hours-value {
  display:grid; grid-template-rows:repeat(2,auto); grid-auto-flow:column;
  grid-auto-columns:max-content; gap:3px 22px; align-items:baseline;
}
.community-support-page .support-hours-value span {
  color:#087f7b; font-size:15px; line-height:1.4; font-weight:600; white-space:nowrap;
}
@media(max-width:900px){
  .community-support-page .support-hours-value span { white-space:normal }
}
@media(max-width:620px){
  .community-support-page .support-hours { grid-template-columns:1fr; gap:4px }
  .community-support-page .support-hours-value { grid-template-rows:none; grid-auto-flow:row; grid-auto-columns:auto }
}

/* 事實行（服務時間／資助模式）：完全對照日間護理 .day-care-facts
   —— 標籤與值同一行、值 20px/600 青色、以左分隔線分欄（欄寬隨內容） */
.community-support-page .support-facts {
  display:grid; grid-auto-flow:column; grid-auto-columns:max-content;
  justify-content:start; gap:0; margin:10px 0 8px;
}
.community-support-page .support-facts>div {
  display:flex; flex-direction:row; align-items:baseline; gap:18px;
  min-width:0; padding:1px 18px 1px 0;
}
.community-support-page .support-facts>div+div { padding:1px 18px 1px 22px; border-left:1px solid #dfe7e7 }
.community-support-page .support-facts small { margin:0; color:#202426; font-size:13px; font-weight:400; line-height:1.4 }
.community-support-page .support-facts b { color:#00b19f!important; font-size:20px; font-weight:600!important; line-height:1.2 }
@media(max-width:620px){
  .community-support-page .support-facts { grid-auto-flow:row; grid-auto-columns:auto; row-gap:6px }
  .community-support-page .support-facts>div+div { padding-left:0; border-left:0 }
}