#about-page .author-content-item.aboutMapLeft {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    width: 39%;
}

.aboutMapLeft h2 {
    margin-right: auto;
    font-size: 28px;
    font-family: Helvetica;
    line-height: 1.06;
    letter-spacing: -0.02em;
    color: var(--heo-fontcolor);
    margin-top: 0;
    width: 100%;  /* Ensure h2 takes full width */
}

.aboutMapLeft h3 {
    margin-right: auto;
    font-size: 20px;
    font-family: Helvetica;
    line-height: 1.06;
    letter-spacing: -0.02em;
    color: var(--heo-fontcolor);
    margin-top: 0;
    width: 100%; 
}

.aboutMapLeft ul {
    list-style-type: disc !important; /* or circle */
}

.aboutMapLeft .mask {
    height: 28px;
    position: relative;
    overflow: hidden;
    margin-top: 4px;
    width: 100%;  /* Ensure mask takes full width */
}

.aboutMapLeft .mask span {
    display: block;
    box-sizing: border-box;
    position: absolute;
    top: 28px;
    padding-bottom: var(--offset);
    background-size: 100% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    background-repeat: no-repeat;
    white-space: nowrap;  /* Prevent spans from wrapping */
}

.aboutMapLeft .mask span[data-show],
.aboutMapLeft .mask span[data-up] {
    transition: .5s transform ease-in-out;
}

.aboutMapLeft .mask span[data-show] {
    transform: translateY(-100%);
}

.aboutMapLeft .mask span[data-up] {
    transform: translateY(-200%);
}

.gradient-1 {
    background-image: linear-gradient(45deg, #0ecffe 50%, #07a6f1);
}

.gradient-2 {
    background-image: linear-gradient(45deg, #18e198 50%, #0ec15d);
}

.gradient-3 {
    background-image: linear-gradient(45deg, #8a7cfb 50%, #633e9c);
}

.gradient-4 {
    background-image: linear-gradient(45deg, #fa7671 50%, #f45f7f);
}

/* When the layout gets narrow, make both sides full width */
@media (max-width: 900px) {
  #about-page .author-content-item.aboutMapLeft,
  #about-page .aboutMapRight {
    width: 100%;
  }
}


/* --- restore Magic Words interactivity & keep it above neighbors --- */
#about-page .magic-words {
  position: relative;     /* ensure stacking context */
  z-index: 100;           /* sit above map/carousel blocks */
  pointer-events: auto;   /* make sure it can receive events */
  min-height: 315px;      /* reserve its own hit area */
}

/* overlays inside shouldn't eat the mouse */
#about-page .magic-words .content,
#about-page .magic-words .shapes,
#about-page .magic-words .shape,
#about-page .magic-words .cursor {
  pointer-events: none;
}

/* neighbors: keep below so they don't cover it */
#about-page .aboutMapRight,
#about-page .imageContainer {
  position: relative;
  z-index: 0;
}
