/* Sticky mobile call bar. Ported verbatim from StickyCallBar.astro. */
.callbar {
    display: none;
  }

  @media (max-width: 68rem) {
    .callbar {
      position: fixed;
      inset-inline: 0;
      inset-block-end: 0;
      z-index: 90;
      display: grid;
      grid-template-columns: auto 1fr;
      align-items: stretch;
      background: var(--msc-green-deep);
      border-block-start: 1px solid var(--msc-hairline);
      padding: var(--msc-space-xs);
      gap: var(--msc-space-xs);
      padding-block-end: max(var(--msc-space-xs), env(safe-area-inset-bottom));
    }

    .callbar__call,
    .callbar__quote {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-height: 48px;
      padding: 0 var(--msc-space-md);
      border-radius: var(--msc-radius);
      font-size: var(--msc-size-button);
      font-weight: 600;
      text-decoration: none;
    }

    .callbar__call {
      color: var(--msc-white);
      border: 1px solid var(--msc-hairline);
    }

    .callbar--call-only {
      grid-template-columns: 1fr;
    }

    .callbar--call-only .callbar__call {
      background: var(--msc-red);
      border-color: var(--msc-red);
    }

    /* The number itself must stay readable in the call-only state, so the
       small-screen label collapse does not apply there. */
    .callbar--call-only .callbar__call span {
      display: inline;
    }

    .callbar__quote {
      background: var(--msc-red);
      color: var(--msc-white);
    }
  }

  @media (max-width: 26rem) {
    .callbar__call span {
      display: none;
    }
  }