/* ==========================================================================
   TEXT MODAL
   ========================================================================== */
.text-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000; }
  .text-modal.is-open {
    display: flex;
    align-items: center;
    justify-content: center; }
  .text-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.7); }
  .text-modal__card {
    position: relative;
    z-index: 1;
    background: var(--primary-fuxia);
    color: var(--cream);
    padding: 40px;
    max-width: 600px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    border-radius: 0; }
    @media (max-width: 768px) {
      .text-modal__card {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
        max-height: 70vh;
        padding: 32px 24px;
        border-radius: 0; }
        .text-modal__card__card {
          position: fixed;
          bottom: 0;
          left: 0;
          right: 0;
          width: 100%;
          max-width: 100%;
          max-height: 70vh;
          padding: 32px 24px;
          border-radius: 0;
          transition: transform 0.3s ease;
          transform: translateY(100%); } }
  .text-modal__close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    color: var(--cream);
    font-size: 20px;
    cursor: pointer;
    padding: 4px 8px;
    opacity: 0.8;
    transition: opacity 0.2s ease; }
    .text-modal__close:hover {
      opacity: 1; }
  .text-modal__body {
    font-size: 20px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: -0.8px;
    color: var(--cream);
    margin-top: 16px; }

body.modal-open {
  overflow: hidden; }
  body.modal-open .has-sidebar {
    overflow: hidden; }