/* ===================================================================
   Public V2 — Homepage 框架（Hero eyebrow／Quick actions／Funeral Data Hub／
   Services＋殯儀館入口／指南／追思／信任／手機底部 5 掣導航）。
   刻意做新檔、新 class（hv2- 前綴），唔改任何現有 selector／function：
     - 顏色／字體沿用 assets/style.css 現有 token（--forest/--cream/--gold/--border 等），
       唔起第二套品牌色（PM §20：唔好無必要全面換 brand asset）。
     - 手機底部導航同 --fab-bottom／#mobile-cta／body padding-bottom 嘅接駁，喺
       assets/style.css 用 var(--hv2-bottomnav-h,0px) fallback 做（見嗰邊 3 處註解），
       冇 body.has-hv2-nav 嘅頁面完全唔受影響（fallback 0px）。
   =================================================================== */

/* ── Hero eyebrow：platform positioning badge，擺喺 hero-slot 之前，靜態 HTML（唔靠 JS render，
     SSR／JS 兩邊睇到嘅字一樣，唔算 cloaking），唔改動 SITE.funeralHeroTitle／renderHero() 本身 ── */
.hv2-eyebrow{max-width:1180px;margin:14px auto 0;padding:0 20px}
.hv2-eyebrow span{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:999px;
  background:var(--card);border:1px solid var(--border);color:var(--olive);font-weight:700;font-size:.8rem}

/* ── Hero CTA group（additive；喺 renderHero() 入面，冇改／冇取代 SITE.funeralHeroTitle／heroTagline／
     現有 WhatsApp／電話 CTA／mini-tiles，淨係加多一組 3 個導航掣，喺 hero content 下方）── */
.hv2-hero-cta{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.hv2-hero-cta a{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border-radius:999px;
  font-weight:700;font-size:.88rem;min-height:40px;box-sizing:border-box;text-decoration:none}
.hv2-hero-cta a.primary{background:rgba(255,255,255,.94);color:var(--forest)}
.hv2-hero-cta a.primary:hover,.hv2-hero-cta a.primary:focus-visible{background:#fff}
.hv2-hero-cta a.secondary{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.5);color:inherit}
.hv2-hero-cta a.secondary:hover,.hv2-hero-cta a.secondary:focus-visible{background:rgba(255,255,255,.24)}

/* ── Quick action chips：一眼睇到嘅捷徑，純 navigation，唔係搜尋結果 ── */
.hv2-quickchips{max-width:1180px;margin:14px auto 0;padding:0 20px;display:flex;gap:8px;flex-wrap:wrap}
.hv2-chip{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:999px;
  background:var(--card);border:1px solid var(--border);color:var(--forest);font-weight:700;font-size:.85rem;
  min-height:40px;box-sizing:border-box;transition:border-color .15s,background .15s}
.hv2-chip:hover,.hv2-chip:focus-visible{border-color:var(--forest);background:#fff}

/* ── 共用 section 外框：淺色卡片、標題＋「睇全部」連結 ── */
.hv2-section{max-width:1180px;margin:38px auto 0;padding:0 20px}
.hv2-section-hd{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.hv2-section-hd h2{margin:0}
.hv2-section-hd a{color:var(--forest);font-weight:700;font-size:.88rem;white-space:nowrap}
.hv2-empty{background:var(--card);border:1px dashed var(--border);border-radius:var(--r-md);padding:20px;
  text-align:center;color:var(--muted);font-size:.9rem}

/* ── Funeral Data Hub：今日／明日出殯 兩欄卡 ── */
.hv2-hub-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hv2-hub-col{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:16px 18px;box-shadow:var(--shadow)}
.hv2-hub-col h3{margin:0 0 10px;font-size:1rem;color:var(--forest);display:flex;align-items:center;gap:6px}
.hv2-hub-row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--border);font-size:.88rem}
.hv2-hub-row:first-of-type{border-top:none}
.hv2-hub-row .hv2-hub-name{font-weight:700;color:var(--ink)}
.hv2-hub-row .hv2-hub-when{color:var(--muted);white-space:nowrap;text-align:right}
.hv2-hub-more{margin-top:4px;font-size:.78rem;color:var(--muted)}

/* ── 殯儀服務／殯儀館 入口卡 ── */
.hv2-entry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.hv2-entry-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:16px 18px;
  box-shadow:var(--shadow);display:flex;flex-direction:column;gap:6px;color:inherit;text-decoration:none;min-height:44px}
