@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@500;600;700&family=Noto+Sans+TC:wght@400;500;600&display=swap');

:root { --green:#344c2d; --olive:#657b4c; --ink:#2e3528; font-family:'Noto Sans TC',sans-serif; color:var(--ink); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; }
a { color:inherit; text-decoration:none; }
button, input, select { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }

/* scroll reveal (replaces framer-motion whileInView) */
.reveal { opacity:0; transform:translateY(30px); transition:opacity .65s ease, transform .65s ease; }
.reveal.in-view { opacity:1; transform:translateY(0); }
.hero-copy { opacity:0; transform:translateX(-35px); transition:opacity .85s ease, transform .85s ease; }
.hero-copy.in-view { opacity:1; transform:translateX(0); }
.search-box { opacity:0; transform:translateY(25px); transition:opacity .7s ease .3s, transform .7s ease .3s; }
.search-box.in-view { opacity:1; transform:translateY(0); }

.hero { min-height:635px; position:relative; background:url('../../images/towns-bnb_dex.jpg') top center no-repeat; overflow:hidden; }
.hero::after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  height: 200px; /* 高度加大，波浪弧度才會更明顯 */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 200' preserveAspectRatio='none'%3E%3Cpath d='M0,60 C240,200 480,0 720,80 C960,160 1200,0 1440,90 L1440,200 L0,200 Z' fill='white'/%3E%3C/svg%3E");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.9) 25%,rgba(255,255,255,.25) 54%,rgba(255,255,255,0) 72%); }
.hero-copy { position:relative; z-index:3; padding:91px max(45px,calc((100vw - 1140px)/2)); width:62%; }
.hero-copy h1,.hero-copy h2 { font-family:'Noto Serif TC',serif; margin:0; color:#393c2a; font-weight:600; }
.hero-copy h1 { font-size:45px; letter-spacing:.08em; }
/* towns-bnb.php 專用:#wrapper2 的 text-align:center 會繼承到 hero,使標題置中而與
   絕對定位的 .script(Yilan 圓圈)重疊;改回設計原本的靠左(手機版仍維持置中)。 */
.hero-hub .hero-copy { text-align:left; }
/* H1「宜蘭民宿鄉鎮」6 字約 292px,比原本的「探索宜蘭」寬,Yilan 圓圈略往右挪(原本 +320px)。 */
.hero-hub .script { left:calc(max(45px, (100vw - 1140px)/2) + 325px); }
.hero-copy h2 { font-size:31px; letter-spacing:.05em; margin-top:8px; }
.script { position:absolute; top:53px; left:calc(max(45px, (100vw - 1140px)/2) + 320px); margin:0; font:italic 29px Georgia,serif; color:#839052; border:1px solid #aab379; border-radius:50%; width:95px; height:95px; display:grid; place-items:center; transform:rotate(-5deg); }
.lead { font:500 16px/2 'Noto Sans TC'; color:#59605a; margin:26px 0 47px; letter-spacing:.04em; }
.hero-benefits { display:flex; width:510px; justify-content:space-between; }
.hero-benefits span { display:grid; justify-items:center; gap:5px; font-size:13px; }
.hero-benefits svg { color:var(--green); width:27px; height:27px; margin-bottom:3px; }
.hero-benefits b { font-weight:600; }
.hero-benefits small { font-size:10px; color:#777; }
.search-box { position:absolute; z-index:5; right:max(30px,calc((100vw - 1180px)/2)); bottom:91px; width:300px; padding:20px; color:#fff; background:rgba(53,77,41,.9); border-radius:13px; box-shadow:0 12px 35px rgba(20,35,15,.2); }
.search-box h3 { font-size:16px; margin:0 0 14px; display:flex; gap:8px; align-items:center; }
.search-box h3 svg { width:20px; height:20px; }
.search-box label { height:49px; background:#fff; color:#50554e; display:flex; align-items:center; padding:0 12px; font-size:12px; border-bottom:1px solid #e5e6e0; position:relative; }
.search-box label:first-of-type { border-radius:7px 7px 0 0; }
.search-box label:nth-of-type(3) { border:0; border-radius:0 0 7px 7px; }
.search-box select,.search-box input { appearance:none; border:0; outline:0; margin-left:auto; width:145px; color:#848982; background:#fff; font-size:12px; }
.search-box label svg { width:14px; }
.search-box button { height:43px; width:100%; border:0; border-radius:99px; background:#fff; color:var(--green); font-weight:600; margin-top:14px; display:flex; align-items:center; justify-content:center; gap:9px; cursor:pointer; transition:.25s; }
.search-box button svg { width:18px; height:18px; }
.search-box button:hover { background:#edf1e7; transform:translateY(-1px); }

.town-section,.feature-section { max-width:1190px; padding:56px 20px 0; margin:auto; }
.section-title { text-align:center; margin-bottom:37px; }
.section-title h2 { font:600 29px/1.3 'Noto Serif TC'; letter-spacing:.08em; color:var(--green); margin:0 0 8px; }
.section-title p { color:#888b83; font-size:13px; letter-spacing:.05em; margin:0; }
.mountains { height:25px; display:flex; justify-content:center; align-items:center; color:#98a38d; gap:11px; margin-bottom:2px; }
.mountains span { width:68px; border-top:1px solid #b6beae; transform:skewY(-10deg); }
.mountains svg { width:24px; height:24px; }
.town-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:29px 28px; }
.town-card { min-width:0; border:1px solid #e4e4df; border-radius:14px; overflow:hidden; box-shadow:0 3px 8px rgba(28,41,20,.08); background:#fff; transition:.35s; }
.town-card:hover { transform:translateY(-6px); box-shadow:0 14px 28px rgba(28,41,20,.13); }
.card-overlay-link {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.town-image {
  height: 196px;
  overflow: hidden;
  position: relative;
  border-radius: 13px 13px 0 0;

  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 200' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L400,0 L400,180 C300,200 100,160 0,180 Z' fill='black'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 200' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L400,0 L400,180 C300,200 100,160 0,180 Z' fill='black'/%3E%3C/svg%3E");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.town-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: .5s all;
}
.town-card:hover img { transform:scale(1.06); }
.town-content { padding:15px 20px 18px; min-height:198px; display:flex; flex-direction:column; text-align: left; }
.town-content h3 { font:600 22px/1.2 'Noto Serif TC'; margin:0 0 6px; color:#5c4938; }
.town-content span { color:#7f705f; font:12px Georgia,serif; }
.town-content p { font-size:12px; line-height:1.7; height:42px; margin:13px 0 18px; }
.town-content a,.feature a { color:#526e43; font-size:11px; font-weight:600; margin-top:auto; display:flex; align-items:center; gap:8px; }
.town-content a svg,.feature a svg { width:13px; height:13px; }

.feature-section { padding-top:59px; }
.section-title.compact { margin-bottom:25px; }
.section-title.compact h2:before,.section-title.compact h2:after { content:'♧'; display:inline-block; color:#98a38d; font-size:28px; margin:0 23px; transform:rotate(-20deg); }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:23px; }
.feature { border:1px solid #e2e4df; border-radius:12px; overflow:hidden; box-shadow:0 3px 8px rgba(28,41,20,.07); background:#fff; transition:.3s; }
.feature:hover { transform:translateY(-4px); }
.feature img { width:100%; height:150px; object-fit:cover; }
.feature>div { padding:14px 20px 17px; }
.feature h3 { font:600 17px 'Noto Serif TC'; margin:0 0 8px; }
.feature p { white-space:pre-line; font-size:12px; line-height:1.7; height:42px; margin:0 0 14px; }

.booking-banner { max-width:1190px; height:219px; margin:64px auto 0; border-radius:18px; overflow:hidden; background:linear-gradient(90deg,rgba(240,244,241,.98) 7%,rgba(240,244,241,.83) 31%,rgba(240,244,241,.05) 64%),url('https://images.pexels.com/photos/15289946/pexels-photo-15289946.jpeg?auto=compress&cs=tinysrgb&w=1600') center 58%/cover; display:flex; align-items:center; }
.booking-banner>div { padding-left:70px; }
.booking-banner h2 { font:600 26px 'Noto Serif TC'; color:var(--green); margin:0 0 9px; }
.booking-banner p { font-size:12px; line-height:1.8; margin:0 0 17px; }
.booking-banner a { background:#526f3d; color:#fff; border-radius:99px; padding:10px 21px 10px 28px; font-size:12px; font-weight:600; display:inline-flex; gap:17px; align-items:center; transition:.25s; }
.booking-banner a:hover { background:#334c2a; transform:translateX(3px); }
.booking-banner a svg { width:17px; height:17px; }

@media (max-width:1050px) {
  .hero-copy { padding-left:45px; }
  .town-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:760px) {
  .hero { min-height:730px; background-position:63% center; }
  .hero-shade { background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.77) 48%,rgba(255,255,255,.08) 75%); }
  .hero-copy { width:100%; padding:100px 25px 0; text-align:center; }
  .hero-hub .hero-copy { text-align:center; }   /* 手機版蓋回置中(.hero-hub 權重較高) */
  .hero-copy h1 { font-size:38px; }
  .hero-copy h2 { font-size:24px; }
  .lead { font-size:14px; line-height:1.8; margin:19px 0 24px; }
  .script { display:none; }
  .hero-benefits { width:100%; max-width:430px; margin:auto; }
  .hero-benefits small { display:none; }
  .search-box { left:20px; right:20px; bottom:57px; width:auto; }
  .town-section { padding-top:40px; }
  .town-grid { grid-template-columns:repeat(2,1fr); gap:16px; }
  .town-image { height:160px; }
  .town-content { padding:13px 15px 15px; min-height:190px; }
  .feature-grid { grid-template-columns:repeat(2,1fr); }
  .booking-banner { margin:45px 20px; background-position:60% center; }
  .booking-banner>div { padding:25px; background:rgba(245,248,243,.73); width:100%; }
}
@media (max-width:470px) {
  .hero-benefits b { font-size:11px; }
  .hero-benefits svg { width:23px; height:23px; }
  .town-grid { gap:12px; }
  .town-image { height:125px; }
  .town-content h3 { font-size:19px; }
  .town-content span { font-size:10px; }
  .town-content p { font-size:11px; margin:10px 0 16px; }
  .feature-grid { grid-template-columns:1fr; }
  .feature { display:grid; grid-template-columns:45% 55%; }
  .feature img { height:100%; min-height:165px; }
  .section-title h2 { font-size:25px; }
  .section-title.compact h2:before,.section-title.compact h2:after { margin:0 8px; }
  .booking-banner h2 { font-size:21px; }
  .booking-banner>div { padding:22px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal, .hero-copy, .search-box, .town-card, .town-card img, .feature, .booking-banner a { transition:none !important; }
}


/* ═══════════════════════════════════════════════════════════════════
   12 鄉鎮民宿入口區(併自 towns-bnb.php 的 .ib-landing.ib-ripe)
   ・自帶完整樣式,不依賴 mob/css/style.css
   ・色系改用 explore 綠色慢活調(對應 --green / --olive / 山霧灰)
   ═══════════════════════════════════════════════════════════════════ */
.ib-ripe{
  --ibg:#344c2d;        /* 主綠:標題、強調、hover 邊框 */
  --ibg-soft:#526f3d;   /* 次綠 */
  --ib-olive:#657b4c;   /* 橄欖:hover 填色 */
  --ib-sage:#98a38d;    /* 山霧灰綠:記號、底線 */
  --ib-line:#b6beae;    /* 細線 */
  --ib-border:#dfe3d3;  /* 卡片、表格邊框 */
  --ib-tint:#eef2e7;    /* 淺底 / hover 底 */
  --ib-tag:#e9eede;     /* 標籤底 */
  --ib-cream:#fbfcf5;   /* 深底上的淺字 */
  --ib-ink:#3b4232;     /* 內文 */
  --ib-muted:#6b7358;   /* 次要文字 */
}

/* 版面容器 */
.ib-landing{ background:#fff; padding:14px 20px 4px; }
.ib-inner{ max-width:1000px; margin:0 auto; }
.ib-ripe, .ib-ripe *{ box-sizing:border-box; }

/* 麵包屑 */
.ib-crumb{ font-size:13px; color:#6b7358; margin:0 0 18px; letter-spacing:.03em; }
.ib-crumb a{ display:inline; color:#526f3d; text-decoration:none; font-weight:600; }
.ib-crumb a:hover{ text-decoration:underline; }

/* 主標與前言 */
.ib-pageh1{ font-family:'Noto Serif TC',serif; font-size:31px; line-height:1.35; font-weight:700; color:#344c2d; letter-spacing:.05em; margin:0 0 18px; }
.ib-intro{ font-size:15.5px; line-height:2.05; color:#3b4232; margin:0 0 4px; letter-spacing:.02em; }
p.ib-intro { font-size: 15px; line-height: 2; color: #3b4232; margin: 0 0 14px; text-align: left;}
/* 內文小標與段落 */
.ib-ripe .ib-eyebrow{ font:italic 600 15px/1 Georgia,serif; color:#657b4c; letter-spacing:.09em; margin:36px 0 8px; }
.ib-ripe h3{ font-family:'Noto Serif TC',serif; font-size:23px; line-height:1.4; font-weight:600; color:#344c2d; letter-spacing:.04em; margin:0 0 14px; }
.ib-ripe p{ font-size:15px; line-height:2; color:#3b4232; margin:0 0 14px; }
.ib-ripe .ib-eyebrow[id], .ib-ripe h3[id]{ scroll-margin-top:90px; }

/* 頁首特色列 */
.ib-hubstat{ display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 4px; padding:0; }
.ib-hubstat span{ display:inline-flex; align-items:center; gap:7px; background:#e9eede; color:#344c2d; font-size:13px; letter-spacing:.5px; padding:8px 18px; border-radius:30px; }
.ib-hubstat span::before{ content:""; width:6px; height:6px; border-radius:50%; background:#98a38d; }

/* 區域快速跳轉(含 scroll-spy 高亮 .is-active) */
.ib-jump{ display:flex; flex-wrap:wrap; gap:10px; margin:26px 0; padding:0; list-style:none; }
.ib-jump li{ list-style:none; }
.ib-jump a{ display:inline-block; background:#fff; border:1px solid #dfe3d3; border-radius:30px; padding:9px 20px; font-size:13.5px; font-weight:700; color:#344c2d; text-decoration:none; box-shadow:0 5px 14px rgba(52,76,45,.05); transition:.25s; }
.ib-jump a::after{ content:" ↓"; font-size:11px; color:#98a38d; }
.ib-jump a:hover, .ib-jump a.is-active{ background:#344c2d; border-color:#344c2d; color:#fbfcf5; }
.ib-jump a:hover::after, .ib-jump a.is-active::after{ color:#c9d6a2; }

/* 區域標題 */
.ib-zone{ margin:0 0 6px; }
.ib-zone-mark{ display:inline-block; width:34px; height:3px; background:#98a38d; vertical-align:middle; margin:0 12px 6px 0; }
.ib-zone-desc{ font-size:15px; color:#6b7358; margin:0 0 18px; line-height:1.9; }

/* 鄉鎮卡片(北境/中境/南境 區塊下方)
   卡片本身是 flex 直欄,.ib-tc-go 用 margin-top:auto 推到底部,
   讓同一列裡文字長短不一的卡片,按鈕仍在同一條基準線上。 */
/* 每區剛好 4 個鄉鎮:用 4 欄(或 2 欄)才會整齊,3 欄會排成 3+1 留下孤兒卡 */
.ib-towngrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin:0 0 34px; padding:0; list-style:none; }
.ib-towngrid li{ list-style:none; display:flex; }
.ib-towncard{
  position:relative; display:flex; flex-direction:column; width:100%;
  background:#fff; border:1px solid #e2e6d6; border-radius:18px;
  padding:22px 22px 20px; text-decoration:none;
  box-shadow:0 2px 10px rgba(52,76,45,.05);
  transition:border-color .25s, box-shadow .25s, transform .25s;
}
/* 左側色條:hover 時由上往下展開(取代原本橫跨頂端的 4px 粗線) */
.ib-towncard::before{
  content:""; position:absolute; left:0; top:20px; bottom:20px; width:3px;
  border-radius:0 3px 3px 0; background:#657b4c;
  transform:scaleY(0); transform-origin:top; transition:transform .3s;
}
/* bootstrap.min.css 有 a:hover{text-decoration:underline}(0,1,1),會蓋過卡片上的
   text-decoration:none(0,1,0);用 .ib-towncard:hover(0,2,0)壓回去,滑過時不出現底線。 */
.ib-towncard:hover, .ib-towncard:focus{ text-decoration:none; }
.ib-towncard:hover{ border-color:#c6cfb4; box-shadow:0 16px 40px rgba(52,76,45,.13); transform:translateY(-4px); }
.ib-towncard:hover::before{ transform:scaleY(1); }
.ib-towncard:focus-visible{ outline:2px solid #344c2d; outline-offset:3px; }

.ib-tc-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:0 0 11px; }
.ib-tc-name{ font-family:'Noto Serif TC',serif; font-size:22px; font-weight:500; color:#26331f; line-height:1.25; letter-spacing:.02em; }
.ib-tc-tag{ flex:0 0 auto; background:#eef2e4; color:#54703e; font-size:11px; font-weight:700; letter-spacing:.06em; padding:5px 11px; border-radius:999px; white-space:nowrap; transition:.25s; }
.ib-towncard:hover .ib-tc-tag{ background:#344c2d; color:#fff; }

.ib-tc-lead{ display:block; font-size:14px; line-height:1.85; color:#4a5240; margin:0 0 16px; }

/* 三行規格改為 40px 標籤欄 + 內容欄的網格,取代原本的懸掛縮排 */
.ib-tc-metas{ display:grid; gap:8px; margin:0 0 20px; padding-top:15px; border-top:1px solid #edf0e4; }
.ib-tc-meta{ display:grid; grid-template-columns:40px 1fr; gap:10px; align-items:start; font-size:12.5px; line-height:1.7; color:#6b7358; }
.ib-tc-meta b{ font-size:11px; font-weight:700; letter-spacing:.08em; color:#8a9178; padding-top:2px; }
.ib-tc-meta em{ font-style:normal; }

/* 連結:膠囊按鈕 + 圓形箭頭(與 12 鄉鎮頁的 .tl-btn 同一套語彙,改用本頁的綠色) */
.ib-tc-go{
  position:relative; align-self:flex-start; margin-top:auto;
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; font-weight:700; letter-spacing:.02em; color:#344c2d;
  background:#f4f7ec; border:1px solid #dfe4d1; border-radius:999px;
  padding:7px 7px 7px 16px; transition:.25s;
}
.ib-tc-go::after{ content:""; flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:#344c2d; transition:.25s; }
.ib-tc-go::before{
  content:""; position:absolute; right:17px; top:50%; z-index:1;
  width:6px; height:6px; border-right:2px solid #fff; border-top:2px solid #fff;
  transform:translate(-1px,-50%) rotate(45deg); transition:.25s;
}
.ib-towncard:hover .ib-tc-go{ background:#344c2d; border-color:#344c2d; color:#fff; }
.ib-towncard:hover .ib-tc-go::after{ background:#fff; }
.ib-towncard:hover .ib-tc-go::before{ border-color:#344c2d; transform:translate(2px,-50%) rotate(45deg); }

/* 對照表 */
.ib-table-wrap{ overflow-x:auto; margin:0 0 10px; border-radius:14px; border:1px solid #dfe3d3; -webkit-overflow-scrolling:touch; }
.ib-table{ width:100%; border-collapse:collapse; font-size:14px; background:#fff; min-width:520px; }
.ib-table th{ background:#344c2d; color:#fbfcf5; font-weight:600; text-align:left; padding:12px 16px; letter-spacing:.03em; white-space:nowrap; }
.ib-table td{ padding:12px 16px; border-top:1px solid #dfe3d3; color:#3b4232; line-height:1.75; vertical-align:top; }
.ib-table tr:nth-child(even) td{ background:#f8faf4; }

/* 內文連結(對抗 main.css 全域 a{display:block}) */
.ib-ripe table.ib-table a,
.ib-ripe .ib-points a{ display:inline; color:#344c2d; font-weight:700; text-decoration:none; border-bottom:2px solid #98a38d; padding-bottom:1px; transition:.2s; white-space:nowrap; }
.ib-ripe table.ib-table a:hover,
.ib-ripe .ib-points a:hover{ background:#eef2e7; border-bottom-color:#344c2d; }
.ib-ripe table.ib-table td:nth-child(2){ font-weight:700; }

/* 註記 */
.ib-note{ font-size:12.5px; color:#6b7358; margin:8px 0 4px; line-height:1.8; }

/* 重點清單 */
.ib-points{ margin:0 0 14px; padding:0 0 0 2px; list-style:none; }
.ib-points li{ position:relative; padding:0 0 10px 24px; font-size:15px; line-height:1.9; color:#3b4232; }
.ib-points li::before{ content:""; position:absolute; left:2px; top:12px; width:8px; height:8px; border-radius:50%; background:#98a38d; }
.ib-points strong{ color:#344c2d; font-weight:700; }

/* 引言區塊 */
.ib-quote{ background:#eef2e7; border-left:4px solid #657b4c; border-radius:0 14px 14px 0; padding:22px 26px; margin:0 0 14px; }
.ib-quote p{ margin:0; font-size:15px; line-height:2.05; color:#3b4232; }

/* FAQ */
.ib-faq{ margin:0 0 10px; }
.ib-faq dt{ position:relative; padding-left:26px; font-size:16px; font-weight:700; color:#344c2d; margin:18px 0 8px; line-height:1.6; }
.ib-faq dt::before{ content:"Q"; position:absolute; left:0; top:1px; width:19px; height:19px; line-height:19px; text-align:center; font-size:11px; border-radius:50%; background:#344c2d; color:#fbfcf5; font-family:Arial,sans-serif; }
.ib-faq dd{ margin:0; padding-left:26px; font-size:14.5px; line-height:1.95; color:#3b4232; }

/* 延伸連結 */
.ib-morelink{ margin:34px 0 6px; padding:20px 0 0; border-top:1px solid #dfe3d3; font-size:14px; color:#6b7358; }
.ib-morelink a{ display:inline-block; color:#344c2d; font-weight:700; text-decoration:none; border-bottom:2px solid #98a38d; padding-bottom:1px; margin:0 14px 8px 6px; transition:.2s; }
.ib-morelink a:hover{ background:#eef2e7; border-bottom-color:#344c2d; }

/* RWD */
@media (max-width:1199px){ .ib-towngrid{ grid-template-columns:repeat(2,1fr); gap:16px; } }
@media (max-width:640px){
  .ib-landing{ padding:8px 16px 4px; }
  .ib-pageh1{ font-size:26px; }
  .ib-ripe h3{ font-size:20px; }
  .ib-towngrid{ grid-template-columns:1fr; gap:14px; }
  .ib-tc-name{ font-size:22px; }
  .ib-towncard{ padding:22px 20px 20px; }
  .ib-jump a{ padding:8px 15px; font-size:13px; }
}