/* Page-local small-screen layout for the approved service content. */
@media (max-width:760px) {
  .b-service-design :is(section,[id]) {
    scroll-margin-top:84px;
  }

  .b-service-design .b-benefit {
    grid-template-columns:minmax(0,1fr);
    gap:14px;
    padding:24px 20px;
  }

  .b-service-design :is(.b-roles,.b-operation,.b-start) {
    margin-top:32px;
  }

  .b-service-design :is(.b-roles,.b-operation,.b-start) > h3 {
    margin-bottom:20px;
  }

  .b-service-design .b-roles-grid {
    grid-template-columns:minmax(0,1fr);
  }

  .b-service-design .b-role-column,
  .b-service-design .b-role-column:first-child,
  .b-service-design .b-role-column:last-child {
    padding:24px 0;
  }

  .b-service-design .b-role-column:last-child {
    border-left:0;
    border-top:1px solid var(--line);
  }

  .b-service-design .flow-pattern-c .b-operation-map {
    padding:12px;
  }

  .b-service-design .flow-pattern-c .b-monthly {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    align-items:center;
    gap:16px 12px;
    padding:22px 16px;
  }

  .b-service-design .flow-pattern-c .b-monthly > div {
    display:contents;
  }

  .b-service-design .b-monthly > .flow-icon {
    width:34px;
    height:34px;
  }

  .b-service-design .b-monthly h4 {
    grid-column:2;
    min-width:0;
  }

  .b-service-design .b-monthly p {
    grid-column:1 / -1;
    min-width:0;
  }

  .b-service-design .flow-pattern-c .b-feedback {
    flex-direction:column;
    gap:14px;
    padding:20px 4px;
  }

  .b-service-design .b-feedback p {
    align-items:flex-start;
    gap:10px;
    min-width:0;
  }

  .b-service-design .b-feedback-arrow {
    width:24px;
    height:24px;
    margin-top:3px;
  }

  .b-service-design .flow-pattern-c .b-episode-flow > header {
    margin-inline:16px;
    padding:22px 0 18px;
  }

  .b-service-design .flow-pattern-c .b-episode-steps {
    grid-template-columns:minmax(0,1fr);
    gap:0;
    padding:4px 16px 8px;
  }

  .b-service-design .b-episode-steps > li {
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:6px 12px;
    padding:20px 0;
  }

  .b-service-design .b-episode-steps > li + li {
    border-top:1px solid var(--line);
  }

  .b-service-design .b-episode-steps .flow-icon {
    grid-column:1;
    grid-row:1 / 3;
    margin:0;
  }

  .b-service-design .b-episode-steps .b-step-heading {
    grid-column:2;
    grid-row:1;
    align-items:baseline;
    min-height:0;
    min-width:0;
  }

  .b-service-design .b-episode-steps .step-no {
    flex:none;
  }

  .b-service-design .b-episode-steps h4 {
    min-width:0;
    white-space:normal;
    text-wrap:pretty;
  }

  .b-service-design .b-episode-steps p {
    grid-column:2;
    grid-row:2;
    margin:0;
  }

  .b-service-design .b-start .flow-row {
    grid-template-columns:38px minmax(0,1fr);
    gap:14px;
    padding:22px 0;
  }

  .b-service-design .b-start .flow-row > div {
    min-width:0;
  }

  .podcast-support-page #consult h2 {
    text-shadow:none;
    -webkit-text-stroke:0;
  }

  .podcast-support-page #consult h2 > span {
    display:block;
  }

  .podcast-support-page #consult .service-closing__action {
    width:100%;
    max-width:320px;
    margin-inline:auto;
    align-items:center;
  }

  .podcast-support-page #consult .service-closing__button {
    width:100%;
    min-width:0;
    min-height:48px;
    gap:14px;
    padding:14px 20px;
  }

  .podcast-support-page #consult .package-disclaimer {
    --os8-type-body:12px;
    width:100%;
    margin:12px 0 0;
    padding:0;
    font-size:12px;
    line-height:1.7;
    text-align:center;
  }
}

/* Keep the five-column flow readable before the approved desktop width. */
@media (min-width:761px) and (max-width:980px) {
  .b-service-design .b-episode-steps .b-step-heading {
    align-items:baseline;
    min-width:0;
    min-height:3.1em;
  }

  .b-service-design .b-episode-steps .step-no {
    flex:none;
  }

  .b-service-design .b-episode-steps h4 {
    min-width:0;
    white-space:normal;
    text-wrap:balance;
  }
}