.hv2-entry-card:hover,.hv2-entry-card:focus-visible{border-color:var(--forest)}
.hv2-entry-card .em{font-size:1.5rem}
.hv2-entry-card b{color:var(--forest)}
.hv2-entry-card span{font-size:.82rem;color:var(--muted);line-height:1.5}

/* ── 帛事指南／資訊：純連結清單 ── */
.hv2-guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.hv2-guide-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-md);padding:12px 16px;
  display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-weight:700;font-size:.9rem;min-height:44px}
.hv2-guide-card:hover,.hv2-guide-card:focus-visible{border-color:var(--forest);background:#fff}

/* ── 追思／悼念內容入口（暫用「一花一故事」；Memorial News 併入後可以喺呢個 slot 換內容，
     見 funeral.html 內嘅 HV2 SLOT 註解） ── */
.hv2-memorial-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:20px;
  box-shadow:var(--shadow);display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.hv2-memorial-card .em{font-size:2rem}
.hv2-memorial-card p{margin:4px 0 0;color:var(--muted);font-size:.88rem}

/* ── 信任／私隱說明 ── */
.hv2-trust-extra{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px 20px}
.hv2-trust-extra ul{margin:10px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.hv2-trust-extra li{font-size:.86rem;color:var(--ink);display:flex;align-items:flex-start;gap:8px}
.hv2-trust-extra a{color:var(--forest);font-weight:700}

/* ── 手機底部 5 掣導航（首頁／搜尋／出殯／訂花／我的）──
   同 #mobile-cta 疊放規則：呢條 bar 喺最底（bottom:0），#mobile-cta 疊喺上面（bottom:var(--hv2-bottomnav-h)）；
   z-index 58：低過 #mobile-cta(60)／#site-announcement(65)／#ai-chat-launcher(70)，高過一般內容。
   桌面／平板（>600px）唔顯示（同 #mobile-cta 用返同一個斷點，避免中間 601–760px 出現「有掣冇bar」）。 */
.hv2-bottomnav{display:none}
@media(max-width:600px){
  /* 淨係喺呢個斷點、有 body.has-hv2-nav 嘅頁面先set呢個變數——冇呢個 class 嘅頁面（例如落單/結帳頁）
     var(--hv2-bottomnav-h,0px) 永遠 fallback 做 0px，完全冇影響。 */
  body.has-hv2-nav{--hv2-bottomnav-h:56px}
  body.has-hv2-nav .hv2-bottomnav{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:58;height:56px;
    padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:content-box;
    background:rgba(255,252,245,.98);border-top:1px solid var(--border);
    box-shadow:0 -2px 10px rgba(122,92,0,.08)
  }
  body.has-hv2-nav .hv2-bottomnav a{
    flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    color:var(--muted);font-size:.68rem;font-weight:700;min-width:44px
  }
  body.has-hv2-nav .hv2-bottomnav a .ic{font-size:1.2rem;line-height:1}
  body.has-hv2-nav .hv2-bottomnav a.active{color:var(--forest)}
  /* 有 AI 客服掣開緊面板（body.kb-open：軟鍵盤彈出）就連底部導航一齊收埋，同 #mobile-cta／AI launcher 行為一致 */
  body.kb-open .hv2-bottomnav{display:none}
}

@media(max-width:600px){
  .hv2-hub-grid{grid-template-columns:1fr}
  .hv2-section{margin-top:28px}
}