/* 多頁網站共用骨架：導覽目前頁、商標連結、分頁統一頁首（麵包屑＋標題＋一句說明＋立體圖）、分頁區塊節奏 */

/* 商標整塊連回首頁，不要底線 */
.site-brand{text-decoration:none}

/* 導覽列：目前所在頁＝按下去的實心藍鈕 */

/* 分頁統一頁首 */
.page-hero{padding-top:clamp(24px,2.2vw,48px)}
main>section.page-hero:first-child{padding-top:clamp(24px,2.2vw,48px);padding-bottom:0}
.page-hero__card{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(20px,2vw,48px);
  min-height:clamp(200px,15vw,300px);
  padding:clamp(28px,2.6vw,56px) clamp(28px,3vw,64px);
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  background:radial-gradient(ellipse at 100% 100%,rgba(79,192,240,.20),transparent 55%),linear-gradient(120deg,var(--white),var(--tint));
  box-shadow:var(--depth-2);
  overflow:hidden;
}
.page-hero__card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:6px;
  background:linear-gradient(90deg,var(--brand),var(--sky));
}
.page-hero__copy{display:flex;flex-direction:column;gap:14px;min-width:0}
.page-hero h1{margin:0;font-size:clamp(30px,2.4vw,56px);font-weight:800;line-height:1.25;letter-spacing:.02em;color:var(--ink)}
.page-hero__lead{margin:0;max-width:60ch;color:var(--ink-2);font-size:clamp(17px,.95vw,21px)}
.page-hero__art{display:flex;align-items:center;justify-content:center}
.page-hero__art img{width:clamp(150px,13vw,300px);height:auto;mix-blend-mode:multiply}

/* 麵包屑 */
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:0;list-style:none;color:var(--ink-3);font-size:16px}
.breadcrumb li{display:inline-flex;align-items:center;gap:8px}
.breadcrumb li+li::before{content:"›";color:var(--ink-3)}
.breadcrumb a{color:var(--brand-d);font-weight:700;text-decoration:none}
.breadcrumb a:not(.btn):hover{text-decoration:underline}
.breadcrumb a.btn,.breadcrumb a.btn:hover{text-decoration:none}
.breadcrumb [aria-current="page"]{color:var(--ink-2)}

/* 分頁內的區塊節奏：比首頁緊一點 */
.page-section{scroll-margin-top:120px}

/* 超寬螢幕：頁首卡不要太高、右側立體圖放大，避免中間一大片空 */
@media(min-width:1921px){
  .page-hero__card{min-height:240px}
  .page-hero__art img{width:clamp(240px,12vw,300px)}
}
@media(max-width:900px){
  .page-hero__card{grid-template-columns:minmax(0,1fr)}
  .page-hero__art{justify-content:flex-start}
  .page-hero__art img{width:140px}
}
@media(max-width:600px){
  .page-hero__card{min-height:0;padding:24px 20px}
  .page-hero__art{display:none}
}