/* ============================================================
   shared.css — Penguin CMS v4
   全站共用樣式 · Skin 可透過 /skins/*.css 覆蓋任何變數
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;}
html{font-size:var(--font-scale);}
body{background-color:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans TC","PingFang TC",sans-serif;margin:0;padding:0;line-height:1.6;overflow-x:hidden;}
a{color:inherit;}
img{max-width:100%;height:auto;}

/* Layout */
.container{max-width:var(--max-w);margin:0 auto;padding:20px;}
.layout-wrapper{display:flex;gap:30px;align-items:flex-start;}
.main-content{flex:1;min-width:0;}
.sidebar{width:300px;flex-shrink:0;display:flex;flex-direction:column;gap:20px;}

/* Sticky Header */
.sticky-header-container{position:sticky;top:0;z-index:1000;width:100%;}
@supports (position: -webkit-sticky) {
  .sticky-header-container{position:-webkit-sticky;}
}
.header-wrapper{background:var(--card-bg);box-shadow:0 2px 10px rgba(0,0,0,0.06);width:100%;}
header{max-width:var(--max-w);margin:0 auto;padding:0 20px;display:flex;flex-wrap:nowrap;gap:16px;min-height:72px;align-items:center;justify-content:space-between;position:relative;}
header .header-right{margin-left:auto;}
header .header-right:last-child{margin-left:auto;}
header .nav-links:last-child{margin-left:10px;}
header .header-right + .nav-links{margin-left:0;}
.header-right-text{font-size:9px;font-weight:600;line-height:1.45;text-align:right;white-space:normal;display:inline-block;max-width:240px;}

/* Branding */
.site-branding{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.title-text-group{display:flex;flex-direction:column;justify-content:center;}
.title-row{display:flex;align-items:center;gap:8px;}
.logo-title{color:var(--text);text-decoration:none;font-size:22px;font-weight:800;line-height:1;white-space:nowrap;}
.blog-badge{background:var(--accent);color:#fff;font-size:11px;font-weight:bold;padding:2px 8px;border-radius:20px;line-height:1;white-space:nowrap;}
.site-subtitle{font-size:11px;color:var(--accent);opacity:0.8;margin-top:3px;letter-spacing:2px;}

/* Hamburger */
.hamburger{display:none;background:none;border:none;font-size:24px;color:var(--text);cursor:pointer;padding:4px;flex-shrink:0;}

/* Main Nav */
.nav-links{display:flex;gap:4px;align-items:center;flex-wrap:nowrap;}
.nav-links > a,
.nav-links > .nav-item > a{color:var(--text);font-weight:600;text-decoration:none;font-size:13px;padding:8px 12px;border-radius:6px;transition:0.15s;white-space:nowrap;display:flex;align-items:center;gap:2px;}
.nav-links > a:hover,.nav-links > .nav-item > a:hover,
.nav-links > a.active,.nav-links > .nav-item > a.active{background:rgba(0,0,0,0.05);color:var(--accent);}
.nav-links > a.highlight,.nav-links > .nav-item > a.highlight{background:var(--accent);color:#fff!important;padding:7px 16px;border-radius:20px;}
.nav-links > a.highlight:hover,.nav-links > .nav-item > a.highlight:hover{opacity:0.88;}
.nav-arrow{font-size:10px;opacity:0.6;}

/* Nav Item wrapper */
.nav-item{position:relative;}

/* Standard Dropdown */
.dropdown-panel{display:none;position:absolute;top:calc(100% + 4px);left:0;background:var(--card-bg);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,0.12);min-width:180px;z-index:9999;padding:6px;flex-direction:column;}
.nav-item.has-dropdown:hover .dropdown-panel,.nav-item.has-dropdown:focus-within .dropdown-panel{display:flex;}
.dropdown-link{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:6px;color:var(--text);text-decoration:none;font-size:13px;transition:0.12s;white-space:nowrap;}
.dropdown-link:hover{background:rgba(0,0,0,0.05);color:var(--accent);}

/* Mega Menu Panel */
.mega-panel{display:none;position:absolute;top:100%;left:0;background:var(--card-bg);border:1px solid var(--border);border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,0.14);z-index:9999;padding:16px;padding-top:20px;flex-direction:row;flex-wrap:nowrap;gap:0;min-width:220px;}
.nav-item.has-mega>a{position:relative;}
.nav-item.has-mega>a::after{content:'';position:absolute;bottom:-16px;left:0;width:100%;height:16px;}
.nav-item.has-mega:hover .mega-panel,.nav-item.has-mega:focus-within .mega-panel{display:flex;}
.mega-col{flex:0 0 auto;min-width:160px;padding:0 20px 0 0;border-right:1px solid var(--border);}
.mega-col:last-child{border-right:none;padding-right:0;}
.mega-col-title{font-size:11px;font-weight:700;color:var(--mid-grey);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border);}
.mega-link{display:flex;align-items:flex-start;gap:8px;padding:7px 8px;border-radius:6px;color:var(--text);text-decoration:none;font-size:13px;transition:0.12s;white-space:nowrap;}
.mega-link:hover{background:rgba(0,0,0,0.05);color:var(--accent);}
.mega-link-icon{font-size:15px;width:20px;text-align:center;flex-shrink:0;margin-top:1px;}
.mega-link-body{display:flex;flex-direction:column;}
.mega-link-title{font-size:13px;font-weight:500;}
.mega-link-desc{font-size:11px;color:var(--mid-grey);margin-top:1px;white-space:normal;}

