/* 網拍頁(提案):乾淨白底、方角、單一點綴色鈷藍;用訂單、出貨單、庫存表的真實畫面,不加貼紙裝飾。 */
body.ind-retail {
  --bg: #ffffff; --sub: #f4f4f2; --ink: #111111; --ink-2: #333333; --muted: #5e5e5e; --line: #e5e5e5;
  --accent: #1f4fd8; --brand: #111111; --brand-ink: #ffffff; --mark-line: #ffffff;
  --font: "Inter", "Noto Sans TC", -apple-system, "PingFang TC", sans-serif;
  font-family: var(--font); font-size: 17px; line-height: 1.75;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.ind-retail {
    --bg: #101010; --sub: #181818; --ink: #f2f2f2; --ink-2: #cfcfcf; --muted: #9a9a9a; --line: #2a2a2a; --accent: #7d9bff; --brand: #f2f2f2; --brand-ink: #101010; --mark-line: #101010;
  }
}
.rt-btn { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 22px; background: var(--brand); color: var(--brand-ink); text-decoration: none; font-weight: 500; }
.rt-link { color: var(--accent); text-decoration: none; font-weight: 500; }
.rt-link:hover { text-decoration: underline; }
.rt-hero { padding: 40px 0 0; }
.rt-hero .crumb { font-size: 13px; margin-bottom: 56px; }
.rt-hero .crumb a { color: var(--muted); text-decoration: none; }
.rt-hero .top { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: end; }
.rt-hero h1 { grid-column: 1 / span 7; font-size: clamp(32px, 4.4vw, 56px); font-weight: 500; line-height: 1.2; letter-spacing: -.01em; }
.rt-hero .side { grid-column: 9 / span 4; }
.rt-hero .side p { color: var(--ink-2); }
.rt-hero .side .act { margin-top: 24px; display: flex; gap: 20px; align-items: center; }
.rt-hero .shot { margin-top: 64px; background: var(--sub); padding: 48px 48px 0; }
.rt-hero .shot img { width: 100%; border: 1px solid var(--line); border-bottom: 0; }
.rt-note { font-size: 12.5px; color: var(--muted); margin-top: 10px; }
@media (max-width: 860px) { .rt-hero .top { grid-template-columns: 1fr; } .rt-hero h1, .rt-hero .side { grid-column: 1; } .rt-hero .shot { padding: 20px 20px 0; } }

.rt-row { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; padding: 96px 0; border-top: 1px solid var(--line); align-items: start; }
.rt-row .no { grid-column: 1 / span 1; font-size: 14px; color: var(--accent); font-weight: 600; }
.rt-row .txt { grid-column: 2 / span 4; }
.rt-row h2 { font-size: 28px; font-weight: 500; line-height: 1.35; }
.rt-row p { margin-top: 14px; color: var(--ink-2); }
.rt-row ul { margin: 16px 0 0; padding: 0; list-style: none; }
.rt-row li { padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 15.5px; }
.rt-row li.soon { color: var(--muted); }
.rt-row li.soon::after { content: "　即將推出"; font-size: 13px; }
.rt-row figure { grid-column: 7 / span 6; margin: 0; }
.rt-row figure img { width: 100%; border: 1px solid var(--line); }
.rt-row.plain .txt { grid-column: 2 / span 6; }
@media (max-width: 860px) { .rt-row { grid-template-columns: 1fr; padding: 64px 0; } .rt-row .no, .rt-row .txt, .rt-row figure, .rt-row.plain .txt { grid-column: 1; } }

.rt-price { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--ink); margin-top: 24px; }
.rt-price > div { padding: 24px; }
.rt-price > div + div { border-left: 1px solid var(--ink); color: var(--muted); }
.rt-price h3 { font-size: 20px; font-weight: 600; }
.rt-price .st { font-size: 13px; margin-left: 8px; font-weight: 400; color: var(--accent); }
.rt-price .soon .st { color: var(--muted); }
.rt-price p { margin-top: 8px; font-size: 15px; }
@media (max-width: 700px) { .rt-price { grid-template-columns: 1fr; } .rt-price > div + div { border-left: 0; border-top: 1px solid var(--ink); } }
.rt-faq details { border-bottom: 1px solid var(--line); }
.rt-faq details:first-child { border-top: 1px solid var(--line); }
.rt-faq summary { cursor: pointer; list-style: none; padding: 16px 0; font-weight: 500; display: flex; justify-content: space-between; }
.rt-faq summary::-webkit-details-marker { display: none; }
.rt-faq summary::after { content: "+"; color: var(--accent); }
.rt-faq details[open] summary::after { content: "−"; }
.rt-faq p { padding-bottom: 16px; color: var(--ink-2); }

/* 套文案後補的小件 */
.rt-hero .side p.sub, .rt-row p.sub { font-weight: 600; color: var(--ink); margin-top: 10px; }
.rt-hero .side p.sub { margin-top: 0; margin-bottom: 8px; }
.rt-row p.sub + p { margin-top: 6px; }
.rt-ph { aspect-ratio: 16 / 10; background: var(--sub); border: 1px dashed #c9c9c9; display: grid; place-content: center; text-align: center; color: var(--muted); font-size: 14.5px; }
.rt-ph span { display: block; font-size: 12px; font-weight: 600; letter-spacing: .1em; color: var(--accent); margin-bottom: 4px; }
.rt-faq details p b { font-weight: 600; }
.faq-link { color: var(--accent); margin-left: 6px; text-decoration: none; font-weight: 500; }
