/* Author Box front/preview layout — variables come from vars.css */
.mantys-author { 
  color: var(--mantys-author-text); 
  margin-top: 2rem;
}

/* Wrapper */
.mantys-author .ma-card{
  border: none;
  position: relative;
  overflow: visible;
}

/* Row (layout container) */
.mantys-author .ma-row{
  display: flex;
}

/* Avatar */
.mantys-author img.ma-avatar,
.et_pb_with_border .mantys-author img.ma-avatar{
  width: var(--mantys-author-avatar-size);
  height: var(--mantys-author-avatar-size);
  border-radius: 9999px;
  object-fit: cover;
  background: #e2e8f0; /* fallback if no avatar */
  border: var(--mantys-author-ring-w) solid var(--mantys-author-avatar-ring);
  display: block;
  position: relative;
  z-index: 99; /* always above the background card */
  margin-top: 30px;
  margin-bottom: 30px;
}

/* Text block (colored background under the avatar) */
.mantys-author .ma-col{
  background: var(--mantys-author-bg);
  border-radius: var(--mantys-author-radius);
  flex: 1;

  /* Desktop overlap: slide the block left under half the avatar,
     then add that same value to the padding-left so text stays clear */
  margin-left: calc(-1 * ((var(--mantys-author-avatar-size) + 2*var(--mantys-author-ring-w)) / 2));
  padding: 32px 32px 32px calc(32px + ((var(--mantys-author-avatar-size) + 2*var(--mantys-author-ring-w)) / 2));
  padding-bottom: 20px;
}

/* Typography */
.mantys-author .ma-name{
  margin: 0 0 8px;
  color: var(--mantys-author-text) !important;
  font-size: 1.2rem;
  line-height: 1.6rem;
  padding-bottom: 0;
  font-weight: 600;
}
.mantys-author .ma-bio{ 
  margin: 0; 
  padding: 0;
  font-size: 1rem;
  line-height: 1.6rem;
}
.mantys-author .ma-link{ 
  font-size: 1rem !important;
  line-height: 1.6rem !important;
  margin: 0 !important;
  padding: 0 !important;
}
.mantys-author .ma-link a{ 
  color: var(--mantys-author-accent); 
  text-decoration: none; 
  font-weight: 800 !important;
}
.mantys-author .ma-link a:hover{ 
  text-decoration: underline; 
}

.mantys-author-signature{
    border-top: 1px solid #083f4e;
    padding-top: 5px;
    line-height: 1.4rem;
}

.mantys-author-signature a{
  font-weight: 600 !important;
  text-decoration: none !important;
}

@media (max-width: 782px){
  .mantys-author .ma-row{
    flex-direction: column;
  }

  .mantys-author img.ma-avatar, 
  .et_pb_with_border .mantys-author img.ma-avatar {
    width: var(--mantys-author-avatar-size-sm);
    height: var(--mantys-author-avatar-size-sm);
    margin-inline: auto; /* center horizontally */
    margin-bottom: 0;
  }

  .mantys-author .ma-col{
    margin-left: 0; /* reset desktop offset */

    /* Pull the block up by half the avatar diameter (incl. ring) */
    margin-top: calc(-1 * ((var(--mantys-author-avatar-size-sm) + 2*var(--mantys-author-ring-w))) / 2);

    /* Add that same value + 30px extra breathing space */
    padding: calc(30px + ((var(--mantys-author-avatar-size-sm) + 2*var(--mantys-author-ring-w)) / 2)) 20px 20px 20px;
  }
}