/* JM Digital — service detail pages. Loaded after the homepage design system. */
body.service-page {
  --service-green: #245447;
  --service-gold: #986524;
  --service-board-tint: #edf1e8;
}

/* Keep the six service entrances visible and consistent on the homepage. */
body.home-redesign .service-card { display: flex; flex-direction: column; }
body.home-redesign .service-card .icon-tile { flex-shrink: 0; }
body.home-redesign .service-card__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-top: auto;
  padding-top: 20px;
  color: var(--color-dark);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  text-underline-offset: 4px;
}
body.home-redesign .service-card__link:hover { text-decoration: underline; }

/* A quiet editorial masthead gives the service and its decision equal weight. */
body.service-page .service-breadcrumb { padding: 0; margin-bottom: 34px; }
body.service-page .service-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  padding: 0;
  margin: 0;
  list-style: none;
  color: var(--color-ink-soft);
  font-size: 11.5px;
  line-height: 1.6;
}
body.service-page .service-breadcrumb li { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
body.service-page .service-breadcrumb li + li::before { content: "/"; color: #8a958d; }
body.service-page .service-breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; text-underline-offset: 3px; }
body.service-page .service-breadcrumb a:hover { text-decoration: underline; }
body.service-page .service-breadcrumb [aria-current] { color: var(--color-ink); }
body.service-page .service-hero {
  padding-block: 20px 48px;
  background: radial-gradient(ellipse at 95% 22%, #e6ecdf 0, transparent 54%);
}
body.service-page .service-hero__grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 5vw, 68px); }
body.service-page .service-hero__grid > *,
body.service-page .service-method > *,
body.service-page .service-example > *,
body.service-page .service-faq > *,
body.service-page .service-contact-grid > * { min-width: 0; }
body.service-page .service-hero__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
body.service-page .eyebrow-label { color: var(--service-green); font-size: 11px; line-height: 1.7; letter-spacing: .11em; }
body.service-page .service-title {
  max-width: 680px;
  margin: 0;
  font-size: clamp(40px, 3.75vw, 58px);
  font-weight: 700;
  line-height: 1.09;
  letter-spacing: -.045em;
  text-wrap: balance;
  color: var(--color-dark);
}
body.service-page .service-lede { max-width: 580px; color: var(--color-ink-soft); font-size: 16px; line-height: 1.8; text-wrap: pretty; }
body.service-page .service-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 4px; }
body.service-page .service-actions .btn { white-space: normal; }
body.service-page .service-micro { max-width: 500px; color: var(--color-ink-soft); font-size: 12px; line-height: 1.7; }
body.service-page .service-facts { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 44px; padding-top: 24px; border-top: 1px solid var(--color-line); }
body.service-page .service-facts > span { display: inline-flex; align-items: flex-start; gap: 9px; color: var(--color-ink-soft); font-size: 11.5px; line-height: 1.65; }
body.service-page .service-facts > span::before { content: ""; width: 5px; height: 5px; margin-top: 7px; border-radius: 50%; background: var(--service-gold); flex: 0 0 5px; }
body.service-page .service-jump-links { border-block: 1px solid var(--color-line); background: #fffdf8; }
body.service-page .service-jump-links .container { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 32px; padding-block: 10px; }
body.service-page .service-jump-links a { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-ink-soft); font-size: 12px; font-weight: 600; text-underline-offset: 5px; }
body.service-page .service-jump-links a:hover { color: var(--color-dark); text-decoration: underline; }

