/* 2026 街區串聯空間頁
   來源：satellite/space_template2026.php（2026-10-05 由內嵌搬出，第一階段只搬家、規則未改） */

/* 頁首：展區名＋空間名 */
/* 共用 .h26-top，以下為英文空間名 */
.s26-top h1 small { display: block; margin-top: .8rem; font-size: 2.2rem; font-weight: 400; letter-spacing: .02em; color: rgba(255,255,255,.75); }

/* 區1 空間介紹：照片＋文字 */
.s26-intro { display: grid; grid-template-columns: 5fr 7fr; gap: 6.4rem; align-items: start; }
.s26-photos { margin: 0; }
.s26-photos .main { display: block; width: 100%; height: auto; max-width: none; }
.s26-thumbs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; margin-top: .8rem; }
.s26-thumbs button { display: block; padding: 0; border: 2px solid transparent; background: none; cursor: pointer; aspect-ratio: 1 / 1; overflow: hidden; }
.s26-thumbs button img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; opacity: .6; transition: opacity .2s; }
.h26 .s26-thumbs button:hover, .h26 .s26-thumbs button:focus { background: none !important; }
.s26-thumbs button:hover img, .s26-thumbs button[aria-current="true"] img { opacity: 1; }
.s26-thumbs button[aria-current="true"] { border-color: var(--accent, #ffff1e); }
.s26-thumbs button:focus-visible { outline: 2px solid var(--accent, #ffff1e); outline-offset: 2px; }
.s26-noph { display: grid; place-items: center; aspect-ratio: 4 / 3; background: #161616; font-size: 6rem; color: rgba(255,255,255,.12); }
.s26-text p { margin: 0 0 2rem; font-size: 1.6rem; line-height: 2.1; color: rgba(255,255,255,.9); text-align: justify; }
.s26-text .en { margin-top: 3.2rem; padding-top: 3.2rem; border-top: 1px solid rgba(255,255,255,.14); }
.s26-text .en p { font-size: 1.45rem; line-height: 1.9; color: rgba(255,255,255,.6); hyphens: auto; }
.s26-text .none { color: rgba(255,255,255,.55); }
.s26-meta { display: grid; grid-template-columns: 8rem 1fr; gap: .8rem 1.6rem; margin: 3.2rem 0 0; padding-top: 2.4rem; border-top: 3px solid var(--accent, #ffff1e); font-size: 1.5rem; line-height: 1.7; }
.s26-meta dt { color: rgba(255,255,255,.55); font-weight: 400; }
.s26-meta dd { margin: 0; color: #fff; }
.s26-meta a { color: #fff; border-bottom: 1px solid currentColor; text-decoration: none; }
.s26-meta a:hover, .s26-meta a:focus-visible { color: var(--accent, #ffff1e); }

/* 區2 當期展覽 */
.s26-ex { display: grid; grid-template-columns: 7fr 5fr; gap: 6.4rem; align-items: start; }
.s26-ex .tt { margin: 0; font-size: 2.8rem; font-weight: 700; line-height: 1.4; color: #fff; }
.s26-ex .tt small { display: block; margin-top: .6rem; font-size: 1.7rem; font-weight: 400; color: rgba(255,255,255,.75); }
.s26-ex .ar { margin: 1.6rem 0 3.2rem; font-size: 1.5rem; line-height: 1.8; color: var(--accent, #ffff1e); }
/* 同一空間第二檔起的展覽（2026-10-06 新浜碼頭）：上方分隔線 */
.s26-exm { margin-top: 4.8rem; padding-top: 4.8rem; border-top: 1px solid rgba(255,255,255,.14); }
.s26-exm > :last-child { margin-bottom: 0; }
/* 展覽照：第一張在文字右側，第二張起排到下方（與參展者過去作品相同：3 欄、照原比例不裁切）；全部點擊開燈箱、同一組可左右切換 */
.s26-gal a { display: block; border-radius: .3rem; overflow: hidden; background: #161616; }
.s26-gal img { display: block; width: 100%; height: auto; max-width: none; transition: opacity .5s; }
.s26-gal a:hover img, .s26-gal a:focus-visible img { opacity: .8; }
.s26-gal a:focus-visible { outline: 2px solid var(--accent, #ffff1e); outline-offset: 4px; }
/* 第二張起：base.css 的 .h26-gal */

/* 上一個／下一個 */
.s26-pager { display: grid; grid-template-columns: 1fr auto 1fr; gap: 2.4rem; align-items: center; }
.s26-pager a { color: #fff; text-decoration: none; font-size: 1.5rem; line-height: 1.6; }
.s26-pager a:hover, .s26-pager a:focus-visible { color: var(--accent, #ffff1e); }
.s26-pager small { display: block; font-size: 1.2rem; letter-spacing: .16em; color: rgba(255,255,255,.5); }
.s26-pager .next { text-align: right; }
.h26 .s26-pager .back { padding: 1.2rem 2.8rem; background: var(--accent, #ffff1e); color: #000; font-weight: 700; letter-spacing: .1em; }
.h26 .s26-pager .back:hover, .h26 .s26-pager .back:focus-visible { background: #fff; color: #000; }

@media (max-width: 991px) {
	.s26-intro, .s26-ex { grid-template-columns: 1fr; gap: 4rem; }
}
@media (max-width: 767px) {
	.s26-top h1 small { font-size: 1.6rem; }
	.s26-ex .tt { font-size: 2.2rem; }
	.s26-pager { grid-template-columns: 1fr 1fr; }
	.h26 .s26-pager .back { grid-column: 1 / -1; grid-row: 2; text-align: center; }
}
