htmlを編集できないカートシステムでログイン画面の要素の順番を変えたい

前提

レンタルカートシステムのログイン画面で、<section></section>で囲まれた要素の順番を変えたいのですが、htmlの編集はできずcssだけ利用できます。どのようにすれば良いでしょうか。

実現したいこと

section class="__heading"
section class="__input"
section class="__submit"
section class="__menu p-menu-login"
section class="__to-order"

上記の並びを下記に変更したい。

section class="__heading"
section class="__to-order"
section class="__input"
section class="__submit"
section class="__menu p-menu-login"

該当のソースコード

html
<div class="wrapper wrapper--column-1 wrapper--login wrapper--login-default">
  <div class="__inner">
    <div class="main main--login main--login-default" role="main">
      <section class="__heading">
        <h1 class="__h1 c-h1"><span>ログイン</span></h1>
      </section>
      <form
        method="POST"
        action=""
        accept-charset="UTF-8"
        class="__form c-form"
        id="login-form"
      >
        <input name="_token" type="hidden" value="" />
        <section class="__input">
          <table class="__table p-form-table">
            <tbody>
              <tr class="__row-email">
                <th>
                  メールアドレス
                </th>
                <td>
                  <input
                    class="textfield width-l"
                    name="loginEmail"
                    type="text"
                  />
                </td>
              </tr>
              <tr class="__row-password">
                <th>パスワード</th>
                <td>
                  <input
                    class="textfield width-l"
                    name="loginPassword"
                    type="password"
                    value=""
                  />
                </td>
              </tr>
            </tbody>
          </table>
          <div class="__remember">
            <label
              ><input
                class="__check"
                name="remember"
                type="checkbox"
                value="1"
              />
              ログイン状態を保存する</label
            >
          </div>
        </section>

        <section class="__submit">
          <input
            name="login"
            class="__button c-button-submit"
            type="submit"
            value="ログイン"
          />
        </section>
      </form>
      <section class="__menu p-menu-login">
        <ul>
          <li class="__item __item--regist">
            <a href="">新規会員登録</a>
          </li>
          <li class="__item __item--password">
            <a href="">パスワードをお忘れの方</a>
          </li>
        </ul>
      </section>
      <section class="__to-order">
        <a href="" class="__link c-button-submit">注文手続きへ</a>
      </section>
    </div>
  </div>
</div>

試したこと

flexboxを使ってorderで順番を変更できるかと思いましたができませんでした。

css
.wrapper--login .__inner{
  display: flex;
  flex-wrap: wrap;
}
.wrapper--login .__inner section.__heading {
  order: 1;
}
.wrapper--login .__inner section.__to-order {
  order: 2;
}