/* Sub Nav Bar */
.sub-nav-bar{background:var(--card-bg);border-bottom:1px solid var(--border);}
.sub-nav-inner{max-width:var(--max-w);margin:0 auto;padding:0 20px;display:flex;gap:0;align-items:center;overflow-x:auto;scrollbar-width:none;}
.sub-nav-inner::-webkit-scrollbar{display:none;}
.sub-nav-link{display:flex;align-items:center;gap:2px;color:var(--text);text-decoration:none;font-size:13px;font-weight:600;padding:10px 14px;border-bottom:3px solid transparent;white-space:nowrap;transition:0.15s;opacity:0.7;}
.sub-nav-link:hover,.sub-nav-link.active{opacity:1;color:var(--accent);border-bottom-color:var(--accent);}
.sub-nav-link.highlight{background:var(--accent);color:#fff!important;border-radius:20px;margin:6px 4px;padding:5px 14px;border-bottom:none;opacity:1;}
.sub-mega-item{position:relative;}
.sub-mega-panel{top:100%;left:0;}

/* Content Top Bar */
.content-top-bar{background:var(--card-bg);padding:12px 20px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;box-shadow:0 2px 10px rgba(0,0,0,0.02);gap:15px;flex-wrap:wrap;}
.content-top-bar h2{margin:0;font-size:15px;color:var(--text);display:flex;align-items:center;gap:6px;}
.content-top-bar h2 span{color:var(--mid-grey);font-size:12px;font-weight:normal;}
.search-sort-area{display:flex;gap:8px;align-items:center;flex-wrap:nowrap;}
.search-box{display:flex;align-items:center;background:var(--bg);border:1px solid var(--border);border-radius:20px;padding:4px 10px;width:180px;}
.search-box input{border:none;background:transparent;color:var(--text);font-size:12px;outline:none;width:100%;}
.sort-toggle{display:flex;background:var(--bg);border-radius:20px;overflow:hidden;border:1px solid var(--border);}
.sort-btn{padding:4px 10px;font-size:12px;color:var(--text);text-decoration:none;font-weight:bold;white-space:nowrap;}
.sort-btn.active{background:var(--accent);color:#fff;}

/* Cards */
.grid{display:grid;grid-template-columns:repeat(var(--grid-cols,2),1fr);gap:20px;}
.card{background:var(--card-bg);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;transition:transform 0.2s,box-shadow 0.2s;display:flex;box-shadow:0 4px 12px rgba(0,0,0,0.04);}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(0,0,0,0.08);}
.card-img-wrap{position:relative;background:var(--light-grey);overflow:hidden;flex-shrink:0;}
.card-img-wrap img{width:100%;height:100%;object-fit:cover;display:block;}
.card-tag-overlay{position:absolute;top:10px;left:10px;background:var(--accent);color:#fff;font-size:11px;padding:2px 8px;border-radius:15px;font-weight:bold;z-index:2;}
.card-body{padding:16px;display:flex;flex-direction:column;flex:1;min-width:0;}
.card-meta{font-size:11px;color:var(--mid-grey);margin-bottom:8px;display:flex;gap:10px;align-items:center;}
.card-title{margin:0 0 8px;font-size:15px;font-weight:700;line-height:1.4;color:var(--text);}
.card-excerpt{color:var(--dark-grey);font-size:12px;margin:0 0 15px;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.card-footer{display:flex;justify-content:space-between;align-items:center;font-size:12px;border-top:1px solid var(--light-grey);padding-top:12px;margin-top:auto;}
.card-author{color:var(--mid-grey);}
.card-readmore{color:var(--accent);font-weight:bold;}
.card.layout-vertical{flex-direction:column;}
.card.layout-vertical .card-img-wrap{width:100%;aspect-ratio:var(--img-aspect,16/9);}
.card.layout-horizontal{flex-direction:row;align-items:stretch; margin-top: 10px;}
.card.layout-horizontal .card-img-wrap{width:38%;aspect-ratio:var(--img-aspect,16/9);}

/* Sidebar Widget */
.widget{background:var(--sidebar-bg);padding:20px;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,0.02);}
.widget-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;}
.widget-header h3{margin:0;font-size:15px;color:var(--text);}
.widget-badge{background:rgba(96,165,250,0.1);color:var(--accent);font-size:11px;padding:2px 8px;border-radius:20px;font-weight:bold;}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px;}
.tag-pill{display:inline-flex;align-items:center;background:var(--light-grey);color:var(--dark-grey);padding:4px 10px;border-radius:15px;font-size:12px;text-decoration:none;transition:0.2s;gap:6px;}
.tag-pill:hover{background:var(--card-bg);color:var(--accent);}
.tag-count{background:#e5e7eb;color:var(--dark-grey);font-size:10px;padding:2px 5px;border-radius:10px;}

/* Pagination */
.pagination{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:30px;flex-wrap:wrap;}
.pagination a{padding:6px 12px;background:var(--card-bg);border:1px solid var(--border);color:var(--text);text-decoration:none;border-radius:6px;font-weight:bold;font-size:13px;transition:0.15s;}
.pagination a:hover,.pagination a.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.pagination a.disabled{opacity:0.4;pointer-events:none;}

/* Post/Story Detail */
.post-detail,.story-detail{background:var(--card-bg);padding:30px;border-radius:12px;box-shadow:0 4px 15px rgba(0,0,0,0.03);}
.post-cover-img,.story-cover-img{width:100%;aspect-ratio:var(--img-aspect,16/9);object-fit:cover;border-radius:8px;margin-bottom:25px;}
.kw-link{color:var(--accent);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px;font-weight:bold;}
.breadcrumbs{font-size:12px;color:var(--mid-grey);margin-bottom:15px;}
.breadcrumbs a{color:var(--text);text-decoration:none;}

/* Buttons */
.btn{padding:8px 16px;background:var(--accent);color:#fff;border:none;border-radius:8px;font-weight:bold;cursor:pointer;text-decoration:none;display:inline-block;transition:0.2s;font-size:13px;}
.btn:hover{opacity:0.85;}
.btn-outline{background:transparent;border:2px solid var(--accent);color:var(--accent);}

/* Ads */
.ad-banner{position:relative;display:block;overflow:hidden;margin-bottom:20px;border-radius:8px;line-height:0;}
.ad-banner a{display:block;text-decoration:none;}
.ad-banner img{width:100%;height:auto;display:block;border-radius:8px;}
.ad-close{position:absolute;top:4px;right:4px;background:rgba(0,0,0,0.5);color:#fff;font-size:10px;width:18px;height:18px;line-height:18px;text-align:center;border-radius:50%;cursor:pointer;z-index:10;}
.ad-side{display:none;position:fixed;top:120px;width:160px;z-index:90;border-radius:8px;}
.ad-left{left:calc(50% - (var(--max-w) / 2) - 180px);}
.ad-right{right:calc(50% - (var(--max-w) / 2) - 180px);}
.ad-mobile-bottom{display:none;}
@media(min-width:1400px){.ad-side{display:block;}}

/* Page Content */
.page-hero {
  width: 100%;
  max-width: 100% !important;  /* 🌟 白色背景拉滿 100% 全幅 */
  background: var(--card-bg);
  border-bottom: 1px solid var(--border);
  padding: 30px 0;
  text-align: left !important;
  box-sizing: border-box;
}

/* 🌟 限制裡面所有內容（麵包屑、標題、副標題）跟返 Container 寬度並居中 */
.page-hero > * {
  max-width: var(--max-w);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

.page-hero .breadcrumbs {
  justify-content: flex-start;
}
.page-title{font-size:32px;margin:0 0 10px;color:var(--text);}
.page-subtitle{font-size:16px;color:var(--mid-grey);margin:0;font-weight:normal;}
.page-content-body{width:100%;font-size:16px;line-height:1.8;color:var(--text);word-break:break-word;}
.page-content-body img{max-width:100%!important;height:auto!important;border-radius:8px;display:block;margin:15px auto;}
.page-content-body iframe,.page-content-body video{max-width:100%!important;border-radius:8px;margin:15px 0;}
.page-content-body table{display:block;width:100%!important;overflow-x:auto;margin:15px 0;border-collapse:collapse;}
.template-standard{max-width:var(--max-w);margin:0 auto;}
.template-fullwidth{max-width:100%;padding:40px 0;}

/* Page Builder Blocks */
.pb-block{width:100%;}
.pb-blocks-wrapper{background:transparent;}
.pb-hero{min-height:50vh;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;padding:60px 40px;background:linear-gradient(135deg,var(--accent),#7c3aed);color:#fff;}
.pb-hero h1{font-size:clamp(28px,5vw,56px);margin:0 0 16px;}
.pb-hero p{font-size:18px;opacity:0.9;max-width:600px;margin:0 0 24px;}
.pb-section{background:transparent;padding:0;}
.pb-section-inner{max-width:var(--max-w);margin:0 auto;padding:0;}
.pb-subtitle{text-align:left;margin-top:10px;margin-bottom:5px; border-bottom:1px solid;}
.pb-subtitle h2{font-size:20px;margin:0 0 10px;}
.pb-subtitle p{color:var(--mid-grey);font-size:15px;margin:0;}
.pb-text{font-size:16px;line-height:1.8;color:var(--text);}
.pb-text img{max-width:100%;border-radius:8px;}
.pb-photo img{width:100%;border-radius:12px;display:block;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.1);}
.pb-pic-text{display:flex;gap:40px;align-items:center;}
.pb-pic-text.reverse{flex-direction:row-reverse;}
.pb-pic-text.stacked{flex-direction:column;}
.pb-pic-text .pb-pic-img{flex:0 0 45%;}
.pb-pic-text .pb-pic-img img{width:100%;border-radius:12px;}
.pb-pic-text .pb-pic-body{flex:1;}
.pb-pic-text .pb-pic-body h3{font-size:22px;margin:0 0 12px;}
.pb-gallery{display:grid;gap:12px;}
.pb-gallery img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;}
.pb-cols {
  display: grid;
  width: 100%;
  max-width: 100%;
  gap: 15px;
  box-sizing: border-box;
}

.pb-col-item {
  min-width: 0;          /* 🌟 關鍵：允許 Grid 子項目縮小，防止內容撐爆欄寬 */
  width: 100%;
  box-sizing: border-box;
  word-break: break-word;/* 🌟 防止長字/標題溢出 */
  overflow-wrap: break-word;
  background: var(--card-bg);
  padding: 18px 16px;
  border-radius: 12px;
  border: var(--bw, 1px) solid var(--border);
  box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}

.pb-col-item h3 {
  font-size: 16px;
  line-height: 1.4;
  margin: 0 0 8px 0;
}
.pb-col-item p{margin:0;color:var(--mid-grey);font-size:14px;}
.pb-cta{text-align:center;padding:60px 20px;border-radius:12px;}
.pb-cta h2{font-size:28px;margin:0 0 12px;}
.pb-cta p{font-size:16px;margin:0 0 24px;opacity:0.9;}
.pb-divider{border:none;border-top:1px solid var(--border);margin:0;}
.pb-spacer{display:block;}
.pb-col-item .pb-col-text {
  margin: 0;
  color: var(--dark-grey);
  font-size: 14px;
  line-height: 1.6;
}
.pb-col-item .pb-col-text p {
  margin: 0 0 8px 0;
}
.pb-col-item .pb-col-text p:last-child {
  margin-bottom: 0;
}
.pb-col-item .pb-col-text ul, .pb-col-item .pb-col-text ol {
  padding-left: 20px;
  margin: 6px 0;
}




/* Footer */
.site-footer{background:var(--card-bg);border-top:1px solid var(--border);}
.footer-mega{max-width:var(--max-w);margin:0 auto;padding:48px 20px 32px;display:grid;gap:32px;}
.footer-mega-col h4{font-size:13px;font-weight:700;color:var(--text);margin:0 0 14px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.footer-mega-col a{display:block;font-size:13px;color:var(--mid-grey);text-decoration:none;padding:4px 0;transition:0.15s;}
.footer-mega-col a::before{content:"» ";}
.footer-mega-col a:hover{color:var(--accent);}
.footer-bottom{border-top:1px solid var(--border);padding:16px 20px;text-align:center;font-size:12px;color:var(--mid-grey);}

/* Responsive */
@media(max-width:1100px){.layout-wrapper{flex-direction:column;}.sidebar{width:100%;}.ad-side{display:none!important;}}
@media(max-width:768px){
  .container{padding:12px;}
  .hamburger{display:block;}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--card-bg);padding:8px 16px 16px;border-bottom:1px solid var(--border);box-shadow:0 10px 20px rgba(0,0,0,0.08);z-index:999;}
  .nav-links.show{display:flex;}
  .nav-links > a,.nav-links > .nav-item > a{padding:12px 4px;border-radius:0;border-bottom:1px solid var(--light-grey);width:100%;}
  .mega-panel,.dropdown-panel{display:none!important;}
  .nav-item.open > .mega-panel,.nav-item.open > .dropdown-panel{display:flex!important;position:static;box-shadow:none;border:none;border-radius:0;padding:0 0 0 16px;flex-direction:column;background:transparent;}
  .nav-item.open > .mega-panel{flex-direction:column;}
  .mega-col{padding:0;border-right:none;min-width:unset;}
  .mega-col-title{margin-top:8px;}
  .sub-nav-bar{overflow-x:auto;}
  .content-top-bar{flex-direction:column;align-items:stretch;}
  .search-sort-area{width:100%;justify-content:space-between;}
  .search-box{flex:1;width:auto;}
  .grid{grid-template-columns:repeat(var(--mobile-cols,1),1fr);gap:12px;}
  .card-body{padding:10px;}
  .card-title{font-size:14px!important;}
  .page-hero{padding:30px 15px;}
  .page-title{font-size:24px;}
  .pb-pic-text{flex-direction:column!important;}
  .pb-pic-text .pb-pic-img{flex:none;width:100%;}
  .footer-mega{grid-template-columns:1fr 1fr!important;padding:32px 16px 20px;}
  .ad-mobile-bottom{display:block;position:fixed;bottom:0;left:0;width:100%;z-index:1000;box-shadow:0 -2px 10px rgba(0,0,0,0.1);background:var(--bg);}
  .ad-mobile-bottom .ad-banner{margin-bottom:0;border-radius:0;}
  .ad-mobile-bottom .ad-banner img{max-height:75px;width:auto;max-width:100%;margin:0 auto;}
  body{padding-bottom:65px;}
}
@media(max-width:480px){.footer-mega{grid-template-columns:1fr!important;}}

.pb-blocks-wrapper{display:flex;flex-direction:column;gap:0;}
.pb-block+.pb-block{margin-top:0;}

.pb-divider.style-dashed{border-top-style:dashed;}
.pb-divider.style-dotted{border-top-style:dotted;}
.pb-divider.style-double{border-top-style:double;border-top-width:4px;}
.pb-divider.style-thick{border-top-width:3px;}

.pb-subtitle.align-left{text-align:left;}
.pb-subtitle.align-right{text-align:right;}
.pb-subtitle.align-center{text-align:center;}

.content-top-bar h2{font-size:15px;}
.page-content-body{font-size:15px;line-height:1.8;color:var(--dark-grey);}
.page-content-body h1,.page-content-body h2,.page-content-body h3{color:var(--text);}

/* Story Cards */
.story-grid{display:grid;grid-template-columns:repeat(var(--grid-cols,2),1fr);gap:20px;}
.story-card{background:var(--card-bg);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;transition:transform 0.2s,box-shadow 0.2s;display:flex;box-shadow:0 4px 12px rgba(0,0,0,0.04);}
.story-card:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(0,0,0,0.08);}
.story-card-img-wrap{position:relative;background:var(--light-grey);overflow:hidden;flex-shrink:0;}
.story-card-img-wrap img{width:100%;height:100%;object-fit:cover;display:block;}
.story-card-body{padding:16px;display:flex;flex-direction:column;flex:1;min-width:0;}
.story-card-body h2{margin:0 0 8px;font-size:15px;font-weight:700;line-height:1.4;color:var(--text);}
.story-card-body p{color:var(--dark-grey);font-size:12px;margin:0 0 15px;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.story-ep-badge{display:inline-block;background:rgba(99,102,241,0.1);color:#6366f1;font-size:11px;font-weight:bold;padding:2px 10px;border-radius:15px;margin-bottom:8px;align-self:flex-start;}
.story-card-footer{display:flex;justify-content:space-between;align-items:center;font-size:12px;border-top:1px solid var(--light-grey);padding-top:12px;margin-top:auto;color:var(--mid-grey);}
.story-card-readmore{color:var(--accent);font-weight:bold;}
.story-card.layout-vertical{flex-direction:column;}
.story-card.layout-vertical .story-card-img-wrap{width:100%;aspect-ratio:var(--img-aspect,16/9);}
.story-card.layout-horizontal{flex-direction:row;align-items:stretch;}
.story-card.layout-horizontal .story-card-img-wrap{width:38%;aspect-ratio:var(--img-aspect,16/9);}

.nav-links .nav-item.has-mega{position:static;}
.nav-links .mega-panel{left:auto;right:0;max-width:min(92vw,var(--max-w));overflow-x:auto;}
.sub-nav-bar{position:relative;}
.sub-nav-inner .sub-mega-item{position:static;}
.sub-nav-inner .sub-mega-panel{left:50%;transform:translateX(-50%);max-width:min(92vw,var(--max-w));overflow-x:auto;top:100%;}

.pb-picture-text{display:flex;gap:40px;align-items:center;background:var(--card-bg);border:var(--bw,1px) solid var(--border);border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,0.03);padding:28px;}
.pb-picture-text.layout-left{flex-direction:row;}
.pb-picture-text.layout-right{flex-direction:row-reverse;}
.pb-picture-text.layout-top{flex-direction:column;}
.pb-picture-text.layout-bottom{flex-direction:column-reverse;}
.pb-picture-text-img{flex:0 0 45%;min-width:0;}
.pb-picture-text.layout-top .pb-picture-text-img,.pb-picture-text.layout-bottom .pb-picture-text-img{flex:none;width:100%;}
.pb-picture-text-img img{width:100%;border-radius:12px;display:block;}
.pb-picture-text-content{flex:1;min-width:0;}
.pb-picture-text-content h2{font-size:24px;margin:0 0 12px;}
.pb-picture-text-content p{color:var(--dark-grey);font-size:15px;line-height:1.8;}

@media(max-width:768px){
  .pb-picture-text{flex-direction:column!important;gap:20px;}
  .pb-picture-text-img{flex:none;width:100%;}
  .nav-links .mega-panel{max-width:100%;overflow-x:visible;}
  .nav-item.open > .mega-panel,.nav-item.open > .dropdown-panel{max-width:100%;position:static!important;transform:none!important;}
  .mega-link{font-size:16px;padding:14px 8px;min-height:44px;align-items:center;}
  .mega-link-title{font-size:16px;}
  .mega-link-desc{font-size:13px;}
  .mega-col-title{font-size:15px;font-weight:700;color:var(--accent);margin-top:14px;padding-bottom:8px;}
  .dropdown-link{font-size:16px;padding:14px 8px;min-height:44px;}
  .sub-nav-link{font-size:14px;padding:12px 14px;}
  .story-grid{grid-template-columns:repeat(var(--mobile-cols,1),1fr);gap:12px;}
  .story-card.layout-horizontal{flex-direction:column;}
  .story-card.layout-horizontal .story-card-img-wrap{width:100%;}
}

@media (min-width: 769px) {
  .header-wrapper{position:relative;}
  header{position:relative;}
  .nav-links .nav-item.has-mega{position:static;}
  .nav-links .mega-panel{
    left:50%;transform:translateX(-50%);
    width:min(92vw,var(--max-w));
    max-width:min(92vw,var(--max-w));
    top:100%;margin-top:0;
    display:none;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
    gap:8px 24px;padding:24px 28px;overflow-x:visible;
  }
  .nav-links .nav-item.has-mega:hover .mega-panel,
  .nav-links .nav-item.has-mega:focus-within .mega-panel{display:grid;}
  .mega-col{min-width:0;border-right:none;padding:0;}
  .mega-col-title{border-bottom:2px solid var(--accent);padding-bottom:8px;margin-bottom:10px;font-weight:700;font-size:14px;color:var(--accent);text-transform:none;letter-spacing:0;}
  .mega-col .mega-link{padding:8px 4px;border-bottom:1px solid var(--border);border-radius:0;white-space:normal;}
  .mega-col .mega-link:last-child{border-bottom:none;}
  .sub-nav-bar{position:relative;}
  .sub-nav-inner .sub-mega-item{position:static;}
  .sub-nav-inner .sub-mega-panel{
    left:50%;transform:translateX(-50%);
    width:min(92vw,var(--max-w));max-width:min(92vw,var(--max-w));
    top:100%;margin-top:0;
    display:none;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
    gap:8px 24px;padding:24px 28px;overflow-x:visible;
  }
  .sub-nav-inner .nav-item.has-mega:hover .sub-mega-panel,
  .sub-nav-inner .nav-item.has-mega:focus-within .sub-mega-panel{display:grid;}
}

/* Sidebar Page Builder */
.sidebar .pb-section{padding:0;}
.sidebar .pb-block{background:var(--sidebar-bg);border-radius:12px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,0.02);}
.sidebar .pb-subtitle{text-align:left;margin-bottom:0;}
.sidebar .pb-subtitle h2{font-size:16px;margin:0 0 4px;}
.sidebar .pb-subtitle p{font-size:13px;}
.sidebar .pb-text{font-size:14px;}
.sidebar .pb-blog-cards h2{font-size:16px;text-align:left;margin:0 0 12px;}
.sidebar .pb-hero{min-height:auto;padding:24px 16px;}
.sidebar .pb-cta{padding:24px 16px;}
.sidebar .pb-cta h2{font-size:18px;}
.sidebar .grid{gap:12px;}

@media (min-width: 769px) {
  .sub-nav-inner{overflow-x:visible;overflow-y:visible;}
  .sub-nav-bar{overflow:visible;}
}

.mega-panel{box-sizing:border-box;}

.pb-hero{border-radius:16px;overflow:hidden;max-width:calc(var(--max-w) - 40px);margin:20px auto;box-shadow:0 4px 20px rgba(0,0,0,0.08);}
.pb-block:has(.pb-hero){padding-left:20px;padding-right:20px;}

.sidebar .pb-block{background:var(--sidebar-bg);border:var(--bw) solid var(--border);border-radius:12px;padding:18px;box-shadow:0 2px 10px rgba(0,0,0,0.03);margin-bottom:5px;}
.sidebar .pb-block:last-child{margin-bottom:0;}
.sidebar .pb-block .pb-section-inner{padding:0;}
.sidebar .pb-block.pb-section{padding:0 !important;}
.sidebar .pb-subtitle h2{font-size:16px;font-weight:700;margin:0 0 10px;padding-bottom:8px;border-bottom:2px solid var(--accent);}
.sidebar .pb-subtitle p{font-size:13px;color:var(--mid-grey);margin:4px 0 0;}
.sidebar .pb-text{font-size:14px;line-height:1.7;}
.sidebar .pb-blog-cards .grid{grid-template-columns:1fr!important;gap:12px;}
.sidebar .pb-photo img{border-radius:8px;}
.sidebar .pb-cta{padding:20px!important;border-radius:8px;}
.sidebar .pb-cta h2{font-size:17px!important;}

.pb-html-auto{height:auto;overflow:visible;}
.pb-html-wrap{overflow:auto;}
.pb-html-fixed{overflow:hidden;}

@media (min-width: 769px) {
  .nav-links .mega-panel,
  .sub-nav-inner .sub-mega-panel{
    display:grid !important;visibility:hidden;opacity:0;pointer-events:none;
    transition:opacity .12s ease .25s, visibility 0s linear .37s;
  }
  .nav-links .nav-item.has-mega:hover .mega-panel,
  .nav-links .nav-item.has-mega:focus-within .mega-panel,
  .sub-nav-inner .nav-item.has-mega:hover .sub-mega-panel,
  .sub-nav-inner .nav-item.has-mega:focus-within .sub-mega-panel{
    visibility:visible;opacity:1;pointer-events:auto;
    transition:opacity .12s ease, visibility 0s;
  }
  .dropdown-panel{
    display:flex !important;visibility:hidden;opacity:0;pointer-events:none;
    transition:opacity .12s ease .25s, visibility 0s linear .37s;
  }
  .nav-item.has-dropdown:hover .dropdown-panel,
  .nav-item.has-dropdown:focus-within .dropdown-panel{
    visibility:visible;opacity:1;pointer-events:auto;
    transition:opacity .12s ease, visibility 0s;
  }
}

.card-body{padding:12px 14px;}
.card.img-only .card-body,.card .card-body:empty{display:none;}
.pb-photo{line-height:0;}
.pb-photo .pb-section-inner{padding:0;}
.pb-photo figcaption{line-height:1.5;padding:8px 4px;}

.pb-section{padding:10px 0;}
@media (max-width:768px){
  .pb-section{padding:10px 0;}
  .card-body{padding:10px 12px;}
  .pb-hero{margin:12px auto;max-width:calc(100% - 20px);}
  .pb-cols{grid-template-columns:1fr !important;}
  .pb-gallery{grid-template-columns:repeat(2,1fr) !important;}
  .pb-pic-text{flex-direction:column !important;gap:20px;}
  .pb-pic-text .pb-pic-img{flex:none;width:100%;}
}

/* ── Quotation Widget ──────────────────────────────────── */
.qt-widget { font-size: 14px; }
.qt-desc { color: var(--mid-grey); margin-bottom: 16px; font-size: 14px; }
.qt-period-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.qt-period-btn { padding: 8px 18px; border: 1px solid var(--border); border-radius: 8px; background: var(--light-grey); cursor: pointer; font-size: 13px; font-weight: 600; transition: all 0.15s; }
.qt-period-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.qt-tab-content { display: none; } .qt-tab-content.active { display: block; }
.qt-matrix-scroll { overflow-x: auto; margin-bottom: 16px; }
.qt-price-table { border-collapse: collapse; min-width: 400px; width: 100%; }
.qt-price-table th, .qt-price-table td { border: 1px solid var(--border); padding: 8px 12px; font-size: 13px; text-align: center; }
.qt-price-table th { background: #e8f0fe; font-weight: 700; }
.qt-row-header { background: var(--light-grey); font-weight: 700; text-align: left; white-space: nowrap; }
.qt-col-label { text-align: left; color: var(--dark-grey); white-space: nowrap; }
.qt-price-cell.clickable { cursor: pointer; transition: background 0.15s; }
.qt-price-cell.clickable:hover { background: #dbeafe; }
.qt-price-cell.selected { background: var(--accent) !important; color: #fff; font-weight: 700; }
.qt-options-section { margin: 16px 0; display: flex; flex-direction: column; gap: 10px; }
.qt-option-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.qt-option-row > label { min-width: 100px; font-weight: 600; font-size: 13px; }
.qt-option-row .form-input { max-width: 220px; }
.qt-cb-label { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; }
.qt-cb-label input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--accent); }
.qt-discount-hints { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.qt-discount-badge { background: #fef9c3; border: 1px solid #fde047; border-radius: 6px; padding: 4px 10px; font-size: 12px; color: #854d0e; }
.qt-summary { background: var(--light-grey); border: 1px solid var(--border); border-radius: 12px; padding: 20px; margin-top: 20px; }
.qt-summary-inner { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.qt-summary-row { display: flex; justify-content: space-between; font-size: 14px; }
.qt-summary-total { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--border); padding-top: 12px; margin-top: 4px; font-weight: 700; font-size: 15px; }
.qt-wa-btn { background: #25d366; color: #fff; border-color: #25d366; width: 100%; justify-content: center; font-size: 15px; padding: 12px; }
.qt-wa-btn:hover { background: #1ebe5d; }
@media (max-width: 600px) {
    .qt-price-table th, .qt-price-table td { padding: 6px 8px; font-size: 12px; }
    .qt-option-row { flex-direction: column; align-items: flex-start; }
    .qt-option-row .form-input { max-width: 100%; }
}

.qt-widget{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;padding:24px;margin:0;}
.qt-desc{color:var(--mid-grey);font-size:14px;margin:0 0 16px;}
.qt-period-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;}
.qt-period-btn{padding:8px 18px;border:2px solid var(--border);border-radius:20px;background:transparent;cursor:pointer;font-size:14px;color:var(--text);transition:.15s;}
.qt-period-btn.active{border-color:var(--accent);background:var(--accent);color:#fff;}
.qt-tab-content{display:none;}
.qt-tab-content.active{display:block;}
.qt-qty-row{display:flex;align-items:center;gap:10px;margin-bottom:16px;font-size:14px;}
.qt-qty-sel{padding:6px 10px;border:1px solid var(--border);border-radius:6px;background:var(--input-bg);color:var(--input-text);}
.qt-matrix-scroll{overflow-x:auto;margin-bottom:16px;}
.qt-price-table{width:100%;border-collapse:collapse;font-size:13px;}
.qt-price-table th{background:var(--accent);color:#fff;padding:10px 14px;text-align:center;white-space:nowrap;}
.qt-price-table td{padding:9px 14px;border:1px solid var(--border);text-align:center;}
.qt-row-label{font-weight:600;background:var(--bg);text-align:left!important;white-space:nowrap;}
.qt-price-cell{cursor:pointer;transition:.15s;}
.qt-price-cell:hover{background:rgba(96,165,250,.12);color:var(--accent);}
.qt-price-cell.selected{background:var(--accent);color:#fff;font-weight:700;}
.qt-addons{margin:16px 0;padding:16px;background:var(--bg);border-radius:8px;}
.qt-addons-title{font-size:13px;font-weight:600;color:var(--mid-grey);margin-bottom:10px;}
.qt-addon-row{margin-bottom:8px;font-size:14px;display:flex;align-items:center;gap:8px;}
.qt-addon-sel{padding:5px 8px;border:1px solid var(--border);border-radius:6px;background:var(--input-bg);color:var(--input-text);font-size:13px;}
.qt-total-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-top:2px solid var(--border);margin-top:16px;}
.qt-total-label{font-size:15px;font-weight:600;}
.qt-total-price{font-size:24px;font-weight:700;color:var(--accent);}
.qt-wa-btn{margin-top:12px;background:#25D366;color:#fff;border:none;padding:12px 28px;border-radius:8px;font-size:15px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;}
.qt-wa-btn:hover{background:#1ebe5d;}

/* ── 無邊框多欄圖文元件 (image_cols) ───────────────────────── */
.pb-image-cols {
  width: 100%;
  margin: 0px 0 20px 0 !important;
  padding: 0 !important;
}
.pb-image-cols-grid {
  width: 100%;
  margin: 0 auto;
}
.pb-image-col-item {
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.1);
}
.pb-image-col-item img {
  border-radius: 12px !important;
  transition: transform 0.25s ease;
}
.pb-image-col-item a:hover img {
  transform: scale(1.02);
}

@media (max-width: 768px) {
  .pb-image-cols-grid {
    grid-template-columns: repeat(var(--mcols, 1), 1fr) !important;
  }
}

/* Header 排版修復 */
header {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  justify-content: flex-start !important;
  gap: 0;
}
.site-branding {
  margin-right: auto !important;
  flex-shrink: 0;
}
.header-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  text-align: right;
  margin-right: 20px;
}

@media (min-width: 769px) {
  .nav-links .mega-panel .mega-link,
  .sub-nav-inner .sub-mega-panel .mega-link { 
    border-bottom: none !important; 
  }
}

@media (max-width: 768px) {
  header {
    justify-content: space-between !important;
  }
  .site-branding {
    max-width: 45%;
    margin-right: 0 !important;
  }
  .header-right {
    margin-right: 0;
    padding-right: 12px;
    flex: 1 1 auto;
    min-width: 0;
  }
  .header-right-text {
    font-size: 8px;
    line-height: 1.3;
  }
  .hamburger {
    flex: 0 0 auto;
    margin-left: auto !important;
  }

  .nav-links {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-height: calc(100vh - 72px); 
    overflow-y: auto !important;
    background: rgba(15, 35, 70, 0.96) !important;
    backdrop-filter: blur(8px);
    padding: 0 !important;
    z-index: 999;
  }
  .nav-links > a, .nav-links > .nav-item > a {
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
    font-size: 15px !important;
    padding: 12px 16px !important; 
  }
  .nav-links > a.active, .nav-links > .nav-item > a.active,
  .nav-links > a:hover, .nav-links > .nav-item > a:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
  }
  .nav-links .nav-item.open > .mega-panel,
  .nav-links .nav-item.open > .dropdown-panel {
    position: static !important;
    max-width: 100%;
    transform: none !important;
    box-shadow: none;
    border: none;
    background: transparent !important;
    padding: 0 16px 4px 16px !important; 
  }
  .nav-links::after {
    content: "— 已經到底啦 —";
    display: block;
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5) !important;
    padding: 15px 0 90px 0 !important; 
  }

  .sub-nav-inner .nav-item.open > .mega-panel,
  .sub-nav-inner .nav-item.open > .sub-mega-panel,
  .sub-nav-inner .nav-item.open > .dropdown-panel {
    display: block !important; 
    position: fixed !important;
    top: 115px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 99999 !important;
    max-height: calc(100vh - 120px);
    overflow-y: auto !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    background: rgba(15, 35, 70, 0.96) !important; 
    backdrop-filter: blur(8px);
    padding: 10px 16px 0 16px !important;
  }
  .sub-nav-inner .nav-item.open > .mega-panel::after,
  .sub-nav-inner .nav-item.open > .sub-mega-panel::after,
  .sub-nav-inner .nav-item.open > .dropdown-panel::after {
    content: "— 已經到底啦 —";
    display: block;
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5) !important;
    padding: 20px 0 90px 0 !important; 
  }

  .mega-col-title {
    color: #fbbf24 !important; 
    font-size: 14px !important;
    font-weight: bold !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important;
    margin-top: 10px !important; 
    padding-bottom: 4px !important;
  }
  .mega-link {
    color: #ffffff !important;
    font-size: 14px !important;
    padding: 8px 12px !important; 
    min-height: auto !important;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.15) !important;
    border-radius: 0 !important;
  }
  .mega-link:last-child { 
    border-bottom: none !important; 
  }
  .mega-link-title { 
    font-size: 14px !important; 
  }
  .mega-link-desc { 
    font-size: 11px !important; 
    color: rgba(255, 255, 255, 0.7) !important;
    margin-top: 2px !important;
  }
}

/* ── 連結清單元件 (link_list) ───────────────────────────── */
.pb-link-list-block {
  margin-bottom: 5px;
}
.pb-link-list-wrap {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.02);
}
.pb-link-list-main-title {
  margin: 0 0 10px 0;
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  padding-bottom: 6px;
  border-bottom: 2px solid var(--accent);
}
.pb-link-list-ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 2px; /* 🌟 讓連結之間更緊湊 Pack 啲 */
}
.pb-link-list-wrap.grid-2 .pb-link-list-ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px 10px;
}
.pb-link-list-wrap.grid-3 .pb-link-list-ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px 10px;
}
.pb-link-list-header {
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  padding: 8px 0 4px 0;
  margin-top: 6px;
  grid-column: 1 / -1;
}
.pb-link-list-ul > .pb-link-list-header:first-child {
  margin-top: 0;
  padding-top: 0;
}

