/* Restore the compact accordion using the established studio layout. */
.studio .service { border: 0; }
.studio .service__head { min-height: 56px; padding: 12px 0; align-items: center; touch-action: manipulation; }
.studio .service__title { min-width: 0; }
@media (min-width: 901px) {
  .studio .services__head {
    padding: 0;
    align-self: start;
    display: flex;
    align-items: center;
    min-height: max(56px, calc(clamp(22px, 2vw, 29px) * 1.24 + 24px));
  }
  .studio .services__head .eyebrow { margin: 0; }
}
.studio .service__plus {
  position: relative;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  transform: rotate(0deg);
  transition: transform .45s cubic-bezier(.22,1,.36,1), color .3s var(--ease);
}
.studio .service__plus::before,
.studio .service__plus::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 1.5px;
  background: currentColor;
  transform: translate(-50%,-50%);
}
.studio .service__plus::after {
  transform: translate(-50%,-50%) rotate(90deg);
}
.studio .service__head[aria-expanded="true"] .service__plus { transform: rotate(135deg); }
.studio .service__panel { transition-duration: .35s; }
.studio .service__desc { transform: translateY(4px); transition-duration: .3s; }
.studio .service__head[aria-expanded="true"] + .service__panel > .service__desc { transform: none; }
@media (max-width: 600px) {
  .studio .service__head { min-height: 48px; padding: 10px 0; }
  .studio .service__plus { width: 20px; height: 20px; flex-basis: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .studio .service__panel,
  .studio .service__desc,
  .studio .service__plus,
  .studio .service__plus::after { transition: none; }
  .studio .service__plus::after { transform: translate(-50%,-50%) rotate(90deg); }
}