/* Service landing pages — built on the main token system */

.crumbs { background: var(--color-paper-2); border-bottom: 1px solid var(--line); padding: 96px 0 14px; font-size: 0.88rem; color: var(--color-ink-dim); }
.crumbs a { color: var(--color-accent); }
.crumbs span { margin: 0 6px; opacity: 0.5; }

.page-hero { position: relative; min-height: 56vh; display: flex; align-items: flex-end; overflow: hidden; padding: 90px 0 var(--space-2xl); }
.page-hero-media { position: absolute; inset: 0; z-index: 0; }
.page-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero-scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, var(--color-paper) 1%, oklch(18% 0.025 50 / 0.74) 35%, oklch(18% 0.025 50 / 0.45) 100%); }
.page-hero-inner { position: relative; z-index: 2; max-width: 860px; }
.page-hero-inner .kicker { color: var(--color-accent-bright); }
.page-hero h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem, 4.6vw, 3.6rem); line-height: 1.3; color: #fff; margin-bottom: var(--space-md); text-shadow: 0 2px 30px oklch(0% 0 0 / 0.4); }
.page-hero .lead { font-size: var(--text-lead); color: oklch(95% 0.01 75 / 0.92); max-width: 620px; margin-bottom: var(--space-lg); line-height: 1.85; }

.prose-section { background: var(--color-paper); }
.prose { max-width: 800px; margin-inline: auto; }
.prose h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); margin: var(--space-xl) 0 var(--space-sm); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-size: 1.4rem; margin-bottom: var(--space-xs); }
.prose p { color: var(--color-ink-soft); font-size: 1.05rem; line-height: 1.95; margin-bottom: var(--space-md); }
.prose strong { color: var(--color-ink); font-weight: 700; }
.prose .ticks, .prose .steps-list { margin: 0 0 var(--space-md); padding: 0; display: grid; gap: 12px; }
.prose .ticks li { list-style: none; position: relative; padding-inline-start: 32px; color: var(--color-ink-soft); line-height: 1.8; }
.prose .ticks li::before { content: "✓"; position: absolute; inset-inline-start: 0; top: 0; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: oklch(54% 0.128 50 / 0.12); color: var(--color-accent); font-size: 0.8rem; font-weight: 700; }
.prose .steps-list { counter-reset: step; }
.prose .steps-list li { list-style: none; position: relative; padding-inline-start: 44px; color: var(--color-ink-soft); line-height: 1.8; }
.prose .steps-list li::before { counter-increment: step; content: counter(step); position: absolute; inset-inline-start: 0; top: -2px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--color-accent); color: #fff; font-family: var(--font-display); font-weight: 700; font-size: 0.95rem; }

.prose-cta { margin-top: var(--space-xl); padding: var(--space-lg); background: var(--color-paper-2); border: 1px solid var(--line-warm); border-radius: var(--radius); text-align: center; }
.prose-cta h3 { color: var(--color-ink); margin-bottom: 6px; }
.prose-cta p { margin-bottom: var(--space-md); }
.prose-cta .btn { margin: 6px; }

@media (max-width: 860px) {
  .page-hero { min-height: 48vh; }
}