/* 林口專業房仲 — 全站共用表頭 navbar（B 日系溫潤工藝風、顏色自帶不依賴各頁變數）by 小瑞 2026-07-07
   與 app/_components/site-header.css 同款：改這裡要同步那份。 */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(250,247,242,.94);backdrop-filter:blur(8px);
  border-bottom:1px dashed #C5DBC3;
  font-family:"Noto Sans TC","Microsoft JhengHei",-apple-system,sans-serif;
}
.topbar-inner{max-width:1180px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:72px;gap:12px;position:relative;}
.tb-brand{display:flex;align-items:center;gap:11px;color:#1F3A2A;text-decoration:none;white-space:nowrap;min-width:0;}
.tb-brand img{flex-shrink:0;height:48px;width:auto;}
.tb-brand-txt{display:flex;flex-direction:column;line-height:1.25;}
.tb-brand-txt b{font-size:16.5px;font-weight:900;color:#1F3A2A;letter-spacing:.06em;}
.tb-brand-txt small{font-size:12px;font-weight:700;color:#1F3A2A;letter-spacing:.14em;}
.tb-burger{display:none;background:none;border:0;font-size:22px;line-height:1;cursor:pointer;color:#1F3A2A;padding:2px 6px;}
.tb-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.tb-nav{display:flex;align-items:center;gap:2px;flex-wrap:nowrap;flex-shrink:0;}
.tb-nav a,.tb-drop-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 12px;border-radius:12px;font-weight:500;font-size:14.5px;color:#1F3A2A;
  text-decoration:none;white-space:nowrap;background:none;border:none;cursor:pointer;
  font-family:inherit;transition:background .18s,color .18s;
}
.tb-nav a:hover,.tb-drop-btn:hover{background:#EAF2E8;color:#2f8a39;}
.tb-nav a.active{background:#EAF2E8;color:#2f8a39;}
.tb-ic{width:16px;height:16px;stroke:#2f8a39;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}
.tb-nav a.tb-line{background:#3DAA47;color:#fff;font-weight:700;border-radius:999px;padding:10px 18px;margin-left:8px;box-shadow:0 4px 12px rgba(61,170,71,.25);}
.tb-nav a.tb-line:hover{background:#2f8a39;color:#fff;}
.tb-nav a.tb-line .tb-ic{stroke:#fff;}
/* 下拉選單 */
.tb-drop{position:relative;}
.tb-drop-menu{
  position:absolute;top:calc(100% + 6px);right:0;min-width:200px;
  background:#fff;border:1.5px solid #C5DBC3;border-radius:16px;
  box-shadow:0 12px 28px rgba(31,58,42,.10);padding:8px;display:none;z-index:200;
}
.tb-drop:hover .tb-drop-menu,.tb-drop:focus-within .tb-drop-menu{display:block;}
.tb-drop-menu a{display:flex;padding:9px 12px;border-radius:10px;font-size:14px;font-weight:500;color:#1F3A2A;}
.tb-drop-menu a:hover{background:#EAF2E8;color:#2f8a39;}
@media(max-width:680px){
  .topbar-inner{height:60px;padding:0 14px;}
  .tb-brand img{height:42px;}
  .tb-brand-txt b{font-size:14.5px;}
  .tb-brand-txt small{font-size:11px;}
  .tb-burger{display:block;}
  /* 手機選單：首頁式全寬白卡面板（不是右側小卡） */
  .tb-nav{
    display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:#FAF7F2;border-bottom:1px dashed #C5DBC3;
    box-shadow:0 18px 30px rgba(31,58,42,.12);padding:6px 20px 16px;
  }
  .tb-toggle:checked ~ .tb-nav{display:flex;}
  .tb-nav a,.tb-drop-btn{padding:13px 8px;font-size:15px;width:100%;border-radius:0;border-bottom:1px dashed #DCE8DA;}
  .tb-nav a.tb-line{margin:12px 0 0;justify-content:center;border-radius:12px;border-bottom:none;padding:12px;}
  .tb-drop{position:static;width:100%;}
  .tb-drop-btn{
    display:flex;pointer-events:none;border-bottom:none;
    padding:12px 8px 2px;font-size:12.5px;font-weight:700;color:#6B7280;letter-spacing:.2em;
  }
  .tb-drop-btn .tb-ic:last-child{display:none;} /* 藏下拉箭頭 */
  .tb-drop-menu{position:static;display:block;box-shadow:none;border:0;padding:0 0 0 22px;min-width:0;background:transparent;}
  .tb-drop-menu a{padding:11px 8px;font-size:14.5px;color:#1F3A2A;}
}