/*
Theme Name: 創業開公司 Start Company
Template: twentytwentyfive
Description: 會計師、記帳士與商務中心的數位轉型夥伴。Twenty Twenty-Five 子主題，來源在 build/，由 deploy.sh 部署。
Version: 1.0.0
Text Domain: startcompany
*/

/* ====================================================================
   Tokens
   ==================================================================== */
:root {
	--sc-navy: #042359;
	--sc-navy-deep: #021634;
	--sc-teal: #6CDAC1;
	--sc-teal-deep: #0B7263;
	--sc-teal-soft: #E4F6F1;
	--sc-ink: #16223A;
	--sc-muted: #56637A;
	--sc-line: #DCE3EC;
	--sc-paper: #F3F6F9;
	--sc-white: #FFFFFF;
	--sc-warn: #8A4A0B;
	--sc-warn-soft: #FBEFDF;
	--sc-latin: Montserrat, "Helvetica Neue", Arial, "PingFang TC", "Microsoft JhengHei", sans-serif;
	--sc-body: var(--wp--preset--font-family--sans);
	--sc-head: var(--wp--preset--font-family--heading);
	--sc-radius: 6px;
	--sc-gutter: clamp(1.1rem, 4vw, 2rem);
	--sc-sec-pad: clamp(3.2rem, 7vw, 5.5rem);
}

/* ====================================================================
   Base
   ==================================================================== */
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2, h3 { text-wrap: balance; }
p, li { text-wrap: pretty; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-block-column { box-sizing: border-box; }
:where(a):focus-visible, .wp-element-button:focus-visible, button:focus-visible {
	outline: 2px solid var(--sc-teal); outline-offset: 3px; border-radius: 2px;
}
main { overflow-x: clip; }
img { max-width: 100%; height: auto; }

/* 標題類元素：Noto Sans TC 700 子集（functions.php 的 sc_font_text() 會收集這些元素用到的字） */
.sc-logo-zh, .sc-card-t, .sc-offer-t, .sc-case-t, .sc-fact b, .sc-steps b, .sc-member b, .sc-founder h3,
.sc-post-cta-title, .sc-faq summary, .sc-cta h2 { font-family: var(--sc-head); }

/* 內文連結 */
.entry-content a:not(.wp-element-button):not(.sc-btn):not(.sc-card),
.sc-prose a:not(.wp-element-button) {
	text-decoration-thickness: 1px; text-underline-offset: .2em;
}

/* ====================================================================
   Header
   ==================================================================== */
.sc-header-wrap { position: sticky; top: 0; z-index: 50; }
.admin-bar .sc-header-wrap { top: 32px; }
@media (max-width: 782px) { .admin-bar .sc-header-wrap { top: 46px; } }
.sc-header {
	background: var(--sc-white);
	border-bottom: 1px solid var(--sc-line);
	padding-inline: var(--sc-gutter) !important;
	transition: box-shadow .2s ease;
}
.sc-header.is-scrolled { box-shadow: 0 6px 18px -12px rgba(4, 35, 89, .35); }
.sc-header-inner { min-height: 68px; gap: 1rem; }

.sc-logo { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--sc-navy); flex-shrink: 0; }
.sc-logo img { width: 40px; height: 40px; display: block; }
.sc-logo-text { display: grid; line-height: 1.1; }
.sc-logo-zh { font-weight: 700; font-size: 1.2rem; letter-spacing: .08em; color: var(--sc-navy); }
.sc-logo-en { font-family: var(--sc-latin); font-weight: 600; font-size: .62rem; letter-spacing: .2em; color: var(--sc-teal-deep); margin-top: 3px; }

.sc-nav .wp-block-navigation__container { gap: .15rem 1.3rem; }
.sc-nav .wp-block-navigation-item__content { color: var(--sc-ink); padding-block: .3rem; }
.sc-nav .wp-block-navigation-item__content:hover { color: var(--sc-teal-deep); }
.sc-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--sc-teal-deep); box-shadow: inset 0 -2px 0 var(--sc-teal); }
.sc-nav .sc-nav-cta > .wp-block-navigation-item__content {
	background: var(--sc-navy); color: var(--sc-white); padding: .5rem 1rem; border-radius: 4px; font-weight: 700;
}
.sc-nav .sc-nav-cta > .wp-block-navigation-item__content:hover { background: var(--sc-teal-deep); color: var(--sc-white); }

