/* 宜蘭民宿名錄 — 靜態重建 v1(2026-08) */
:root{
  --teal:#0f766e; --teal-dark:#115e59; --teal-light:#f0fdfa;
  --ink:#1f2937; --dim:#6b7280; --line:#e5e7eb; --bg:#ffffff; --bg-soft:#f8fafc;
  --open:#16a34a; --open-bg:#f0fdf4;
  --closed:#6b7280; --closed-bg:#f3f4f6;
  --delisted:#b91c1c; --delisted-bg:#fef2f2;
  --unknown:#d97706; --unknown-bg:#fffbeb;
  --renamed:#2563eb; --renamed-bg:#eff6ff;
  --radius:12px; --radius-lg:16px;
  --maxw:1080px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:"Noto Sans TC",-apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei",sans-serif;color:var(--ink);background:var(--bg);line-height:1.75;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.wrap>*{min-width:0}

/* ===== Header(sticky 鐵律)===== */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:60px}
.brand{display:flex;align-items:baseline;gap:8px;font-weight:900;font-size:1.15rem;color:var(--teal-dark)}
.brand:hover{text-decoration:none}
.brand .en{font-size:.7rem;font-weight:500;color:var(--dim);letter-spacing:.12em}
.main-nav ul{display:flex;gap:4px;list-style:none}
.main-nav a{display:block;padding:8px 12px;border-radius:8px;font-size:.95rem;color:var(--ink)}
.main-nav a:hover{background:var(--teal-light);color:var(--teal-dark);text-decoration:none}
.main-nav a.active{color:var(--teal-dark);font-weight:700}
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;background:none;border:0;cursor:pointer}
.nav-toggle span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:.25s}
@media (max-width:900px){
  .nav-toggle{display:flex}
  .main-nav{position:fixed;inset:60px 0 auto 0;bottom:0;background:#fff;transform:translateX(100%);transition:transform .25s;overflow-y:auto;z-index:99}
  .main-nav.open{transform:none}
  .main-nav ul{flex-direction:column;padding:16px 20px;gap:0}
  .main-nav a{padding:14px 8px;font-size:1.05rem;border-bottom:1px solid var(--line)}
  body.nav-locked{overflow:hidden}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* ===== 共用 ===== */
.breadcrumb{font-size:.85rem;color:var(--dim);padding:14px 0 0}
.breadcrumb a{color:var(--dim)}
.breadcrumb span{margin:0 6px;color:#cbd5e1}
h1{font-size:1.7rem;line-height:1.35;margin:10px 0 6px;font-weight:900}
.page-sub{color:var(--dim);font-size:.95rem;margin-bottom:14px}
.section{padding:26px 0}
h2{font-size:1.25rem;margin:26px 0 12px;padding-left:12px;border-left:4px solid var(--teal);font-weight:800}

/* 狀態徽章 */
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 12px;border-radius:999px;font-size:.82rem;font-weight:700;white-space:nowrap;vertical-align:middle}
.badge::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.badge.open{color:var(--open);background:var(--open-bg)}
.badge.closed{color:var(--closed);background:var(--closed-bg)}
.badge.delisted{color:var(--delisted);background:var(--delisted-bg)}
.badge.unknown{color:var(--unknown);background:var(--unknown-bg)}
.badge.renamed{color:var(--renamed);background:var(--renamed-bg)}
.badge.hotel{color:#7c3aed;background:#f5f3ff}

/* 名冊資訊盒 */
.registry-box{display:flex;flex-wrap:wrap;gap:10px 22px;background:var(--teal-light);border:1px solid #ccfbf1;border-radius:var(--radius);padding:14px 18px;margin:14px 0;font-size:.9rem}
.registry-box .k{color:var(--dim);margin-right:6px}
.registry-box>div{min-width:0}

/* 歇業/狀態說明盒 */
.status-note{border-radius:var(--radius);padding:16px 18px;margin:14px 0;font-size:.95rem;border:1px solid}
.status-note.closed{background:var(--closed-bg);border-color:#d1d5db}
.status-note.delisted{background:var(--delisted-bg);border-color:#fecaca}
.status-note.unknown{background:var(--unknown-bg);border-color:#fde68a}
.status-note.renamed{background:var(--renamed-bg);border-color:#bfdbfe}
.status-note .evidence{display:block;margin-top:6px;font-size:.83rem;color:var(--dim)}

/* 替代推薦 */
.alt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin:12px 0}
.alt-grid a{display:block;background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;min-width:0}
.alt-grid a:hover{border-color:var(--teal);text-decoration:none}
.alt-grid .n{font-weight:700}
.alt-grid .t{font-size:.83rem;color:var(--dim);margin-top:2px}

/* 內文(舊站內容剝乾淨後) */
.legacy-content{margin:18px 0}
.legacy-content p{margin:0 0 1em}
.legacy-content img{border-radius:var(--radius);margin:14px auto}
.legacy-content h2,.legacy-content h3{margin:24px 0 10px}
.legacy-content ul,.legacy-content ol{padding-left:1.4em;margin:0 0 1em}
.legacy-content iframe{max-width:100%;border:0;border-radius:var(--radius)}
.legacy-content table{display:block;overflow-x:auto;border-collapse:collapse;max-width:100%}
.legacy-content td,.legacy-content th{border:1px solid var(--line);padding:6px 10px}

/* 卡片列表(hub) */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin:16px 0}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;display:flex;flex-direction:column;gap:8px;min-width:0}
.card:hover{border-color:var(--teal);box-shadow:0 4px 16px rgba(15,118,110,.08)}
.card .name{font-size:1.05rem;font-weight:800}
.card .name a{color:var(--ink)}
.card .meta{font-size:.83rem;color:var(--dim)}
.card .desc{font-size:.9rem;color:#4b5563;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* 首頁 hero */
.hero{background:linear-gradient(160deg,var(--teal-light),#fff 70%);border-bottom:1px solid var(--line);padding:44px 0 34px}
.hero h1{font-size:2rem;margin:0 0 8px}
.hero .lead{font-size:1.05rem;color:#374151;max-width:640px}
.hero .stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.hero .stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:10px 18px;font-size:.9rem}
.hero .stat b{display:block;font-size:1.3rem;color:var(--teal-dark)}
.hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:18px 0}
.hub-grid a{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;min-width:0}
.hub-grid a:hover{border-color:var(--teal);text-decoration:none}
.hub-grid .t{font-weight:800;font-size:1.05rem}
.hub-grid .d{font-size:.85rem;color:var(--dim);margin-top:4px}

/* 誠實方法論條 */
.method-strip{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;font-size:.88rem;color:#4b5563;margin:18px 0}

/* Footer */
.site-footer{margin-top:44px;border-top:1px solid var(--line);background:var(--bg-soft);padding:30px 0;font-size:.88rem;color:var(--dim)}
.site-footer .cols{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between}
.site-footer .cols>div{min-width:0}
.site-footer h4{font-size:.92rem;color:var(--ink);margin-bottom:8px}
.site-footer ul{list-style:none}
.site-footer li{margin:4px 0}
.site-footer .bottom{margin-top:20px;padding-top:14px;border-top:1px solid var(--line);font-size:.8rem}

/* ===== 照片圖廊 ===== */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin:16px 0}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line)}
.gallery img:first-child{grid-column:1/-1;aspect-ratio:16/9}
@media (max-width:640px){.gallery{grid-template-columns:repeat(2,1fr)}}

/* 卡片縮圖 */
.card{padding:0;overflow:hidden}
.card>div{padding:0 18px}
.card>div:last-child,.card .desc{padding-bottom:14px}
.card .name{padding-top:14px}
.card-thumb{display:block;margin:0 !important;padding:0 !important}
.card-thumb img{width:100%;aspect-ratio:16/10;object-fit:cover}
.card:not(:has(.card-thumb)) .name{padding-top:18px}

/* ===== Agoda 訂房 CTA ===== */
.booking-cta{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:linear-gradient(135deg,#fff7ed,#fffbeb);border:1px solid #fed7aa;border-radius:var(--radius-lg);padding:16px 20px;margin:16px 0}
.booking-cta .bc-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.booking-cta .bc-text span{font-size:.88rem;color:var(--dim)}
.bc-btn{display:inline-block;background:#d97706;color:#fff !important;font-weight:800;padding:10px 22px;border-radius:999px;white-space:nowrap}
.bc-btn:hover{background:#b45309;text-decoration:none}

/* ===== 包棟深度 hub ===== */
.quick-nav{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.quick-nav a{background:var(--teal-light);border:1px solid #ccfbf1;color:var(--teal-dark);padding:7px 16px;border-radius:999px;font-size:.9rem;font-weight:700}
.quick-nav a:hover{background:var(--teal);color:#fff;text-decoration:none}
.town-h{margin:22px 0 10px;font-size:1.05rem;color:var(--teal-dark)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{background:var(--bg-soft);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:.78rem;color:#4b5563}
.chip.cap{background:var(--teal-light);border-color:#ccfbf1;color:var(--teal-dark);font-weight:700}
.card .chips{padding:0 18px 14px}
.feat-row{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px;margin:10px 0;font-size:.92rem;line-height:2}
.guide-block h3{margin:20px 0 8px;font-size:1.05rem}
.guide-block p{margin:0 0 1em;color:#374151}
.faq{border:1px solid var(--line);border-radius:var(--radius);margin:8px 0;background:#fff}
.faq summary{padding:14px 18px;font-weight:700;cursor:pointer;list-style:none}
.faq summary::before{content:"Q ";color:var(--teal)}
.faq p{padding:0 18px 14px;color:#374151}

/* 民宿檔案 */
.profile-box{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px 20px;margin:12px 0}
.profile-box ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 20px}
.profile-box li{min-width:0}
.profile-box strong{color:var(--teal-dark);margin-right:8px;font-size:.88rem}

/* fix: line-clamp 截斷文字從 padding 縫露出 → 底距改用 margin */
.card .desc{padding-bottom:0;margin-bottom:14px}
.card>div:last-child.desc{padding-bottom:0}

/* 雙訂房按鈕 */
.bc-btns{display:flex;gap:10px;flex-wrap:wrap}
.bc-btn.bk{background:#003b95}
.bc-btn.bk:hover{background:#00224f}