/* 🌟 1. 移除分隔線 */
.pb-link-list-item {
  border-bottom: none !important;
}

/* 🌟 2. 緊湊 Padding + 加底線 */
.pb-link-list-item a {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 4px; /* 🌟 上下 padding 縮細，間距更緊湊 */
  border-radius: 4px;
  color: var(--text);
  text-decoration: underline; /* 🌟 加入底線清晰知道係 Link */
  text-decoration-color: var(--border); /* 底線用淡灰色，唔會太刺眼 */
  text-underline-offset: 3px;
  font-size: 14px;
  background: transparent;
  transition: all 0.15s ease;
}

.pb-link-list-item a:hover {
  background: rgba(0, 0, 0, 0.03);
  color: var(--accent);
  text-decoration-color: var(--accent); /* Hover 時底線變主題色 */
}

.pb-link-icon {
  font-size: 15px;
  text-decoration: none !important; /* 圖示不加底線 */
  display: inline-block;
}

.pb-link-arrow {
  margin-left: auto;
  color: var(--mid-grey);
  font-weight: bold;
  font-size: 12px;
  text-decoration: none !important; /* 箭頭不加底線 */
  display: inline-block;
  transition: transform 0.15s;
}

.pb-link-list-item a:hover .pb-link-arrow {
  transform: translateX(2px);
  color: var(--accent);
}

