.crown-collapse-sections {
  list-style: none;
  margin: 0 auto;
  max-width: 1216px;
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column; }
  @media (min-width: 55em) {
    .crown-collapse-sections {
      flex-direction: row;
      flex-wrap: nowrap; } }
  .crown-collapse-sections > li {
    border: 1px solid var(--wp--preset--color--blue);
    background: var(--wp--preset--color--light-blue);
    margin: 0;
    border-radius: 0.25rem;
    color: var(--wp--preset--color--blue); }
    .crown-collapse-sections > li.top-text {
      padding: 2rem;
      font-size: 1.5rem;
      font-weight: 600; }
      @media (min-width: 55em) {
        .crown-collapse-sections > li.top-text {
          display: none; } }
    @media (min-width: 55em) {
      .crown-collapse-sections > li {
        height: 683px;
        border-width: 1px 0 1px 1px; }
        .crown-collapse-sections > li:last-child {
          border-right-width: 1px; }
        .crown-collapse-sections > li:not(.open) {
          max-width: 186px;
          flex-basis: 186px; }
        .crown-collapse-sections > li.open {
          flex-grow: 1; } }
    .crown-collapse-sections > li .top-text {
      display: none; }
    .crown-collapse-sections > li .title {
      position: relative; }
      @media (min-width: 55em) {
        .crown-collapse-sections > li .title {
          height: 683px;
          width: 186px; } }
      .crown-collapse-sections > li .title button {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        padding: 0;
        margin: 0;
        background: transparent;
        border: none;
        box-shadow: none;
        appearance: none;
        cursor: pointer;
        z-index: 10; }
      .crown-collapse-sections > li .title p {
        font-size: 1.125rem;
        font-weight: 600;
        margin: 0;
        padding: 2rem 2rem 2rem 6.375rem;
        position: relative; }
        .crown-collapse-sections > li .title p .number {
          position: absolute;
          top: calc(50% - 25px);
          left: 2rem;
          width: 50px;
          height: 50px;
          background: var(--wp--preset--color--blue);
          border-radius: 25px;
          line-height: 50px;
          text-align: center;
          font-size: 1.5rem;
          color: var(--wp--preset--color--gold); }
          @media (min-width: 55em) {
            .crown-collapse-sections > li .title p .number {
              left: 5.5rem; } }
        @media (min-width: 55em) {
          .crown-collapse-sections > li .title p {
            font-size: 1.5rem;
            width: 683px;
            height: 186px;
            transform-origin: top left;
            transform: translateY(683px) rotate(-90deg);
            text-overflow: ellipsis;
            overflow: hidden;
            padding: 0 1rem 0 6.375rem;
            padding: 0 2rem 0 10rem;
            line-height: 186px; } }
    .crown-collapse-sections > li .content {
      overflow: hidden;
      max-height: 0;
      transition: max-height 300ms ease; }
      .crown-collapse-sections > li .content .content-in {
        padding: 0 2rem 3rem; }
        @media (min-width: 55em) {
          .crown-collapse-sections > li .content .content-in {
            padding: 0 3rem 3rem; } }
        .crown-collapse-sections > li .content .content-in p {
          max-width: 42rem; }
    .crown-collapse-sections > li .wp-element-button {
      display: inline-block;
      background: var(--wp--preset--color--blue);
      color: var(--wp--preset--color--light-blue); }
      .crown-collapse-sections > li .wp-element-button:focus, .crown-collapse-sections > li .wp-element-button:hover {
        background: var(--wp--preset--color--blue) !important;
        color: var(--wp--preset--color--gold) !important; }
      .crown-collapse-sections > li .wp-element-button:active {
        background: #01065A !important;
        color: var(--wp--preset--color--gold) !important; }
    .crown-collapse-sections > li.open .top-text {
      font-size: 3.5rem;
      font-weight: 600;
      line-height: 1;
      text-transform: uppercase;
      padding: 5.5rem 3rem 3.5rem;
      margin: 0; }
      @media (min-width: 55em) {
        .crown-collapse-sections > li.open .top-text {
          display: block; } }
    @media (min-width: 55em) {
      .crown-collapse-sections > li.open .title {
        width: 100%;
        height: auto; } }
    @media (min-width: 55em) {
      .crown-collapse-sections > li.open .title p {
        transform: translateX(0) rotate(0);
        line-height: 1.125;
        height: auto;
        width: 100%;
        padding: 0 3rem 1rem; }
        .crown-collapse-sections > li.open .title p .number {
          display: block;
          position: relative;
          left: auto;
          margin-bottom: 1rem; } }
    .crown-collapse-sections > li.open .title button:after {
      transform: rotate(-180deg); }
    .crown-collapse-sections > li.open .content {
      max-height: 100rem;
      display: block; }
