.crown-locations {
  display: grid;
  gap: 3rem; }
  @media (min-width: 55em) {
    .crown-locations {
      flex-direction: row;
      grid-template-columns: 1fr 1fr;
      gap: 9.25rem; } }
  .crown-locations details {
    position: relative;
    padding: 0.25rem 0;
    margin: 0 0 1.5rem;
    border: 2px solid var(--wp--preset--color--blue);
    border-radius: 0.25rem; }
    .crown-locations details summary {
      position: relative;
      padding: 1.5rem 4.5rem 1.5rem 2.5rem;
      cursor: pointer;
      color: var(--wp--preset--color--blue); }
      .crown-locations details summary .region {
        font-size: 1.5rem;
        font-weight: 600;
        display: block; }
      .crown-locations details summary .locations {
        font-size: 1.125rem;
        font-weight: 500;
        display: block; }
      @media (min-width: 55em) {
        .crown-locations details summary {
          font-size: 1.5rem;
          padding: 1.75rem 5.5rem 1.75rem 2.5rem; } }
      .crown-locations details summary:after {
        position: absolute;
        right: 2.5rem;
        top: 2.5rem;
        content: '';
        display: block;
        background-image: url("../img/chevron-down.svg");
        background-repeat: no-repeat;
        background-origin: center;
        transform: rotate(0);
        width: 28px;
        height: 16px;
        transition: transform 300ms ease; }
      .crown-locations details summary::marker, .crown-locations details summary::-webkit-details-marker {
        display: none;
        content: ''; }
    .crown-locations details div.response {
      padding: 1.5rem 2.5rem 2rem 2.5rem;
      position: relative; }
      .crown-locations details div.response:before {
        height: 2px;
        background: var(--wp--preset--color--blue);
        width: 4rem;
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 2.5rem; }
      .crown-locations details div.response hr {
        height: 2px;
        border: none;
        background: var(--wp--preset--color--blue);
        margin: 2rem 0; }
      .crown-locations details div.response p {
        margin-bottom: 1rem; }
        .crown-locations details div.response p.section-label {
          font-weight: 600;
          font-size: 1.125rem; }
      .crown-locations details div.response .phone-numbers {
        list-style: none;
        margin: 0;
        padding: 0; }
        .crown-locations details div.response .phone-numbers li:not(:last-child) {
          padding-bottom: 0.75rem;
          margin-bottom: 0.75rem;
          border-bottom: 1px dashed; }
      .crown-locations details div.response .general-managers {
        list-style: none;
        margin: 0;
        padding: 0; }
        .crown-locations details div.response .general-managers li:not(:last-child) {
          margin-bottom: 1.5rem; }
        .crown-locations details div.response .general-managers li .image {
          background-color: #d9d9d9;
          border-radius: 0.25rem;
          border: 2px solid var(--wp--preset--color--blue);
          overflow: hidden;
          margin-bottom: 0.75rem;
          width: 124px;
          height: 124px; }
          .crown-locations details div.response .general-managers li .image img {
            width: 100%;
            height: 100%;
            object-fit: cover; }
        .crown-locations details div.response .general-managers li .name {
          margin: 0;
          font-weight: 600; }
        .crown-locations details div.response .general-managers li .title {
          margin: 0; }
        .crown-locations details div.response .general-managers li .meta {
          margin: 0.5rem 0 0; }
          .crown-locations details div.response .general-managers li .meta a {
            display: inline-block;
            margin-right: 0.5rem;
            width: 28px;
            height: 28px;
            text-indent: -99999px;
            background-repeat: no-repeat;
            background-size: 100% 100%; }
            .crown-locations details div.response .general-managers li .meta a.email {
              background-image: url("../img/email.png"); }
            .crown-locations details div.response .general-managers li .meta a.phone {
              background-image: url("../img/phone.png"); }
    .crown-locations details[open] summary:after {
      transform: rotate(-180deg); }
  .crown-locations .map {
    background-size: cover;
    width: 100%;
    position: relative;
    z-index: 0; }
    .crown-locations .map.georgia {
      background-image: url("../img/georgia.svg");
      aspect-ratio: 578 / 675; }
    .crown-locations .map.alabama {
      background-image: url("../img/alabama.svg");
      aspect-ratio: 414 / 675; }
    .crown-locations .map.tennessee {
      background-image: url("../img/tennessee.svg");
      aspect-ratio: 637 / 220; }
    .crown-locations .map button {
      width: 22px;
      height: 22px;
      cursor: pointer;
      border-radius: 50%;
      background: var(--wp--preset--color--gold);
      border: none;
      margin: 0;
      padding: 0;
      appearance: none;
      text-indent: -999999px;
      position: relative;
      box-shadow: 0 0 0 0 rgba(247, 192, 36, 0.25);
      animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
      animation-duration: 2000ms;
      animation-iteration-count: infinite;
      transition: all 200ms ease;
      transform: translate(-50%, -50%);
      position: absolute; }
      .crown-locations .map button.active {
        animation-name: pulse; }

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(247, 192, 36, 0.25); }
  80% {
    box-shadow: 0 0 0 6px rgba(247, 192, 36, 0.25); }
  100% {
    box-shadow: 0 0 0 8px rgba(247, 192, 36, 0); } }