/* Decision boards are diagrams of the engagement, not invented performance data. */
body.service-page .decision-board { --board-accent: #245447; margin: 0; min-width: 0; border: 1px solid #cad5ca; border-radius: 20px; background: #fffefa; box-shadow: 0 22px 44px -34px #16392e65, 0 1px 0 #fff inset; }
body.service-page .decision-board[data-kind="roadmap"] { --board-accent: #725521; --service-board-tint: #f2ead8; }
body.service-page .decision-board[data-kind="retail"] { --board-accent: #3b5b5a; --service-board-tint: #eaf0ec; }
body.service-page .decision-board[data-kind="architecture"] { --board-accent: #3d6250; --service-board-tint: #ebf0e5; }
body.service-page .decision-board[data-kind="ai"] { --board-accent: #45594a; --service-board-tint: #eef0e4; }
body.service-page .decision-board[data-kind="data"] { --board-accent: #5a583e; --service-board-tint: #f1eddf; }
body.service-page .decision-board__top { display: flex; flex-direction: column; gap: 9px; padding: 25px 26px 22px; border-bottom: 1px solid var(--color-line); }
body.service-page .decision-board__top small { color: var(--board-accent); font-size: 10px; font-weight: 700; letter-spacing: .1em; line-height: 1.6; text-transform: uppercase; }
body.service-page .decision-board__top strong { max-width: 380px; font-size: 20px; font-weight: 650; letter-spacing: -.025em; line-height: 1.4; color: var(--color-dark); }
body.service-page .decision-board__body { display: grid; gap: 18px; padding: 26px; min-width: 0; }
body.service-page .decision-board__body > * { min-width: 0; }
body.service-page .decision-path { display: flex; flex-wrap: wrap; align-items: stretch; gap: 6px; min-width: 0; }
body.service-page .decision-node { display: flex; flex: 1 1 76px; min-width: 0; flex-direction: column; justify-content: center; gap: 6px; padding: 15px 10px; border: 1px solid #d4ddd2; border-radius: 9px; background: #fff; text-align: center; }
body.service-page .decision-node small { font-size: 9px; line-height: 1.4; font-weight: 600; color: var(--color-ink-soft); }
body.service-page .decision-node strong { font-size: 11px; line-height: 1.55; font-weight: 700; color: var(--color-dark); overflow-wrap: anywhere; }
body.service-page .decision-node--accent { background: #f5e8ce; border-color: #d7b87c; }
body.service-page .decision-node--dark { background: var(--color-dark); border-color: var(--color-dark); }
body.service-page .decision-node--dark :is(small, strong) { color: #fff; }
body.service-page .decision-connector { display: flex; align-items: center; justify-content: center; flex: 0 0 14px; color: #64786b; font-size: 15px; font-weight: 500; }
body.service-page .decision-stack { display: grid; gap: 8px; }
body.service-page .decision-stack > * { display: grid; grid-template-columns: minmax(72px, .7fr) minmax(0, 2.3fr); align-items: center; gap: 10px; padding: 12px 13px; background: var(--service-board-tint); border: 1px solid #d8dfd3; border-radius: 8px; }
body.service-page .decision-stack span { grid-row: span 2; color: var(--board-accent); font-size: 11px; font-weight: 700; line-height: 1.5; }
body.service-page .decision-stack strong { color: var(--color-dark); font-size: 13px; font-weight: 600; line-height: 1.6; }
body.service-page .decision-stack em { grid-column: 2; color: #516356; font-size: 12px; font-style: normal; line-height: 1.5; text-align: left; }
body.service-page .decision-matrix { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 11px; line-height: 1.5; }
body.service-page .decision-matrix caption { position: absolute; width: 1px; height: 1px; padding: 0; clip: rect(0, 0, 0, 0); overflow: hidden; white-space: nowrap; }
body.service-page .decision-matrix :is(th, td) { padding: 12px 8px; border-bottom: 1px solid #dde3d8; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
body.service-page .decision-matrix thead th { font-size: 9px; font-weight: 700; letter-spacing: .015em; background: var(--service-board-tint); color: var(--board-accent); }
body.service-page .decision-matrix th { font-weight: 600; color: var(--color-dark); }
body.service-page .decision-matrix td { color: var(--color-ink-soft); }
body.service-page .decision-checklist { display: grid; gap: 0; }
body.service-page .decision-checklist > * { display: flex; align-items: flex-start; gap: 13px; padding-block: 13px; border-bottom: 1px solid var(--color-line); }
body.service-page .decision-checklist > :first-child { padding-top: 0; }
body.service-page .decision-checklist > :last-child { border-bottom: 0; padding-bottom: 0; }
body.service-page .decision-checklist > * > span { display: flex; align-items: center; justify-content: center; flex: 0 0 25px; height: 25px; border: 1px solid #c9d4c7; border-radius: 7px; background: var(--service-board-tint); color: var(--board-accent); font-size: 10px; font-weight: 700; }
body.service-page .decision-checklist > * > div { min-width: 0; display: grid; gap: 3px; }
body.service-page .decision-checklist strong { color: var(--color-dark); font-size: 13px; line-height: 1.55; font-weight: 600; }
body.service-page .decision-checklist small { color: var(--color-ink-soft); font-size: 12px; line-height: 1.7; }
body.service-page .decision-pills { display: flex; flex-wrap: wrap; gap: 7px; }
body.service-page .decision-pills span { display: inline-flex; align-items: center; min-height: 28px; padding: 5px 9px; border: 1px solid #d1dccd; border-radius: 20px; background: var(--service-board-tint); color: var(--board-accent); font-size: 10px; font-weight: 600; line-height: 1.5; }
body.service-page .decision-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
body.service-page .decision-split > * { min-width: 0; }
body.service-page .decision-gate { display: flex; align-items: center; justify-content: center; padding: 10px 12px; border: 1px dashed #b69a61; border-radius: 7px; background: #faf1df; color: #79531d; font-size: 10px; font-weight: 700; line-height: 1.6; text-align: center; }
body.service-page .decision-outcome { display: grid; gap: 5px; padding: 16px 18px; background: var(--color-dark); border-radius: 9px; }
body.service-page .decision-outcome strong { color: #fff; font-size: 12px; font-weight: 650; line-height: 1.55; }
body.service-page .decision-outcome span { color: #c8d7ce; font-size: 10px; line-height: 1.7; }
body.service-page .decision-board__foot { margin: 0; padding: 14px 26px; border-top: 1px solid var(--color-line); color: var(--color-ink-soft); font-size: 9.5px; line-height: 1.7; }

/* Open page sections alternate between evidence, method and tangible outputs. */
body.service-page .service-section { padding-block: clamp(60px, 7vw, 96px); }
body.service-page .service-section--alt { background: var(--color-bg-alt); }
body.service-page .service-section--dark { background: var(--color-dark); color: #fff; }
body.service-page .service-section-heading { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; max-width: 720px; margin: 0 0 36px; }
body.service-page .service-section-heading h2,
body.service-page .service-example h2,
body.service-page .service-contact h2 { color: var(--color-dark); font-size: clamp(28px, 2.8vw, 39px); line-height: 1.22; letter-spacing: -.035em; text-wrap: balance; }
body.service-page .service-section-heading p { max-width: 620px; color: var(--color-ink-soft); font-size: 14px; line-height: 1.85; }
body.service-page .service-signals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; }
body.service-page .service-signal { min-width: 0; padding-top: 24px; border-top: 1px solid #bccbbd; }
body.service-page .service-number { display: block; margin-bottom: 17px; color: var(--service-gold); font-size: 11px; font-weight: 700; letter-spacing: .04em; line-height: 1.5; }
body.service-page .service-signal h3 { margin: 0 0 11px; color: var(--color-dark); font-size: 18px; font-weight: 650; line-height: 1.5; letter-spacing: -.02em; }
body.service-page .service-signal p { color: var(--color-ink-soft); font-size: 13px; line-height: 1.85; }
body.service-page .service-method { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(40px, 7vw, 96px); align-items: start; }
body.service-page .service-method .service-section-heading { margin-bottom: 0; max-width: 380px; }
body.service-page .service-steps { display: grid; gap: 0; padding: 0; margin: 0; list-style: none; }
body.service-page .service-steps > li { display: grid; grid-template-columns: 35px minmax(0, 1fr); gap: 20px; padding: 25px 0; border-bottom: 1px solid var(--color-line); }
body.service-page .service-steps > li:first-child { padding-top: 0; }
body.service-page .service-steps > li:last-child { border-bottom: 0; padding-bottom: 0; }
body.service-page .service-step-number { display: flex; align-items: center; justify-content: center; width: 35px; height: 35px; border: 1px solid #c6d1c5; border-radius: 50%; background: #edf1e8; color: var(--color-dark); font-size: 11px; font-weight: 700; }
body.service-page .service-steps h3 { margin: 3px 0 8px; color: var(--color-dark); font-size: 17px; font-weight: 650; line-height: 1.5; letter-spacing: -.015em; }
body.service-page .service-steps p { color: var(--color-ink-soft); font-size: 13px; line-height: 1.85; }
body.service-page .service-section--dark .eyebrow-label { color: #e5b565; }
body.service-page .service-section--dark :is(h2, h3) { color: #fff; }
body.service-page .service-section--dark .service-section-heading p { color: #bfd0c6; }
body.service-page .service-deliverables { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 60px; }
body.service-page .service-deliverables article { min-width: 0; display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: start; gap: 16px; padding: 28px 0; border-top: 1px solid #c3d0be; }
body.service-page .service-deliverables .service-number { color: var(--service-gold); margin: 4px 0 0; }
body.service-page .service-deliverables h3 { margin: 0 0 9px; color: var(--color-dark); font-size: 17px; font-weight: 600; line-height: 1.5; letter-spacing: -.015em; }
body.service-page .service-deliverables p { max-width: 450px; color: var(--color-ink-soft); font-size: 13px; line-height: 1.85; }
body.service-page .service-section--dark .service-deliverables article { border-color: #4b6859; }
body.service-page .service-section--dark .service-deliverables .service-number { color: #e5b565; }
body.service-page .service-section--dark .service-deliverables h3 { color: #fff; }
body.service-page .service-section--dark .service-deliverables p { color: #bfd0c6; }
body.service-page .service-example { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 7vw, 88px); align-items: start; }
body.service-page .service-example > div:first-child { display: flex; flex-direction: column; align-items: flex-start; gap: 17px; }
body.service-page .service-example > div:first-child > p:not(.eyebrow-label) { color: var(--color-ink-soft); font-size: 14px; line-height: 1.85; }
body.service-page .service-section--dark .service-example > div:first-child > p:not(.eyebrow-label) { color: #c3d3c8; }
body.service-page .service-section--dark .service-example h2 { color: #fff; }
body.service-page .service-example__checks { padding: 30px; background: #ebeedd; border: 1px solid #cfd7c5; border-radius: 14px; }
body.service-page .service-example__checks h3 { margin: 0 0 18px; color: var(--color-dark); font-size: 17px; font-weight: 650; line-height: 1.5; letter-spacing: -.015em; }
body.service-page .service-example__checks ul { display: grid; gap: 15px; padding: 0; margin: 0; list-style: none; }
body.service-page .service-example__checks li { position: relative; padding-left: 20px; color: #41584a; font-size: 13px; line-height: 1.8; }
body.service-page .service-example__checks li::before { content: ""; position: absolute; left: 0; top: .65em; width: 6px; height: 6px; border: 1px solid #677e58; border-radius: 50%; }
body.service-page .service-example__decision { margin-top: 23px; padding-top: 20px; border-top: 1px solid #c4cfb8; color: var(--color-dark); font-size: 13px; font-weight: 650; line-height: 1.8; }
body.service-page .service-related-case { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px; margin: 0; padding: 30px 32px; border-left: 3px solid #c29648; background: #fffefa; }
body.service-page .service-related-case > div { min-width: 0; display: grid; gap: 12px; }
body.service-page .service-related-case > .btn { white-space: normal; }
body.service-page .service-related-case > :is(span, label) { color: var(--service-gold); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; line-height: 1.6; }
body.service-page .service-related-case h3 { margin: 0; max-width: 800px; color: var(--color-dark); font-size: 20px; font-weight: 650; line-height: 1.5; letter-spacing: -.02em; }
body.service-page .service-related-case p { max-width: 860px; color: var(--color-ink-soft); font-size: 13px; line-height: 1.85; }
body.service-page .service-related-case .link-arrow { justify-self: start; min-height: 44px; margin-top: 2px; color: var(--color-dark); font-size: 12px; }
body.service-page .link-arrow:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Open questions and a working contact form keep the final decision practical. */
body.service-page .service-faq { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(32px, 7vw, 96px); }
body.service-page .service-faq .service-section-heading { margin-bottom: 0; }
body.service-page .service-faq__list { border-top: 1px solid #cbd6ca; }
body.service-page .service-faq details { padding: 0; border-bottom: 1px solid #cbd6ca; }
body.service-page .service-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 64px; padding: 18px 0; color: var(--color-dark); font-size: 14px; font-weight: 650; line-height: 1.65; list-style: none; cursor: pointer; }
body.service-page .service-faq summary::-webkit-details-marker { display: none; }
body.service-page .service-faq summary > span[aria-hidden="true"] { display: none; }
body.service-page .service-faq summary::after { content: "+"; width: 22px; flex: 0 0 22px; color: var(--service-green); font-size: 21px; font-weight: 400; text-align: center; }
body.service-page .service-faq details[open] summary::after { content: "−"; }
body.service-page .service-faq summary:focus-visible { outline: 3px solid #246d5a; outline-offset: 4px; border-radius: 3px; }
body.service-page .service-faq details > p { padding: 0 34px 22px 0; color: var(--color-ink-soft); font-size: 13px; line-height: 1.9; }
body.service-page .service-contact { background: #eeeede; border-top: 1px solid #dadfcf; }
body.service-page .service-contact-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: clamp(32px, 7vw, 88px); }
body.service-page .service-contact-grid > div:first-child { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding-top: 15px; }
body.service-page .service-contact-grid > div:first-child > p { color: var(--color-ink-soft); font-size: 14px; line-height: 1.85; }
body.service-page .service-contact-grid > div:first-child > .eyebrow-label { color: var(--service-green); font-size: 11px; }
body.service-page .service-contact-grid > div:first-child > ul { display: grid; gap: 12px; margin: 0; padding-left: 19px; color: #41584a; font-size: 13px; line-height: 1.8; }
body.service-page .service-contact-grid .service-section-heading { margin: 0; }
body.service-page .service-contact .homepage-contact-form { gap: 18px; box-shadow: 0 18px 42px -38px #16392e80; }
body.service-page .service-contact .field { display: grid; gap: 7px; margin: 0; min-width: 0; }
body.service-page .service-contact textarea { font-family: inherit; font-size: 16px; resize: vertical; }
body.service-page .service-contact .form-note { color: var(--color-ink-soft); }
body.service-page .service-contact .form-note a { text-decoration: underline; text-underline-offset: 3px; }
body.service-page .service-contact-note { display: grid; gap: 10px; margin-top: 6px; padding-top: 24px; border-top: 1px solid #cbd3bf; }
body.service-page .service-contact-note strong { color: var(--color-dark); font-size: 13px; line-height: 1.7; }
body.service-page .service-contact-note p { color: var(--color-ink-soft); font-size: 12px; line-height: 1.85; }
body.service-page .service-contact-note .link-arrow { min-height: 44px; font-size: 12px; }
body.service-page .service-form-note { color: var(--color-ink-soft); font-size: 11.5px; line-height: 1.75; }
body.service-page .service-related-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
body.service-page .service-related-links > a { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: 13px; padding: 27px 28px; border: 1px solid #cfd8ca; border-radius: 13px; background: #fffefa; transition: border-color .18s ease, box-shadow .18s ease; }
body.service-page .service-related-links > a:hover { border-color: #829a80; box-shadow: 0 15px 32px -28px #16392e80; }
body.service-page .service-related-links > a > span:first-child { color: var(--service-gold); font-size: 10px; font-weight: 700; letter-spacing: .08em; line-height: 1.6; text-transform: uppercase; }
body.service-page .service-related-links h3 { margin: 0; color: var(--color-dark); font-size: 21px; font-weight: 650; letter-spacing: -.025em; line-height: 1.4; }
body.service-page .service-related-links p { margin-bottom: 6px; color: var(--color-ink-soft); font-size: 13px; line-height: 1.8; }
body.service-page .service-related-links .link-arrow { margin-top: auto; color: var(--color-dark); font-size: 12px; }
body.service-page .service-directory { margin: 0; padding-block: 28px 36px; border-top: 1px solid var(--color-line); background: var(--color-bg); }
body.service-page .service-directory .eyebrow-label { display: block; margin-bottom: 15px; }
body.service-page .service-directory > p { margin-bottom: 16px; color: var(--color-ink-soft); font-size: 11px; font-weight: 700; line-height: 1.7; }
body.service-page .service-directory__links { display: flex; flex-wrap: wrap; gap: 8px; }
body.service-page .service-directory__links a { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; padding: 9px 15px; border: 1px solid #d1d9cc; border-radius: 24px; color: var(--color-ink-soft); font-size: 11px; font-weight: 600; line-height: 1.7; }
body.service-page .service-directory__links a:hover { border-color: var(--color-dark); color: var(--color-dark); }
body.service-page .service-directory__links a[aria-current="page"] { background: var(--color-dark); border-color: var(--color-dark); color: #fff; }
body.service-page .service-section--dark :is(a, button, summary):focus-visible { outline-color: #f0bd69; }

/* Layout changes happen before a decision board or line of copy feels cramped. */
@media (max-width: 1020px) {
  body.service-page .service-hero__grid { gap: 30px; }
  body.service-page .service-title { font-size: clamp(38px, 4.7vw, 48px); }
  body.service-page .decision-board__top,
  body.service-page .decision-board__body { padding: 22px; }
  body.service-page .decision-board__foot { padding-inline: 22px; }
  body.service-page .decision-stack > * { grid-template-columns: minmax(52px, .65fr) minmax(0, 1.35fr); }
  body.service-page .decision-stack em { grid-column: 2; text-align: left; }
  body.service-page .service-signals { gap: 24px; }
  body.service-page .service-deliverables { column-gap: 36px; }
}
@media (max-width: 820px) {
  body.service-page .service-hero { padding-block: 28px 40px; }
  body.service-page .service-hero__grid { grid-template-columns: minmax(0, 1fr); gap: 38px; }
  body.service-page .service-hero__copy { max-width: 680px; }
  body.service-page .service-title { max-width: 660px; font-size: clamp(36px, 6vw, 48px); }
  body.service-page .decision-board { width: 100%; max-width: 610px; }
  body.service-page .decision-board__body { padding: 26px; }
  body.service-page .decision-stack > * { grid-template-columns: minmax(64px, .7fr) minmax(0, 2.3fr); }
  body.service-page .decision-stack em { grid-column: 2; text-align: left; }
  body.service-page .service-facts { margin-top: 34px; gap: 12px 23px; }
  body.service-page .service-method,
  body.service-page .service-example,
  body.service-page .service-faq,
  body.service-page .service-contact-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  body.service-page .service-method .service-section-heading { max-width: 620px; }
  body.service-page .service-contact-grid .homepage-contact-form { max-width: 680px; width: 100%; }
  body.service-page .service-contact-grid > div:first-child { padding-top: 0; }
}
@media (max-width: 620px) {
  body.service-page .service-breadcrumb { margin-bottom: 28px; }
  body.service-page .service-breadcrumb ol { font-size: 10px; gap: 2px 8px; }
  body.service-page .service-breadcrumb li { gap: 8px; }
  body.service-page .service-hero__copy { gap: 19px; }
  body.service-page .service-title { font-size: 37px; line-height: 1.13; letter-spacing: -.04em; }
  body.service-page .service-lede { font-size: 15px; line-height: 1.8; }
  body.service-page .service-section { padding-block: 58px; }
  body.service-page .service-section-heading { gap: 13px; margin-bottom: 28px; }
  body.service-page .service-section-heading h2,
  body.service-page .service-example h2,
  body.service-page .service-contact h2 { font-size: 29px; line-height: 1.28; }
  body.service-page .service-signals,
  body.service-page .service-deliverables,
  body.service-page .service-related-links { grid-template-columns: minmax(0, 1fr); }
  body.service-page .service-signals { gap: 25px; }
  body.service-page .service-signal { padding-top: 20px; }
  body.service-page .service-signal h3 { font-size: 18px; }
  body.service-page .service-number { margin-bottom: 12px; }
  body.service-page .service-jump-links .container { gap: 0 25px; }
  body.service-page .service-jump-links a { font-size: 11px; }
  body.service-page .service-steps > li { gap: 15px; }
  body.service-page .service-deliverables article { padding-block: 24px; }
  body.service-page .service-example__checks { padding: 24px; }
  body.service-page .service-related-case { grid-template-columns: minmax(0, 1fr); padding: 22px 24px; }
  body.service-page .service-related-case > .btn { justify-self: start; }
  body.service-page .service-related-case h3 { font-size: 19px; }
  body.service-page .service-related-links > a { padding: 24px; }
  body.service-page .service-related-links h3 { font-size: 20px; }
  body.service-page .service-faq summary { font-size: 13px; }
  body.service-page .service-directory__links a { padding-inline: 12px; font-size: 10px; }
}
@media (max-width: 420px) {
  body.service-page .service-title { font-size: 35px; }
  body.service-page .service-actions { width: 100%; flex-direction: column; align-items: stretch; }
  body.service-page .service-actions .btn { width: 100%; }
  body.service-page .service-facts { flex-direction: column; gap: 11px; }
  body.service-page .decision-board { border-radius: 15px; }
  body.service-page .decision-board__top { padding: 21px 18px 18px; }
  body.service-page .decision-board__top strong { font-size: 18px; }
  body.service-page .decision-board__body { padding: 20px 18px; gap: 16px; }
  body.service-page .decision-board__foot { padding-inline: 18px; }
  body.service-page .decision-path { display: grid; grid-template-columns: minmax(0, 1fr); gap: 5px; }
  body.service-page .decision-node { min-height: 64px; padding: 11px 13px; text-align: left; }
  body.service-page .decision-node strong { font-size: 12px; }
  body.service-page .decision-connector { min-height: 16px; line-height: 1; transform: rotate(90deg); }
  body.service-page .decision-stack > * { grid-template-columns: minmax(50px, .7fr) minmax(0, 1.3fr); padding: 10px; }
  body.service-page .decision-stack em { grid-column: 2; text-align: left; }
  body.service-page .decision-matrix { font-size: 10px; }
  body.service-page .decision-matrix :is(th, td) { padding: 10px 5px; }
  body.service-page .decision-matrix thead th { font-size: 8.5px; }
  body.service-page .decision-split { gap: 8px; }
  body.service-page .decision-split .decision-node { padding: 10px; }
  body.service-page .decision-split .decision-node strong { font-size: 10px; }
  body.service-page .service-jump-links .container { gap: 0 20px; }
  body.service-page .service-contact .homepage-contact-form { padding: 24px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  body.service-page .service-related-links > a { transition: none; }
}
