/* Maintenance page specific styles (lean, leveraging base.css) */
.section-block { padding-block: var(--space-40); }
.section-nav { padding-block: var(--space-16); }
.section-nav a { display: inline-block; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-1); }
.section-nav a:hover { text-decoration: none; box-shadow: var(--shadow-sm); }

.hero { display: grid; grid-template-columns: 1.15fr 1fr; gap: var(--space-16); padding-block: var(--space-32); align-items: center; }
.hero__content p { color: var(--gray-200); }
.hero__cta { margin-top: var(--space-16); display: flex; gap: var(--space-12); flex-wrap: wrap; }
.hero__media { border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); box-shadow: var(--shadow-md); }
.hero__media img { width: 100%; height: auto; display: block; }

.process-steps { counter-reset: step; list-style: none; padding-left: 0; }
.process-steps li { position: relative; padding-left: 44px; margin-block: 10px; }
.process-steps li::before { counter-increment: step; content: counter(step); position: absolute; left: 0; top: 0; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-pill); background: var(--color-primary); color: #0b0c0e; font-weight: 700; box-shadow: var(--shadow-sm); }

.plan--highlight { outline: 2px solid color-mix(in oklab, var(--color-primary) 70%, #000 30%); }
.plan__cta { margin-top: var(--space-12); }

.parts-figure { margin-top: var(--space-16); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); }
.parts-figure figcaption { padding: 8px 12px; background: var(--color-surface-2); border-top: 1px solid var(--color-border); color: var(--gray-100); font-size: var(--fs-200); }

/* Responsiveness */
@media (max-width: 960px) {
  .hero { grid-template-columns: 1fr; }
}