/*
 * 2026-10-02（issue 176，第二階段）原廠頁群：原廠總覽（品牌牆）、原廠頁（Logo 舞台）、原廠產品頁（能力分層）。
 * 沿用 inner.css 的語彙與 token，這個檔案只放這三個頁型的專屬版型，不出現色碼；選擇器一律以 #main.inner-main 開頭，
 * 並以 data-page-kind 限定頁型，不影響其他頁群。動態只在 prefers-reduced-motion: no-preference 且
 * html:not([data-motion="off"]) 之內；Logo 不使用 CSS filter，也不裁切（object-fit: contain，四周留白）。
 */
@property --ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }

#main.inner-main {
  /* ================= 共用：原廠頁與產品頁的頁首（Logo 舞台） ================= */
  .page-head:has(> .partner-logo-frame) { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: clamp(2rem, 5vw, 5rem); align-items: start; }
  .page-head:has(> .partner-logo-frame) > * { grid-column: 1; max-width: 100%; }
  .page-head:has(> .partner-logo-frame) > .breadcrumb { justify-self: start; }
  .page-head:has(> .partner-logo-frame) > .partner-logo-frame { order: 1; grid-row: auto; }

  .partner-logo-frame {
    --mx: 50%; --my: 38%;
    position: relative; isolation: isolate; display: grid; place-items: center; width: 100%; aspect-ratio: 5 / 3; min-height: 0; margin: 0 0 clamp(1.75rem, 4vw, 2.5rem); padding: clamp(2rem, 7%, 3.5rem);
    border: 0; border-radius: var(--r-card); background: var(--paper); overflow: hidden;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--soft) 45%, transparent), 0 2.5rem 6rem color-mix(in srgb, var(--cta) 32%, transparent), 0 .5rem 1.5rem color-mix(in srgb, var(--deeper) 60%, transparent);
  }
  /* 光斑：跟著游標（--mx／--my），沒有 JS 或不允許動態時固定在左上。 */
  .partner-logo-frame::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(22rem circle at var(--mx) var(--my), color-mix(in srgb, var(--soft) 55%, transparent), transparent 70%), linear-gradient(135deg, color-mix(in srgb, var(--wash) 80%, var(--paper)), var(--paper) 60%); }
  /* 裁切記號：四個角的細線，像品牌規範裡標示「安全區」的角標；純裝飾。 */
  .partner-logo-frame::after { content: ""; position: absolute; inset: clamp(.75rem, 2.4%, 1.25rem); z-index: 1; pointer-events: none; border-radius: calc(var(--r-card) - .75rem);
    --c: color-mix(in srgb, var(--cta) 70%, transparent); --l: 2.25rem;
    background:
      linear-gradient(var(--c), var(--c)) 0 0 / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) 0 0 / 2px var(--l) no-repeat,
      linear-gradient(var(--c), var(--c)) 100% 0 / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) 100% 0 / 2px var(--l) no-repeat,
      linear-gradient(var(--c), var(--c)) 0 100% / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) 0 100% / 2px var(--l) no-repeat,
      linear-gradient(var(--c), var(--c)) 100% 100% / var(--l) 2px no-repeat, linear-gradient(var(--c), var(--c)) 100% 100% / 2px var(--l) no-repeat; }
  .partner-logo-frame .partner-logo { position: relative; z-index: 2; display: block; width: auto; height: auto; max-width: min(100%, 24rem); max-height: clamp(5rem, 14vw, 9rem); margin: 0; object-fit: contain; }

  /* ================= 原廠總覽：品牌牆 ================= */
  .partner-directory { padding-top: clamp(2rem, 4vw, 3rem); }
  .partner-directory :is([data-partner-card], [data-partner-group], [data-partner-empty])[hidden] { display: none; }

  .partner-filter { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem 1.5rem; align-items: end; padding: clamp(1rem, 2.4vw, 1.5rem); border-radius: var(--r-card); background: var(--deeper); color: var(--paper); box-shadow: 0 1.5rem 4rem color-mix(in srgb, var(--deeper) 22%, transparent); }
  .partner-filter label, .partner-filter legend { color: var(--muted-on-dark); font-size: .75rem; font-weight: 700; letter-spacing: .16em; }
  .partner-filter legend { float: left; padding: 0; margin: 0 0 .5rem; }
  .partner-filter fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
  .partner-filter-search, .partner-filter-area { display: grid; gap: .5rem; min-width: 0; }
  .partner-filter input[type="search"], .partner-filter select { width: 100%; min-height: 3rem; padding: .625rem 1.25rem; border: 1px solid var(--deep-line); border-radius: var(--r-pill); background: var(--deep); color: var(--paper); font: inherit; font-size: 1rem; transition: border-color .3s var(--ease), background .3s var(--ease); }
  .partner-filter input[type="search"]:hover, .partner-filter select:hover { border-color: var(--soft); }
  .partner-filter :is(input, select, button):focus-visible, .partner-filter .chip:has(input:focus-visible) { outline: 3px solid var(--soft); outline-offset: 3px; }
  .partner-filter-types { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
  .partner-filter-types legend { flex: 0 0 100%; float: none; }
  .partner-filter .chip { position: relative; display: inline-flex; margin: 0; letter-spacing: normal; }
  .partner-filter .chip input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
  .partner-filter .chip span { display: inline-flex; align-items: center; min-height: 3rem; padding: .5rem 1.25rem; border: 1px solid var(--deep-line); border-radius: var(--r-pill); color: var(--paper); font-size: .9375rem; font-weight: 700; transition: background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease); }
  .partner-filter .chip:hover span { border-color: var(--soft); }
  .partner-filter .chip input:checked + span { border-color: var(--paper); background: var(--paper); color: var(--ink); }
  .partner-filter-apply { min-height: 3rem; padding: .5rem 1.75rem; border: 0; border-radius: var(--r-pill); background: var(--cta); color: var(--on-accent); font: inherit; font-weight: 700; cursor: pointer; }
  html.js & .partner-filter-apply { display: none; }
  .partner-count { margin: 0; color: var(--muted-on-dark); font-size: .875rem; }
  .partner-count b { margin-left: .25rem; color: var(--paper); font-family: "Inter Tight", var(--font-body); font-size: 1.5rem; font-weight: 800; font-variant-numeric: tabular-nums; vertical-align: -.1em; }
  @media (min-width: 62rem) {
    .partner-filter { grid-template-columns: minmax(0, 1.2fr) auto minmax(0, .8fr) auto; }
    .partner-filter:not(:has(.partner-filter-area)) { grid-template-columns: minmax(0, 1.4fr) auto auto; }
    .partner-filter .partner-count { grid-column: 1 / -1; padding-top: .25rem; border-top: 1px solid var(--deep-line); padding-top: .875rem; }
    .partner-filter-types { flex-wrap: nowrap; }
  }
  /* 寬螢幕：篩選列單列（搜尋、型態、領域、計數靠右），並上移與頁首區下緣重疊；搜尋框左側有放大鏡。 */
  .partner-filter-search { position: relative; }
  /* 放大鏡：圓環（::before）＋握把（::after）純 CSS 繪製，不用圖片或 data URI。 */
  .partner-filter-search::before { content: ""; position: absolute; left: 1.1875rem; bottom: 1.1875rem; z-index: 1; width: .8125rem; height: .8125rem; border: 2px solid var(--soft); border-radius: 50%; pointer-events: none; }
  .partner-filter-search::after { content: ""; position: absolute; left: 1.9375rem; bottom: .9375rem; z-index: 1; width: .4375rem; height: 2px; border-radius: 1px; background: var(--soft); transform: rotate(45deg); transform-origin: left center; pointer-events: none; }
  .partner-filter input[type="search"] { padding-left: 3.125rem; }
  .catalog-content > .partner-directory { position: relative; z-index: 2; }
  /* issue 222：寬螢幕篩選列整個放進深色頁首（原本半截壓在頁首下緣，讀起來像跑版）。頁首下緣加高篩選列高度（--pf-h）
     再加上下各 2.5rem，篩選列上移「高度＋下方間距」，落在頁首內、與頁首下緣保持 2.5rem。62–68rem 篩選列兩列，68rem 起單列。 */
  @media (min-width: 62rem) {
    &:has(> .catalog-content > .partner-directory) { --pf-h: 12.875rem; }
    &:has(> .catalog-content > .partner-directory) > .page-head { padding-bottom: calc(var(--pf-h) + 5rem); }
    .catalog-content > .partner-directory { margin-top: calc(-1 * (var(--pf-h) + 2.5rem)); padding-top: 0; }
  }
  @media (min-width: 68rem) { &:has(> .catalog-content > .partner-directory) { --pf-h: 8.125rem; } }
  .partner-filter { border: 1px solid var(--deep-line); box-shadow: 0 1.75rem 4rem color-mix(in srgb, var(--deeper) 38%, transparent); }
  @media (min-width: 68rem) {
    .partner-filter, .partner-filter:not(:has(.partner-filter-area)) { display: flex; flex-wrap: nowrap; align-items: flex-end; gap: 1rem 1.5rem; }
    .partner-filter-search { flex: 1 1 14rem; }
    .partner-filter-types { flex: 0 0 auto; }
    .partner-filter-area { flex: 0 1 14rem; }
    .partner-filter .partner-count { flex: 0 0 auto; margin: 0 0 .625rem auto; padding: 0; border: 0; white-space: nowrap; }
  }
  .partner-directory .directory-empty { margin: clamp(2rem, 5vw, 4rem) 0; padding: clamp(1.5rem, 4vw, 3rem); border: 1px dashed var(--line); border-radius: var(--r-card); color: var(--muted); font-size: 1.125rem; text-align: center; }

  .partner-group { padding-block: clamp(2.5rem, 5vw, 4.5rem) 0; }
  .partner-group:last-child { padding-bottom: 0; }
  .partner-group .section-heading { margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }

  /* 牆：欄數依卡片數量決定、每列排滿（見 inner.css 檔尾「卡片列」）；只有數量剛好能排滿時第一張才跨兩欄（旗艦位）。
     技術夥伴區用較矮的卡，區分代理品牌與整合夥伴。 */
  .partner-cards { --gap: clamp(.75rem, 1.4vw, 1.25rem); margin: 0; padding: 0; list-style: none; }
  .partner-cards .brand-card {
    --mx: 50%; --my: 0%;
    position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; min-height: clamp(22rem, 30vw, 28rem); padding: 0; border: 0; border-radius: var(--r-card); background: var(--deeper); color: var(--paper); overflow: hidden;
    transition: transform .7s var(--ease), box-shadow .7s var(--ease);
  }
  /* 技術夥伴卡只在桌機等高（同列拉齊）；手機各卡依內容自然高度，不撐出空洞。 */
  .partner-cards .brand-card[data-type="technologyIntegration"] { min-height: 0; background: var(--deep); }
  @media (min-width: 62rem) { .partner-cards .brand-card[data-type="technologyIntegration"] { min-height: clamp(16rem, 20vw, 19rem); } }
  /* 聚光 + 底部漸層（文字蓋在圖上，漸層確保對比） */
  .partner-cards .brand-card::after { content: ""; position: absolute; inset: 0; z-index: 1; height: auto; pointer-events: none; background: radial-gradient(18rem circle at var(--mx) var(--my), color-mix(in srgb, var(--soft) 26%, transparent), transparent 70%), linear-gradient(to top, color-mix(in srgb, var(--deeper) 70%, transparent), transparent 60%); opacity: 1; transition: opacity .5s var(--ease); }
  .partner-cards .brand-card-image { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; margin: 0; border-radius: 0; transition: transform 1.4s var(--ease); }
  .partner-cards .brand-card-body { position: relative; z-index: 3; padding: clamp(3.5rem, 5vw, 4.5rem) clamp(1.5rem, 2.8vw, 2.25rem) clamp(1.5rem, 2.8vw, 2.25rem); background: linear-gradient(to top, color-mix(in srgb, var(--deeper) 95%, transparent) 40%, color-mix(in srgb, var(--deeper) 90%, transparent) 76%, transparent); }
  .partner-cards .brand-card .eyebrow { margin: 0 0 .875rem; color: var(--soft); }
  .partner-cards .brand-card h2, .partner-cards .brand-card h3 { margin: 0 0 .75rem; font-size: clamp(1.75rem, 3vw, 2.75rem); font-weight: 900; line-height: 1.1; letter-spacing: -.02em; text-wrap: balance; }
  .partner-cards .brand-card > .brand-card-body h3 a, .partner-cards .brand-card > .brand-card-body h2 a { color: var(--paper); text-decoration: none; }
  /* issue 302：有白色 Logo 時標題連結內放 Logo 圖、品牌名視覺隱藏（仍在連結內給螢幕閱讀器）。 */
  .partner-cards .brand-logo { display: block; width: auto; height: clamp(2.25rem, 3vw, 3rem); max-width: min(14rem, 75%); object-fit: contain; object-position: left center; }
  .partner-cards .brand-name { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
  .partner-cards .brand-card h3 a::after, .partner-cards .brand-card h2 a::after { content: ""; position: absolute; inset: 0; z-index: 4; }
  .partner-cards .brand-card p:not(.eyebrow) { max-width: 38ch; color: var(--on-dark-card-body); font-size: 1rem; line-height: 1.7; }
  .partner-cards .brand-card .tags { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.125rem 0 0; padding: 0; list-style: none; }
  .partner-cards .brand-card .tags li { padding: .25rem .75rem; border: 1px solid var(--deep-line); border-radius: var(--r-pill); background: color-mix(in srgb, var(--deeper) 60%, transparent); color: var(--paper); font-size: .75rem; font-weight: 700; }
  .partner-cards .brand-card .text-link { position: relative; margin-top: .75rem; color: var(--soft); }
  .partner-cards .brand-card .text-link span[aria-hidden] { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--soft); transition: background .4s var(--ease), color .4s var(--ease), transform .45s var(--ease); }
  .partner-cards .brand-card:is(:hover, :focus-within) { box-shadow: 0 2rem 4.5rem color-mix(in srgb, var(--deeper) 38%, transparent); }
  .partner-cards .brand-card:is(:hover, :focus-within) .brand-card-image { transform: scale(1.06); }
  .partner-cards .brand-card:is(:hover, :focus-within) .text-link span[aria-hidden] { background: var(--soft); color: var(--deeper); }
  .partner-cards .brand-card:focus-within { outline: 3px solid var(--action); outline-offset: 3px; }
  .partner-cards .brand-card:has(a:focus-visible) { outline: 3px solid var(--action); outline-offset: 3px; }
  .partner-cards .brand-card:not(:has(> .brand-card-image))::after { background: radial-gradient(18rem circle at var(--mx) var(--my), color-mix(in srgb, var(--soft) 22%, transparent), transparent 70%), radial-gradient(40rem 20rem at 100% 0, color-mix(in srgb, var(--cta) 26%, transparent), transparent 70%); }

  /* ================= 原廠頁 ================= */
  /* 內容主軸：編號大字清單，一欄一條。 */
  .partner-why-choose .checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)); gap: 0 clamp(2rem, 5vw, 4.5rem); }
  .partner-why-choose .checks li { padding: clamp(1.25rem, 2.4vw, 1.875rem) 0; border-top: 1px solid var(--ink); color: var(--ink); font-size: clamp(1.125rem, 1.7vw, 1.375rem); font-weight: 700; line-height: 1.55; transition: padding-left .5s var(--ease); }
  .partner-why-choose .checks li::before { content: none; }
  .partner-why-choose .checks li::after { display: none; }

  /* 在服務中的角色：深色帶。兩側是相關服務與相關情境，中間一條連線，光點沿線走。 */
  .partner-role, .product-capabilities { position: relative; isolation: isolate; color: var(--paper); }
  .partner-role::before, .product-capabilities::before { content: ""; position: absolute; z-index: -1; inset: 0 calc(50% - 50vw); border-radius: var(--r-top) var(--r-top) 0 0; background: radial-gradient(60rem 28rem at 88% 0, color-mix(in srgb, var(--cta) 16%, transparent), transparent 70%), var(--deeper); }
  .partner-role :is(h2, h3), .product-capabilities :is(h2, h3) { color: var(--paper); }
  .partner-role :is(.lead, p:not(.eyebrow)) { color: var(--muted-on-dark); }
  .partner-role .eyebrow, .product-capabilities .eyebrow { color: var(--soft); }
  .partner-role :focus-visible, .product-capabilities :focus-visible { outline-color: var(--soft); }
  .partner-role .definition-list { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; border-top: 0; }
  .partner-role .definition-list > div { display: block; padding: clamp(1.5rem, 3vw, 2.25rem); border: 1px solid var(--deep-line); border-radius: var(--r-card); background: var(--deep); }
  .partner-role .definition-list dt { margin: 0 0 1.25rem; color: var(--soft); }
  .partner-role .definition-list dd { margin: 0; }
  .partner-role .partner-role-links { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
  .partner-role .partner-role-links a { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; min-height: 3.5rem; padding: .75rem 0; border: 0; border-bottom: 1px solid var(--deep-line); border-radius: 0; color: var(--paper); font-size: clamp(1.125rem, 1.8vw, 1.5rem); font-weight: 800; text-decoration: none; transition: padding-left .45s var(--ease), color .35s var(--ease); }
  .partner-role .partner-role-links li:last-child a { border-bottom: 0; }
  .partner-role .partner-role-links a::after { content: "→"; color: var(--soft); transition: transform .45s var(--ease); }
  .partner-role .partner-role-links a:is(:hover, :focus-visible) { padding-left: .75rem; color: var(--soft); }
  .partner-role .partner-role-links a:is(:hover, :focus-visible)::after { transform: translateX(.35rem); }
  @media (min-width: 62rem) {
    .partner-role .definition-list:has(> div + div) { grid-template-columns: minmax(0, 1fr) clamp(4rem, 9vw, 8rem) minmax(0, 1fr); gap: 0; }
    .partner-role .definition-list:has(> div + div) > div:nth-child(2) { grid-column: 3; grid-row: 1; }
    .partner-role .definition-list:has(> div + div)::before { content: ""; grid-column: 2; grid-row: 1; align-self: center; height: 1px; background: linear-gradient(90deg, var(--soft), color-mix(in srgb, var(--cta) 40%, transparent)); }
    .partner-role .definition-list:has(> div + div)::after { content: ""; grid-column: 2; grid-row: 1; align-self: center; justify-self: center; width: .875rem; height: .875rem; border-radius: 50%; background: var(--soft); box-shadow: 0 0 0 .5rem color-mix(in srgb, var(--soft) 18%, transparent), 0 0 1.5rem var(--cta); }
  }
  .solution-areas { padding-block: var(--sec); }
  .solution-area-list li { padding: .625rem 1.25rem; border: 1px solid var(--line); background: var(--paper); color: var(--ink); font-weight: 700; transition: background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease); }
  .solution-area-list li:hover { border-color: var(--ink); background: var(--ink); color: var(--paper); }

  /* 產品卡：大編號、整張可點，hover 翻成深色。 */
  .product-section .product-card { --mx: 50%; --my: 0%; position: relative; isolation: isolate; display: flex; flex-direction: column; min-height: clamp(15rem, 20vw, 19rem); overflow: hidden; border: 0; background: var(--paper); transition: background .5s var(--ease), color .5s var(--ease), transform .6s var(--ease), box-shadow .6s var(--ease); }
  .product-section .product-card::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; pointer-events: none; background: radial-gradient(18rem circle at var(--mx) var(--my), color-mix(in srgb, var(--soft) 24%, transparent), transparent 70%), var(--deeper); transition: opacity .5s var(--ease); }
  .product-section .product-card h3 { margin: auto 0 .75rem; padding-top: 2rem; font-size: clamp(1.5rem, 2.4vw, 2.125rem); font-weight: 900; }
  .product-section .product-card h3 a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
  .product-section .product-card .text-link { margin-top: .75rem; }
  .product-section .product-card:is(:hover, :focus-within) { box-shadow: 0 2rem 4rem color-mix(in srgb, var(--deeper) 24%, transparent); }
  .product-section .product-card:is(:hover, :focus-within)::after { opacity: 1; }
  .product-section .product-card:is(:hover, :focus-within) :is(h3 a, h3) { color: var(--paper); }
  .product-section .product-card:is(:hover, :focus-within) p { color: var(--muted-on-dark); }
  .product-section .product-card:is(:hover, :focus-within) :is(.text-link, .eyebrow) { color: var(--soft); }
  .product-section .product-card:has(a:focus-visible) { outline: 3px solid var(--action); outline-offset: 3px; }
  .product-section .empty-state { padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px dashed var(--muted); border-radius: var(--r-card); background: var(--paper); }

  /* 商標聲明與品牌規範：頁尾小字，上方一條細線。 */
  .catalog-content[data-page-kind^="partner"] :is(.trademark, .brand-guidelines) { max-width: 60rem; margin: 0; padding: 0; color: var(--muted); font-size: .875rem; line-height: 1.8; }
  .catalog-content[data-page-kind^="partner"] .trademark { margin-top: var(--sec); padding-top: 1.5rem; border-top: 1px solid var(--line); }
  .catalog-content[data-page-kind^="partner"] .brand-guidelines { margin-top: .5rem; }
  .catalog-content[data-page-kind^="partner"] .brand-guidelines a { color: var(--action); font-weight: 700; text-underline-offset: .22em; }

  /* ================= 原廠產品頁：能力分層 ================= */
  .product-capabilities { padding-block: var(--sec); }
  .product-capabilities .checks { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; max-width: none; }
  .product-capabilities .checks li { --i: 0; position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 1.25rem; align-items: center; padding: clamp(1.125rem, 2.2vw, 1.625rem) clamp(1.25rem, 3vw, 2.25rem); border: 1px solid var(--deep-line); border-radius: var(--r-card); background: linear-gradient(100deg, color-mix(in srgb, var(--cta) calc(8% + var(--i) * 2%), var(--deep)), var(--deep) 70%); color: var(--paper); font-size: clamp(1.0625rem, 1.6vw, 1.3125rem); font-weight: 700; line-height: 1.55; transition: transform .6s var(--ease), border-color .4s var(--ease), box-shadow .6s var(--ease); }
  .product-capabilities .checks li::before { content: none; }
  .product-capabilities .checks li::after { content: ""; position: absolute; inset: auto 0 0 0; width: auto; height: 3px; border: 0; border-radius: 0 0 var(--r-card) var(--r-card); background: linear-gradient(90deg, var(--cta), transparent calc(20% + var(--i) * 8%)); transform: none; opacity: .9; }
  .product-capabilities .checks li:nth-child(1) { --i: 0; } .product-capabilities .checks li:nth-child(2) { --i: 1; } .product-capabilities .checks li:nth-child(3) { --i: 2; }
  .product-capabilities .checks li:nth-child(4) { --i: 3; } .product-capabilities .checks li:nth-child(5) { --i: 4; } .product-capabilities .checks li:nth-child(n+6) { --i: 5; }
  @media (min-width: 48rem) {
    /* 階梯：每一層往右縮一格，疊出分層的深度感。 */
    .product-capabilities .checks li { margin-left: calc(var(--i) * clamp(1rem, 3.2vw, 3rem)); }
  }
  .product-capabilities .checks li:hover { border-color: var(--soft); box-shadow: 0 1rem 3rem color-mix(in srgb, var(--cta) 28%, transparent); }
  .product-capabilities .scope-notice { margin-top: 2rem; }

  /* 選型前確認：大編號、粗上線，hover 時編號填色。 */
  .scoping-checks .numbered-list { gap: clamp(1rem, 2vw, 1.75rem); }
  .scoping-checks .numbered-list > div { padding: clamp(1.25rem, 2.4vw, 1.75rem) 0 0; border-top: 3px solid var(--ink); transition: border-color .4s var(--ease); }
  .scoping-checks .numbered-list-no { display: block; margin-bottom: 1.25rem; font-family: "Inter Tight", var(--font-body); font-size: clamp(2.5rem, 4.4vw, 4rem); font-weight: 800; line-height: 1; color: var(--action); transition: color .4s var(--ease); }
  .scoping-checks .numbered-list > div:hover { border-top-color: var(--action); }
  .scoping-checks .numbered-list > div:hover .numbered-list-no { color: var(--action); }
  .scoping-checks .numbered-list h3 { margin: 0; font-size: clamp(1.25rem, 2vw, 1.625rem); font-weight: 800; }

  /* 產品頁頁首：Logo 舞台縮小，頁首圖橫跨整排。 */
  .page-head:has(> .partner-logo-frame):has(> :is(.page-figure, .page-image)) > :is(.page-figure, .page-image) { grid-column: 1 / -1; }

  @media (min-width: 62rem) {
    .page-head:has(> .partner-logo-frame) { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); }
    .page-head:has(> .partner-logo-frame) > .partner-logo-frame { grid-column: 2; grid-row: 2 / span 6; align-self: center; justify-self: end; max-width: 17rem; aspect-ratio: 2 / 1; margin: 0; }
    .page-head:has(> .partner-logo-frame) > .breadcrumb { grid-column: 1 / -1; }
  }
  @media (max-width: 61.9375rem) {
    /* 窄螢幕：logo 卡不再接近滿版、把標題擠到首屏下方，改成標題上方的小卡。 */
    .page-head:has(> .partner-logo-frame) > .partner-logo-frame { aspect-ratio: auto; width: auto; max-width: 13rem; padding: 1rem 1.5rem; }
    .partner-logo-frame .partner-logo { max-height: 3.5rem; }
  }

  /* ================= 動態（只在允許動態時） ================= */
  @media (prefers-reduced-motion: no-preference) {
    /* 品牌卡進場：縮放＋位移彈入，依序錯開；fill-mode 只用 backwards，結束後回到一般樣式（不蓋掉捲動進場的 .mo 狀態），篩選後重新出現也會重播。 */
    html:not([data-motion="off"]) & .partner-cards > li { animation: pp-pop .65s var(--ease-out-expo) backwards; }
    html:not([data-motion="off"]) & .partner-cards > li:nth-child(2) { animation-delay: .07s; }
    html:not([data-motion="off"]) & .partner-cards > li:nth-child(3) { animation-delay: .14s; }
    html:not([data-motion="off"]) & .partner-cards > li:nth-child(n + 4) { animation-delay: .21s; }
    html:not([data-motion="off"]) & .partner-logo-frame { animation: pp-stage 1.1s var(--ease) both; }
    html:not([data-motion="off"]) & .partner-logo-frame .partner-logo { animation: pp-logo 1.4s var(--ease) .25s both; }
    /* 流動的光邊：conic 漸層沿著舞台邊緣轉，用 mask 只留一圈細線。 */
    html.js:not([data-motion="off"]) & .partner-logo-frame::after { animation: pp-sheen 7s linear infinite; }
    html.js:not([data-motion="off"]) & .partner-role .definition-list:has(> div + div)::after { animation: pp-packet 4.5s var(--ease-in-out) infinite; }
  }
}
@keyframes pp-pop { from { opacity: 0; translate: 0 2rem; scale: .94; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes pp-stage { from { transform: translateY(1.5rem) scale(.96); opacity: .001; } to { transform: none; opacity: 1; } }
@keyframes pp-logo { from { transform: scale(.9); opacity: .001; } to { transform: none; opacity: 1; } }
@keyframes pp-sheen { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }
@keyframes pp-packet { 0% { transform: translateX(-4.5rem); opacity: 0; } 15%, 85% { opacity: 1; } 100% { transform: translateX(4.5rem); opacity: 0; } }