@media (max-width: 768px) {
  .pb-link-list-wrap.grid-2 .pb-link-list-ul,
  .pb-link-list-wrap.grid-3 .pb-link-list-ul {
    grid-template-columns: 1fr !important;
  }
}

/* ── Hero Carousel 動態輪播圖元件 ───────────────────────── */
.pb-hero-carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 16px;
  margin-bottom: 10px !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}
.pb-carousel-slides {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-areas: "slide";
}
.pb-carousel-slide {
  grid-area: slide;
  position: relative;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease-in-out, visibility 0.6s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.pb-carousel-slide.active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

.pb-carousel-slide .pb-carousel-img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
.pb-carousel-slide:not(:first-child) .pb-carousel-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.pb-carousel-img-placeholder {
  width: 100%;
  height: 100%;
}

.pb-carousel-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.pb-carousel-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #ffffff;
  text-align: center;
  width: 85%;
  max-width: 700px;
  z-index: 3;
}
.pb-carousel-content h1 {
  font-size: clamp(20px, 4vw, 42px);
  margin: 0 0 8px 0;
  font-weight: 800;
  text-shadow: 0 2px 4px rgba(0,0,0,0.4);
}
.pb-carousel-content p {
  font-size: clamp(12px, 2vw, 18px);
  margin: 0;
  opacity: 0.95;
  text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

.pb-carousel-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.3);
  color: #ffffff;
  border: none;
  font-size: 18px;
  padding: 10px 14px;
  cursor: pointer;
  border-radius: 50%;
  z-index: 10;
  transition: background 0.2s;
}
.pb-carousel-arrow:hover {
  background: rgba(0,0,0,0.7);
}
.pb-carousel-arrow.prev { left: 16px; }
.pb-carousel-arrow.next { right: 16px; }

