/* Solution / complete line page (single-solution.php). Builds on product.css. */

.rp-sl-hero__media { margin: 0; aspect-ratio: 4 / 3; }
.rp-sl-hero__media img { object-fit: cover; }
.rp-pd-gallery .rp-caption { padding-top: var(--s2); margin: 0; }
.rp-sl-tags { margin-bottom: var(--s6); }

/* ---------------------------------------------------------------- line flow */
.rp-sl-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line-strong); counter-reset: stage; }
.rp-sl-flow__step { counter-increment: stage; position: relative; padding: var(--s5) var(--s5) var(--s6); background: var(--canvas); border-bottom: 1px solid var(--surface-2); }
.rp-sl-flow__step:not(:nth-child(4n+1)) { border-left: 1px solid var(--surface-2); }
.rp-sl-flow__step::before { content: counter(stage, decimal-leading-zero); display: block; font-size: 14px; color: var(--brand); margin-bottom: var(--s4); }
.rp-sl-flow__step:not(:last-child)::after { content: "→"; position: absolute; top: var(--s5); right: var(--s5); color: var(--ink-subtle); font-size: 16px; line-height: 1; }
.rp-sl-flow__step h3 { font-size: 18px; font-weight: 600; line-height: 1.35; margin-bottom: var(--s2); }
.rp-sl-flow__step p { font-size: 14px; color: var(--ink-muted); margin: 0; }
.rp-sl-diagram { margin: var(--s7) 0 0; }
.rp-sl-diagram .rp-caption { padding-top: var(--s2); }

/* ---------------------------------------------------------------- capacity */
.rp-cap { background: var(--canvas); }
.rp-cap .rp-table { min-width: 760px; }
.rp-cap tbody th { font-weight: 400; white-space: nowrap; }
.rp-cap tbody th strong { font-size: 20px; font-weight: 400; color: var(--brand); font-variant-numeric: tabular-nums; }
.rp-cap td[data-col="reference_bottle"], .rp-cap td[data-col="equipment"] { white-space: nowrap; }
.rp-cap td[data-col="notes"] { color: var(--ink-muted); font-size: 14px; min-width: 280px; }

/* ---------------------------------------------------------------- preparation */
.rp-sl-prep { counter-reset: feat; }

@media (max-width: 1024px) {
	.rp-sl-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rp-sl-flow__step:not(:nth-child(4n+1)) { border-left: 0; }
	.rp-sl-flow__step:nth-child(even) { border-left: 1px solid var(--surface-2); }
}
@media (max-width: 760px) {
	.rp-sl-flow { grid-template-columns: 1fr; }
	.rp-sl-flow__step, .rp-sl-flow__step:nth-child(even) { border-left: 0; padding: var(--s5) 0; background: transparent; }
	.rp-sl-flow__step:not(:last-child)::after { content: "↓"; right: 0; }
	.rp-cap .rp-table { min-width: 0; }
	.rp-cap thead { display: none; }
	.rp-cap tr { display: block; padding: var(--s4) 0; border-bottom: 1px solid var(--line); }
	.rp-cap tbody th, .rp-cap td { display: block; padding: 2px 0; border: 0; white-space: normal; background: transparent; }
	.rp-cap td[data-col="notes"] { min-width: 0; margin-top: var(--s2); }
	.rp-solution .rp-breadcrumb li:last-child { display: block; }
}