/* 選單在 1100px 以下就收合（核心預設 600px，七個項目中寬度會擠成兩行） */
@media (max-width: 1100px) {
	.sc-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.sc-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
.sc-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--sc-white); padding: clamp(1rem, 4vh, 2rem) var(--sc-gutter);
}
.sc-nav .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: clamp(2.5rem, 7vh, 4rem); }
.sc-nav .is-menu-open .wp-block-navigation__container { gap: clamp(.35rem, 1.6vh, .8rem); align-items: flex-start; }
.sc-nav .is-menu-open .wp-block-navigation-item { align-items: flex-start; }
.sc-nav .is-menu-open .wp-block-navigation-item__content { font-size: 1.2rem; }
.sc-nav .is-menu-open .sc-nav-cta { margin-top: .6rem; }
.sc-nav .wp-block-navigation__responsive-container-open svg,
.sc-nav .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }

/* ====================================================================
   Sections
   ==================================================================== */
.sc-sec { padding-block: var(--sc-sec-pad) !important; padding-inline: var(--sc-gutter) !important; }
.sc-sec.is-style-band, .is-style-band { background: var(--sc-paper); }
.sc-sec.is-style-dark, .is-style-dark { background: var(--sc-navy); color: #D9E3F2; }
.is-style-dark :where(h1, h2, h3, h4) { color: var(--sc-white); }
.is-style-dark a:not(.wp-element-button):not(.sc-btn) { color: var(--sc-teal); }
.sc-sec + .sc-sec:not(.is-style-band):not(.is-style-dark) { border-top: 1px solid var(--sc-line); }
.is-style-band + .is-style-band { border-top: 1px solid var(--sc-line); }

/* 小標：Montserrat 字距，對應 logo 的 START COMPANY */
.is-style-eyebrow {
	font-family: var(--sc-latin); font-size: .78rem !important; font-weight: 600;
	letter-spacing: .18em; text-transform: uppercase; color: var(--sc-teal-deep);
	margin-bottom: -.4rem !important;
}
.is-style-dark .is-style-eyebrow { color: var(--sc-teal); }

/* 三線標題：取自 logo 的三道弧線 */
.is-style-stripes { position: relative; padding-bottom: 1.05rem; }
.is-style-stripes::after {
	content: ""; position: absolute; left: 0; bottom: 0; width: 64px; height: 10px;
	background:
		linear-gradient(var(--sc-teal), var(--sc-teal)) 0 0 / 64px 2px no-repeat,
		linear-gradient(var(--sc-teal), var(--sc-teal)) 0 4px / 48px 2px no-repeat,
		linear-gradient(var(--sc-teal), var(--sc-teal)) 0 8px / 32px 2px no-repeat;
}
.has-text-align-center.is-style-stripes::after { left: 50%; transform: translateX(-50%); background-position: 0 0, 8px 4px, 16px 8px; }

.sc-lede { font-size: clamp(1.05rem, 1.6vw, 1.2rem); line-height: 1.8; }
.sc-muted { color: var(--sc-muted); }
.is-style-dark .sc-muted { color: #A9B8CF; }
.sc-small { font-size: .9rem; }

/* ====================================================================
   Buttons
   ==================================================================== */
.wp-element-button, .sc-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .4em;
	padding: .8rem 1.4rem; border-radius: 4px; font-weight: 700; line-height: 1.3; text-decoration: none;
	background: var(--sc-navy); color: var(--sc-white); border: 2px solid var(--sc-navy);
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.wp-element-button:hover, .sc-btn:hover { background: var(--sc-teal-deep); border-color: var(--sc-teal-deep); color: var(--sc-white); }
.is-style-outline > .wp-element-button { background: transparent; color: var(--sc-navy); border-color: var(--sc-navy); }
.is-style-outline > .wp-element-button:hover { background: var(--sc-navy); color: var(--sc-white); }
.is-style-dark .wp-element-button { background: var(--sc-teal); color: var(--sc-navy); border-color: var(--sc-teal); }
.is-style-dark .wp-element-button:hover { background: var(--sc-white); border-color: var(--sc-white); color: var(--sc-navy); }
.is-style-dark .is-style-outline > .wp-element-button { background: transparent; color: var(--sc-white); border-color: rgba(255, 255, 255, .55); }
.is-style-dark .is-style-outline > .wp-element-button:hover { background: var(--sc-white); color: var(--sc-navy); border-color: var(--sc-white); }
.sc-link { font-weight: 700; color: var(--sc-teal-deep); text-decoration: none; }
.sc-link:hover { text-decoration: underline; text-underline-offset: .2em; }
.wp-block-buttons { gap: .8rem 1rem; }
/* 寫在 wp:html 裡的按鈕列沒有核心的 is-layout-flex，自己排 */
.wp-block-buttons:not(.is-layout-flex) { display: flex; flex-wrap: wrap; align-items: center; }

/* ====================================================================
   Hero（首頁與各著陸頁）
   ==================================================================== */
.sc-hero { padding-block: clamp(3rem, 7vw, 5.5rem) clamp(3rem, 6vw, 4.5rem) !important; position: relative; }
.sc-hero::before {
	/* 右上角淡淡的三道弧線，取自 logo */
	content: ""; position: absolute; top: -120px; right: -120px; width: 420px; height: 420px; pointer-events: none;
	border-radius: 50%;
	box-shadow: 0 0 0 2px rgba(108, 218, 193, .10), 0 0 0 26px rgba(4, 35, 89, 0), 0 0 0 28px rgba(108, 218, 193, .08), 0 0 0 54px rgba(4, 35, 89, 0), 0 0 0 56px rgba(108, 218, 193, .06);
}
.sc-hero h1 { font-size: clamp(1.9rem, 4.4vw, 3rem); line-height: 1.3; letter-spacing: .02em; margin-top: .6rem; }
.sc-hero .sc-lede { color: #D3DEEE; max-width: 36em; }
.sc-hero-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.sc-hero-grid > * { min-width: 0; }
@media (max-width: 900px) { .sc-hero-grid { grid-template-columns: 1fr; } }
.sc-hero-text { display: grid; gap: 1.1rem; justify-items: start; }
.sc-hero-text .wp-block-buttons { margin-top: .6rem; }
.sc-hero-alt { font-size: .98rem; color: #C4D2E6; }
.sc-hero-alt a { color: var(--sc-teal); font-weight: 700; text-decoration: none; }
.sc-hero-alt a:hover { text-decoration: underline; }
.sc-hero-single { max-width: 820px; display: grid; gap: 1.1rem; justify-items: start; }

/* 轉介網示意圖 */
.sc-net svg { width: 100%; height: auto; display: block; max-width: 560px; margin-inline: auto; }
.sc-net .n-box { fill: rgba(255, 255, 255, .06); stroke: rgba(108, 218, 193, .45); stroke-width: 1.5; }
.sc-net .n-t { fill: #FFFFFF; font-size: 17px; font-weight: 700; font-family: var(--sc-body); }
.sc-net .n-s { fill: #A9B8CF; font-size: 13px; font-family: var(--sc-body); }
.sc-net .hub { fill: var(--sc-teal); }
.sc-net .hub-t { fill: var(--sc-navy); font-size: 17px; font-weight: 700; font-family: var(--sc-body); }
.sc-net .hub-s { fill: var(--sc-navy); font-size: 12.5px; font-family: var(--sc-body); font-weight: 500; letter-spacing: .08em; }
.sc-net .edge { stroke: #7F93B3; stroke-width: 1.5; fill: none; }
.sc-net .spoke { stroke: var(--sc-teal); stroke-width: 2; stroke-dasharray: 5 5; fill: none; }
.sc-net .e-l { fill: #E3EAF5; font-size: 13.5px; font-family: var(--sc-body); }
.sc-net .ah { fill: #7F93B3; }
.sc-net-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem 1.2rem; font-size: .82rem; color: #A9B8CF; margin-top: .6rem; }
.sc-net-legend span { display: inline-flex; align-items: center; gap: .45rem; }
.sc-net-legend i { width: 24px; border-top: 2px solid #7F93B3; }
.sc-net-legend i.d { border-top: 2px dashed var(--sc-teal); }

/* ====================================================================
   照片與紋路
   圖片：Unsplash（免費授權、可商用、免標示），已下載到主題 assets/img/，不外連。
   案例縮圖：實際案子的網站截圖。紋路：CSS 畫的，沒有授權問題。
   ==================================================================== */

/* 深色區塊的細點紋路 */
.is-style-dark { background-image: radial-gradient(rgba(108, 218, 193, .14) 1px, transparent 1px); background-size: 24px 24px; background-position: 0 0; }

/* 淺色區塊的帳簿格線 */
.is-style-band {
	background-image:
		linear-gradient(rgba(4, 35, 89, .045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(4, 35, 89, .045) 1px, transparent 1px);
	background-size: 46px 46px;
}

/* 照片 hero：照片 + 深藍漸層遮罩（文字對比靠遮罩，不靠照片）
   選擇器要寫成 .sc-sec.sc-hero，否則會被 .sc-sec.is-style-dark 的 background 簡寫蓋掉（同樣是 0,2,0，靠順序取勝） */
.sc-sec.sc-hero {
	background-color: var(--sc-navy);
	background-image:
		linear-gradient(105deg, rgba(2, 17, 45, .95) 0%, rgba(4, 35, 89, .9) 45%, rgba(4, 35, 89, .68) 100%),
		var(--sc-hero-img, none);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
@media (max-width: 720px) {
	.sc-sec.sc-hero { background-image: linear-gradient(180deg, rgba(2, 17, 45, .95) 0%, rgba(4, 35, 89, .92) 55%, rgba(4, 35, 89, .8) 100%), var(--sc-hero-img, none); }
}
.sc-page-for-accounting-firms .sc-hero { --sc-hero-img: url(assets/img/meeting-room.jpg); }
.sc-page-for-business-centers .sc-hero { --sc-hero-img: url(assets/img/coworking.jpg); }
.sc-page-ai-automation .sc-hero { --sc-hero-img: url(assets/img/desks-top.jpg); }
.sc-page-company-registration .sc-hero { --sc-hero-img: url(assets/img/signing.jpg); }
.sc-page-registered-address-services .sc-hero { --sc-hero-img: url(assets/img/desk-city.jpg); }
.sc-page-accounting-bookkeeping-services .sc-hero { --sc-hero-img: url(assets/img/flatlay-desk.jpg); }
.sc-page-about-us .sc-hero { --sc-hero-img: url(assets/img/desk-coffee.jpg); }
.sc-page-cases .sc-hero { --sc-hero-img: url(assets/img/laptop-work.jpg); }
.sc-page-services .sc-hero { --sc-hero-img: url(assets/img/open-office.jpg); }
.sc-page-recommended-partners .sc-hero { --sc-hero-img: url(assets/img/desk-city.jpg); }
.sc-page-home .sc-hero { --sc-hero-img: url(assets/img/meeting-room.jpg); }
/* 手機換 900px 的小圖（桌機 1800px 的一半寬、約四分之一檔案大小） */
@media (max-width: 720px) {
	.sc-page-for-accounting-firms .sc-hero, .sc-page-home .sc-hero { --sc-hero-img: url(assets/img/meeting-room-m.jpg); }
	.sc-page-for-business-centers .sc-hero { --sc-hero-img: url(assets/img/coworking-m.jpg); }
	.sc-page-ai-automation .sc-hero { --sc-hero-img: url(assets/img/desks-top-m.jpg); }
	.sc-page-company-registration .sc-hero { --sc-hero-img: url(assets/img/signing-m.jpg); }
	.sc-page-registered-address-services .sc-hero, .sc-page-recommended-partners .sc-hero { --sc-hero-img: url(assets/img/desk-city-m.jpg); }
	.sc-page-accounting-bookkeeping-services .sc-hero { --sc-hero-img: url(assets/img/flatlay-desk-m.jpg); }
	.sc-page-about-us .sc-hero { --sc-hero-img: url(assets/img/desk-coffee-m.jpg); }
	.sc-page-cases .sc-hero { --sc-hero-img: url(assets/img/laptop-work-m.jpg); }
	.sc-page-services .sc-hero { --sc-hero-img: url(assets/img/open-office-m.jpg); }
}

/* 頁尾的 CTA 深色帶：照片 + 更重的遮罩 */
.sc-sec.is-style-dark.sc-cta-band {
	background-image:
		linear-gradient(90deg, rgba(2, 17, 45, .95) 0%, rgba(4, 35, 89, .86) 60%, rgba(4, 35, 89, .74) 100%),
		url(assets/img/open-office.jpg);
	background-size: cover;
	background-position: center 40%;
}
@media (max-width: 720px) {
	.sc-sec.is-style-dark.sc-cta-band {
		background-image: linear-gradient(90deg, rgba(2, 17, 45, .95) 0%, rgba(4, 35, 89, .86) 60%, rgba(4, 35, 89, .74) 100%), url(assets/img/open-office-m.jpg);
	}
}

/* 圖文並排：照片帶品牌線條的位移外框 */
.sc-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(1.8rem, 5vw, 3.5rem); align-items: center; }
@media (max-width: 860px) { .sc-split { grid-template-columns: 1fr; } }
.sc-split.is-reverse > figure { order: 2; }
@media (max-width: 860px) { .sc-split.is-reverse > figure { order: 0; } }
.sc-split figure { margin: 0; position: relative; }
.sc-split figure::after {
	content: ""; position: absolute; inset: auto -14px -14px auto; width: 62%; height: 58%;
	border-right: 2px solid var(--sc-teal); border-bottom: 2px solid var(--sc-teal);
	box-shadow: 8px 8px 0 -6px var(--sc-teal), 16px 16px 0 -12px var(--sc-teal);
	border-radius: 0 0 var(--sc-radius) 0; pointer-events: none;
}
.sc-split img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--sc-radius); display: block; background: var(--sc-paper); }
.sc-split figcaption { font-size: .82rem; color: var(--sc-muted); margin-top: .6rem; }
@media (max-width: 560px) { .sc-split figure::after { display: none; } }
.sc-split .sc-split-body { display: grid; gap: 1rem; align-content: center; }

/* 案例縮圖 */
.sc-case-shot { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top center; border: 1px solid var(--sc-line); border-radius: 4px; margin-bottom: .2rem; background: var(--sc-paper); }
.sc-case { padding-top: 1.1rem; }
.sc-feature figure { margin: 0 0 1rem; }
.sc-feature:has(figure) { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; }
@media (max-width: 820px) { .sc-feature:has(figure) { grid-template-columns: 1fr; } }
.sc-feature img.sc-case-shot { aspect-ratio: 16 / 10; }

/* hero 的三道弧線：極慢的位移，尊重 prefers-reduced-motion */
@media (prefers-reduced-motion: no-preference) {
	.sc-hero::before { animation: sc-drift 26s ease-in-out infinite alternate; }
	@keyframes sc-drift {
		from { transform: translate3d(0, 0, 0) scale(1); }
		to { transform: translate3d(-26px, 18px, 0) scale(1.04); }
	}
}

/* ====================================================================
   Cards：三條路
   ==================================================================== */
.sc-paths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
@media (max-width: 900px) { .sc-paths { grid-template-columns: 1fr; } }
.sc-card {
	display: grid; grid-template-rows: auto auto 1fr auto; gap: .55rem; align-content: start;
	padding: 1.5rem 1.5rem 1.3rem; background: var(--sc-white); border: 1px solid var(--sc-line); border-radius: var(--sc-radius);
	text-decoration: none; color: var(--sc-ink); transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.sc-card:hover { border-color: var(--sc-teal-deep); transform: translateY(-2px); box-shadow: 0 14px 28px -20px rgba(4, 35, 89, .45); }
.sc-card-k { font-family: var(--sc-latin); font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--sc-teal-deep); }
.sc-card-t { font-size: 1.25rem; font-weight: 700; color: var(--sc-navy); line-height: 1.4; }
.sc-card-d { color: var(--sc-muted); font-size: .97rem; line-height: 1.75; }
.sc-card-go { font-weight: 700; color: var(--sc-teal-deep); padding-top: .6rem; border-top: 1px dashed var(--sc-line); }

/* ====================================================================
   事實三欄、痛點清單
   ==================================================================== */
.sc-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.2rem, 3vw, 2.4rem); }
@media (max-width: 820px) { .sc-facts { grid-template-columns: 1fr; } }
.sc-fact { display: grid; gap: .4rem; align-content: start; padding-top: 1rem; border-top: 2px solid var(--sc-navy); }
.sc-fact b { font-size: 1.08rem; color: var(--sc-navy); line-height: 1.5; }
.sc-fact span { color: var(--sc-muted); font-size: .96rem; }

.sc-pains { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 2rem; }
@media (max-width: 720px) { .sc-pains { grid-template-columns: 1fr; } }
.sc-pains li { position: relative; padding: .9rem 1rem .9rem 2.9rem; background: var(--sc-white); border: 1px solid var(--sc-line); border-radius: var(--sc-radius); line-height: 1.65; }
.sc-pains li::before {
	content: ""; position: absolute; left: 1rem; top: 1.15rem; width: 16px; height: 16px; border-radius: 3px;
	border: 2px solid var(--sc-muted); opacity: .7;
}

/* ====================================================================
   服務清單（帶狀態標籤）
   ==================================================================== */
.sc-offers { display: grid; gap: 0; border-top: 1px solid var(--sc-line); }
.sc-offer { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: .4rem 2rem; padding-block: 1.3rem; border-bottom: 1px solid var(--sc-line); }
@media (max-width: 720px) { .sc-offer { grid-template-columns: 1fr; } }
.sc-offer-h { display: grid; gap: .3rem; align-content: start; }
.sc-offer-tier { font-family: var(--sc-latin); font-size: .7rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--sc-muted); }
.sc-offer-t { font-size: 1.15rem; font-weight: 700; color: var(--sc-navy); line-height: 1.45; }
.sc-offer-d { color: var(--sc-ink); line-height: 1.8; }
.sc-offer-d p + p { margin-top: .5rem; }
.sc-pill {
	display: inline-block; justify-self: start; font-size: .74rem; font-weight: 700; line-height: 1.5;
	padding: .1rem .6rem; border-radius: 999px; background: var(--sc-warn-soft); color: var(--sc-warn); white-space: nowrap;
}
.sc-pill.is-ok { background: var(--sc-teal-soft); color: var(--sc-teal-deep); }

/* ====================================================================
   步驟（真的有先後順序才用）
   ==================================================================== */
.sc-steps { list-style: none; margin: 0; padding: 0; counter-reset: s; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; }
@media (max-width: 900px) { .sc-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .sc-steps { grid-template-columns: 1fr; } }
.sc-steps li { counter-increment: s; display: grid; gap: .35rem; align-content: start; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, .22); }
.sc-steps li::before {
	content: counter(s, decimal-leading-zero); font-family: var(--sc-latin); font-weight: 700; font-size: .95rem;
	color: var(--sc-teal); letter-spacing: .06em;
}
.sc-steps b { color: var(--sc-white); font-size: 1.08rem; }
.sc-steps span { color: #B8C6DB; font-size: .95rem; line-height: 1.7; }
.sc-sec:not(.is-style-dark) .sc-steps li { border-top-color: var(--sc-line); }
.sc-sec:not(.is-style-dark) .sc-steps li::before { color: var(--sc-teal-deep); }
.sc-sec:not(.is-style-dark) .sc-steps b { color: var(--sc-navy); }
.sc-sec:not(.is-style-dark) .sc-steps span { color: var(--sc-muted); }

/* ====================================================================
   申報行事曆（給事務所頁：避開忙碌期）
   ==================================================================== */
.sc-cal { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px; }
@media (max-width: 720px) { .sc-cal { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.sc-cal div {
	display: grid; gap: .2rem; align-content: start; padding: .6rem .45rem .7rem; border-radius: 4px;
	background: var(--sc-white); border: 1px solid var(--sc-line); min-height: 5.4rem;
}
.sc-cal b { font-family: var(--sc-latin); font-size: .95rem; color: var(--sc-navy); }
.sc-cal span { font-size: .74rem; line-height: 1.45; color: var(--sc-muted); }
.sc-cal .busy { background: #F5E4E0; border-color: #E8C8C0; }
.sc-cal .busy span { color: #8A3324; }
.sc-cal .half { background: linear-gradient(to bottom, #F5E4E0 0 50%, var(--sc-white) 50% 100%); border-color: #E8C8C0; }
.sc-cal .half span { color: #8A3324; }
.sc-cal .now { outline: 2px solid var(--sc-navy); outline-offset: 1px; }
.sc-cal .now b::after { content: " 本月"; font-family: var(--sc-body); font-size: .68rem; font-weight: 700; color: var(--sc-teal-deep); }
.sc-cal-legend { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; font-size: .85rem; color: var(--sc-muted); }
.sc-cal-legend i { display: inline-block; width: 14px; height: 14px; border-radius: 3px; vertical-align: -2px; margin-right: .35rem; border: 1px solid #E8C8C0; background: #F5E4E0; }
.sc-cal-legend i.h { background: linear-gradient(to bottom, #F5E4E0 0 50%, var(--sc-white) 50% 100%); }

/* 比較表 */
.sc-table { width: 100%; min-width: 640px; border-collapse: collapse; background: var(--sc-white); border: 1px solid var(--sc-line); border-radius: var(--sc-radius); font-size: .95rem; }
.sc-table th, .sc-table td { padding: .85rem 1rem; border-bottom: 1px solid var(--sc-line); text-align: left; vertical-align: top; line-height: 1.65; }
.sc-table thead th { background: var(--sc-navy); color: var(--sc-white); font-weight: 700; }
.sc-table tbody th { color: var(--sc-muted); font-weight: 700; font-size: .88rem; white-space: nowrap; width: 8rem; }
.sc-table tbody tr:last-child > * { border-bottom: 0; }

/* ====================================================================
   案例
   ==================================================================== */
.sc-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
@media (max-width: 900px) { .sc-cases { grid-template-columns: 1fr; } }
.sc-case { display: grid; grid-template-rows: auto auto 1fr auto; gap: .5rem; padding: 1.4rem 1.5rem; background: var(--sc-white); border: 1px solid var(--sc-line); border-radius: var(--sc-radius); }
.sc-case-k { font-size: .8rem; font-weight: 700; color: var(--sc-teal-deep); }
.sc-case-t { font-size: 1.15rem; font-weight: 700; color: var(--sc-navy); line-height: 1.45; }
.sc-case-d { color: var(--sc-ink); font-size: .96rem; line-height: 1.8; }
.sc-case-a { font-size: .9rem; font-weight: 700; }
.sc-case-a a { text-decoration: none; }

/* 單一大案例（夥伴頁） */
.sc-feature { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
@media (max-width: 820px) { .sc-feature { grid-template-columns: 1fr; } }
.sc-feature dl { margin: 0; display: grid; gap: .9rem; }
.sc-feature dt { font-size: .8rem; font-weight: 700; color: var(--sc-muted); letter-spacing: .06em; }
.sc-feature dd { margin: .15rem 0 0; line-height: 1.8; }

/* ====================================================================
   FAQ（details）
   ==================================================================== */
.sc-faq { display: grid; gap: 0; border-top: 1px solid var(--sc-line); }
.sc-faq details { border-bottom: 1px solid var(--sc-line); }
.sc-faq summary {
	cursor: pointer; list-style: none; padding: 1.1rem 2.4rem 1.1rem 0; position: relative;
	font-weight: 700; color: var(--sc-navy); font-size: 1.05rem; line-height: 1.55;
}
.sc-faq summary::-webkit-details-marker { display: none; }
.sc-faq summary::after {
	content: ""; position: absolute; right: .3rem; top: 1.45rem; width: 10px; height: 10px;
	border-right: 2px solid var(--sc-teal-deep); border-bottom: 2px solid var(--sc-teal-deep); transform: rotate(45deg); transition: transform .2s ease;
}
.sc-faq details[open] summary::after { transform: rotate(-135deg); top: 1.7rem; }
.sc-faq details > div { padding: 0 0 1.2rem; color: var(--sc-ink); line-height: 1.85; }

/* ====================================================================
   CTA 帶
   ==================================================================== */
.sc-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.2rem 2.5rem; align-items: center; }
@media (max-width: 760px) { .sc-cta { grid-template-columns: 1fr; } }
.sc-cta h2 { margin: 0; font-size: clamp(1.4rem, 2.8vw, 1.9rem); }
.sc-cta p { margin: .5rem 0 0; }

/* 創業者分流帶 */
.sc-founder { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 2rem; align-items: center; padding: 1.6rem 1.8rem; border: 1px solid var(--sc-line); border-left: 4px solid var(--sc-teal); background: var(--sc-white); border-radius: var(--sc-radius); }
@media (max-width: 760px) { .sc-founder { grid-template-columns: 1fr; } }
.sc-founder h3 { margin: 0 0 .3rem; font-size: 1.2rem; }
.sc-founder p { margin: 0; color: var(--sc-muted); }
.sc-founder .wp-block-buttons, .sc-founder-actions { display: flex; flex-wrap: wrap; gap: .6rem 1.1rem; align-items: center; }

/* ====================================================================
   團隊（關於我們）
   ==================================================================== */
.sc-team { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; }
.sc-member { padding: 1.2rem 1.3rem; border: 1px solid var(--sc-line); border-radius: var(--sc-radius); background: var(--sc-white); display: grid; gap: .3rem; align-content: start; }
.sc-member b { font-size: 1.08rem; color: var(--sc-navy); }
.sc-member span { font-size: .78rem; font-weight: 700; color: var(--sc-teal-deep); letter-spacing: .04em; }
.sc-member p { margin: .2rem 0 0; font-size: .94rem; color: var(--sc-muted); line-height: 1.7; }

/* ====================================================================
   聯絡資訊
   ==================================================================== */
.sc-contact { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
@media (max-width: 860px) { .sc-contact { grid-template-columns: 1fr; } }
.sc-contact-side { display: grid; gap: 1rem; padding: 1.4rem 1.5rem; background: var(--sc-paper); border-radius: var(--sc-radius); }
.sc-contact-side dl { margin: 0; display: grid; gap: .8rem; }
.sc-contact-side dt { font-size: .8rem; color: var(--sc-muted); font-weight: 700; }
.sc-contact-side dd { margin: .1rem 0 0; }

/* FluentForm */
.fluentform .ff-el-group { margin-bottom: 1.1rem; }
.fluentform .ff-el-input--label label { font-weight: 700; color: var(--sc-navy); }
.fluentform .ff-el-form-control { border: 1px solid #C9D3E0; border-radius: 4px; padding: .7rem .8rem; font-size: 1rem; }
.fluentform .ff-el-form-control:focus { border-color: var(--sc-teal-deep); box-shadow: 0 0 0 3px rgba(108, 218, 193, .35); }
.fluentform .ff-btn-submit { background: var(--sc-navy) !important; border-color: var(--sc-navy) !important; color: #fff !important; font-weight: 700; padding: .8rem 1.6rem; border-radius: 4px; }
.fluentform .ff-btn-submit:hover { background: var(--sc-teal-deep) !important; border-color: var(--sc-teal-deep) !important; }

/* ====================================================================
   文章與列表
   ==================================================================== */
.sc-post-head { display: grid; gap: .8rem; }
.sc-post-head .wp-block-post-title { font-size: clamp(1.6rem, 3.4vw, 2.2rem); line-height: 1.4; }
.sc-post-meta { display: flex; flex-wrap: wrap; gap: .3rem 1rem; font-size: .88rem; color: var(--sc-muted); }
.sc-post-meta a { color: var(--sc-teal-deep); text-decoration: none; font-weight: 700; }
.sc-post-thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--sc-radius); background: var(--sc-paper); }
.sc-article .wp-block-post-content { font-size: 1.06rem; line-height: 1.95; }
.sc-article .wp-block-post-content :where(h2) { font-size: 1.45rem; margin-top: 2.4rem; }
.sc-article .wp-block-post-content :where(h3) { font-size: 1.2rem; margin-top: 1.8rem; }
.sc-article .wp-block-post-content :where(table) { width: 100%; border-collapse: collapse; font-size: .95rem; display: block; overflow-x: auto; }
.sc-article .wp-block-post-content :where(th, td) { border: 1px solid var(--sc-line); padding: .55rem .7rem; }

.sc-related { margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid var(--sc-line); }
.sc-related-t { font-family: var(--sc-latin); font-size: .8rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--sc-muted); margin: 0 0 .8rem; }
.sc-related ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem 1.6rem; }
@media (max-width: 640px) { .sc-related ul { grid-template-columns: 1fr; } }
.sc-related li a { color: var(--sc-navy); text-decoration: none; font-weight: 500; line-height: 1.6; }
.sc-related li a:hover { color: var(--sc-teal-deep); text-decoration: underline; text-underline-offset: .2em; }

.sc-post-cta { margin-top: 2.4rem; padding: 1.5rem 1.6rem; border: 1px solid var(--sc-line); border-left: 4px solid var(--sc-teal); border-radius: var(--sc-radius); background: var(--sc-paper); display: grid; gap: .6rem; }
.sc-post-cta p { margin: 0; }
.sc-post-cta-title { font-size: 1.15rem; font-weight: 700; color: var(--sc-navy); }
.sc-post-cta-links { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; align-items: center; margin-top: .3rem !important; }
.sc-post-cta-note { font-size: .9rem; color: var(--sc-muted); padding-top: .6rem; border-top: 1px dashed var(--sc-line); }

.sc-list .wp-block-post-template { display: grid; gap: 0; }
.sc-list .wp-block-post { display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: 1.2rem; padding-block: 1.3rem; border-bottom: 1px solid var(--sc-line); }
@media (max-width: 640px) { .sc-list .wp-block-post { grid-template-columns: 1fr; } .sc-list .wp-block-post-featured-image { display: none; } }
.sc-list .wp-block-post-title { font-size: 1.15rem; line-height: 1.5; margin: 0; }
.sc-list .wp-block-post-title a { text-decoration: none; color: var(--sc-navy); }
.sc-list .wp-block-post-title a:hover { color: var(--sc-teal-deep); }
.sc-list .wp-block-post-excerpt { font-size: .94rem; color: var(--sc-muted); margin: .3rem 0 0; }
.sc-list .wp-block-post-excerpt__more-link { display: none; }
.sc-list .wp-block-post-date { font-size: .82rem; color: var(--sc-muted); }
.sc-list .wp-block-post-featured-image img { aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; background: var(--sc-paper); }
.sc-list .wp-block-query-pagination { margin-top: 2rem; gap: .8rem; }
.sc-cats { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0; }
.sc-cats li a { display: inline-block; padding: .3rem .8rem; border: 1px solid var(--sc-line); border-radius: 999px; font-size: .88rem; text-decoration: none; color: var(--sc-ink); background: var(--sc-white); }
.sc-cats li a:hover { border-color: var(--sc-teal-deep); color: var(--sc-teal-deep); }

/* ====================================================================
   舊文章內嵌的 BIBC 推廣區塊（inline style）在窄螢幕別撐破
   ==================================================================== */
.wp-block-post-content div[style*="border-left:4px"] { max-width: 100%; box-sizing: border-box; }

/* ====================================================================
   Footer
   ==================================================================== */
.sc-footer { background: var(--sc-navy-deep); color: #B9C6DA; padding-block: clamp(3rem, 6vw, 4.5rem) 1.6rem !important; padding-inline: var(--sc-gutter) !important; font-size: .94rem; }
.sc-footer a { color: #DCE6F4; text-decoration: none; }
.sc-footer a:hover { color: var(--sc-teal); text-decoration: underline; text-underline-offset: .2em; }
.sc-footer-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr)); gap: 2rem; }
@media (max-width: 900px) { .sc-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .sc-footer-grid { grid-template-columns: 1fr; } }
.sc-footer h2 { font-size: .8rem; font-family: var(--sc-latin); letter-spacing: .16em; text-transform: uppercase; color: var(--sc-teal); margin: 0 0 .8rem; font-weight: 600; }
.sc-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.sc-footer .sc-logo-zh { color: #fff; }
.sc-footer .sc-logo-en { color: var(--sc-teal); }
.sc-footer-brand { display: grid; gap: .9rem; align-content: start; }
.sc-footer-brand p { margin: 0; line-height: 1.8; }
.sc-footer-bottom { margin-top: 2.6rem; padding-top: 1.2rem; border-top: 1px solid rgba(255, 255, 255, .12); display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; justify-content: space-between; font-size: .82rem; color: #8FA0BA; }

/* ====================================================================
   Motion
   ==================================================================== */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
