/* Service pages share the studio's typography and numbered editorial rhythm. */
.service-page .breadcrumbs { padding-top: 28px; font-size: 12px; color: var(--muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; list-style: none; gap: 12px; margin: 0; padding: 0; }
.breadcrumbs li + li::before { content: '/'; margin-right: 12px; color: var(--accent); }
.breadcrumbs a:hover { color: var(--accent); text-decoration: underline; }
.service-intro { display: grid; grid-template-columns: 1.5fr 1fr; gap: 80px; align-items: center; padding-block: 64px 80px; }
.service-page h1 { font-size: clamp(48px,5.3vw,76px); margin: 24px 0 28px; }
.service-page h1 .serif { display: block; }
.service-lead { max-width: 630px; color: var(--muted); font-size: 16px; line-height: 1.85; margin-bottom: 32px; }
.service-summary { padding: 24px; border: 1px solid var(--line); background: var(--surface); }
.service-summary::before { content: ''; display: block; height: 195px; margin-bottom: 24px; border: 1px solid var(--line); border-radius: 110px 110px 0 0; background: url('/assets/intelligence-studio.png') 85% center/cover; }
.service-summary .eyebrow { font-size: 10px; }
.service-summary ul { list-style: none; padding: 0; margin: 20px 0; }
.service-summary li { position: relative; border-top: 1px solid var(--line); padding: 13px 0 13px 18px; font-size: 13px; line-height: 1.6; }
.service-summary li::before { content: '+'; position: absolute; left: 0; color: var(--accent); }
.service-block { padding-block: 80px; }
.service-example { padding: 32px; margin-top: 48px; border-left: 3px solid var(--accent); background: var(--accent-soft); }
.service-example h2 { font-size: clamp(26px, 3vw, 36px); margin: 20px 0; }
.service-example p { font-size: 15px; line-height: 1.85; color: var(--muted); }
.service-example-section { padding-bottom: 64px; }
.service-example-section .service-example { margin-top: 0; }
.service-use-cases { background: var(--surface); border-block: 1px solid var(--line); }
.service-section-heading { max-width: 780px; margin-bottom: 40px; }
.service-section-heading h2, .service-delivery-grid h2, #related-title { margin: 22px 0; font-size: clamp(32px,3.3vw,46px); }
.service-section-heading p, .service-detail-card p, .service-delivery-grid p, .service-deliverables, .service-contact p { font-size: 15px; line-height: 1.85; color: var(--muted); }
.service-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.service-detail-card { border-top: 1px solid var(--accent); padding-top: 28px; }
.service-detail-card > .mono { display: block; font: 40px/1 var(--display); }
.service-detail-card h3 { font-size: 25px; margin: 28px 0 18px; max-width: 280px; }
.service-detail-card p { margin-bottom: 0; }
.service-delivery-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
.service-deliverables { padding-left: 22px; margin: 28px 0 0; }.service-deliverables li { padding-left: 6px; margin-top: 18px; }.service-deliverables li::marker { color: var(--accent); }
.service-process { border-left: 1px solid var(--line); padding-left: 40px; }
.service-process h3 { font-size: 24px; margin: 0 0 20px; }.service-process h3:not(:first-child) { margin-top: 36px; }
.service-questions { background: var(--accent-soft); border-block: 1px solid var(--line); }
.service-related-links { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 32px; }
.service-related-links a { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 24px 0; font-size: 18px; }
.service-related-links a > span { font-size: 24px; color: var(--accent); }.service-related-links a:hover { color: var(--accent); }
.service-contact { display: flex; justify-content: space-between; align-items: center; gap: 48px; margin-top: 64px; padding: 40px; background: var(--ink); color: var(--on-ink); }
.service-contact h2 { font-size: clamp(30px,3vw,40px); }.service-contact p { max-width: 650px; color: var(--ink-muted); margin: 18px 0 0; }
.service-contact .button { flex-shrink: 0; background: var(--on-ink); border-color: var(--on-ink); color: var(--ink); }.service-contact .button:hover { background: var(--accent-soft); }
@media(max-width:1100px) { .service-intro { gap: 40px; }.service-page h1 { font-size: 58px; }.service-delivery-grid { gap: 40px; }.service-process { padding-left: 30px; }.service-contact { padding: 32px; gap: 28px; }.service-detail-grid { gap: 24px; } }
@media(max-width:800px) {
  .service-intro { grid-template-columns: 1fr; gap: 40px; padding-block: 40px 64px; }.service-page h1 { max-width: 650px; }
  .service-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }.service-summary::before { grid-column: 1; grid-row: 1 / 4; height: 100%; min-height: 220px; margin: 0; }.service-summary > * { grid-column: 2; }
  .service-detail-grid { grid-template-columns: 1fr; gap: 32px; }.service-detail-card { display: grid; grid-template-columns: 70px 1fr; gap: 0 20px; }.service-detail-card > .mono { grid-row: 1 / 3; }.service-detail-card h3 { margin-top: 0; max-width: 100%; }.service-detail-card p { grid-column: 2; }
  .service-delivery-grid { grid-template-columns: 1fr; }.service-process { border-left: 0; border-top: 1px solid var(--line); padding: 32px 0 0; }
  .service-contact { align-items: flex-start; flex-direction: column; }.service-block { padding-block: 64px; }
}
@media(max-width:580px) {
  .service-page h1 { font-size: clamp(44px,11.4vw,64px); }.service-intro { padding-top: 32px; }.service-lead { font-size: 15px; }
  .service-summary { display: block; padding: 20px; }.service-summary::before { height: 210px; min-height: 0; margin-bottom: 24px; }
  .service-detail-card { grid-template-columns: 42px 1fr; gap: 0 16px; }.service-detail-card > .mono { font-size: 30px; }.service-detail-card h3 { font-size: 23px; }
  .service-related-links { grid-template-columns: 1fr; gap: 0; }.service-related-links a + a { border-top: 0; }.service-related-links a { font-size: 17px; }
  .service-contact { padding: 30px 22px; margin-top: 48px; }.service-contact .button { max-width: 100%; }
}