.pb-carousel-dots {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 10;
}
.pb-carousel-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
  cursor: pointer;
  transition: all 0.3s;
}
.pb-carousel-dot.active, .pb-carousel-dot:hover {
  background: #ffffff;
  width: 24px;
  border-radius: 10px;
}

/* ── Hero / Hero Carousel 全區點擊連結樣式 ────────────────── */
a.pb-hero-full-link,
a.pb-carousel-full-link {
  display: block;
  text-decoration: none;
  color: inherit;
  width: 100%;
  height: 100%;
}

.pb-hero.is-clickable {
  cursor: pointer;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.pb-hero.is-clickable:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}

.pb-carousel-full-link {
  position: relative;
  overflow: hidden;
}
.pb-carousel-full-link .pb-carousel-img {
  transition: transform 0.4s ease;
}
.pb-carousel-full-link:hover .pb-carousel-img {
  transform: scale(1.02);
}

/* 確保全區點擊時，輪播圖箭頭同小圓點依然可以正常切換 */
.pb-carousel-arrow,
.pb-carousel-dots {
  z-index: 20 !important;
}

/* ── 標題區 (subtitle) 副文字黑色 + 多行 HTML 支援 ──────── */
.pb-subtitle p,
.pb-subtitle .pb-subtitle-desc {
  color: var(--text, #000000) !important; /* 🌟 改為黑色 */
  font-size: 15px;
  line-height: 1.6;
  margin: 0;
}
.pb-subtitle .pb-subtitle-desc p {
  color: var(--text, #000000) !important;
  margin: 0 0 8px 0;
}
.pb-subtitle .pb-subtitle-desc p:last-child {
  margin-bottom: 0;
}
.pb-subtitle .pb-subtitle-desc ul,
.pb-subtitle .pb-subtitle-desc ol {
  padding-left: 20px;
  margin: 8px 0;
  text-align: left;
}