.elementor-300 .elementor-element.elementor-element-9636ef8{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}/* Start custom CSS for html, class: .elementor-element-e7d7766 */#herb-tabs-1 .herb-right {
  display: flex;
  justify-content: center;   /* horizontal center */
  align-items: center;       /* vertical center */
  text-align: center;        /* center text */
  padding: 30px;
}
#herb-tabs-1 .herb-content {
  font-family: 'Ibarra Real Nova', serif;
  font-weight: 500; /* regular */
  font-size: 16px;  /* adjust as needed */
  line-height: 1.6; /* for better readability */
  color: #000;      /* keep it clean black */
}
#herb-tabs-1 .herb-content {
  max-width: 500px;          /* optional: limit line length */
}
#herb-tabs-1 .herb-image {
  width: 100%;
  height: 403px;   /* increase/decrease as you like */
  object-fit: cover;
}
/* Tabs: reduce font size */
#herb-tabs-1 .herb-tab {
  font-size: 14px;  /* smaller tab text */
}

/* Right content: link color black */
#herb-tabs-1 .herb-content a {
  color: #000;              /* make link black */
  text-decoration: underline;
}

#herb-tabs-1.herb-section {
  width: 100%;
  max-width: 100%;   /* remove previous limit */
  margin: 0;         /* remove spacing around */

}
#herb-tabs-1 .herb-tab {
  display: block;
  width: 100%;
  padding: 29px 25px;   /* ⬅️ increase top/bottom (20px), keep left/right (15px) */
  text-align: center;
  font-family: 'Hanken Grotesk'; /* ✅ fallback added */
  font-size: 14px;      /* you already set this smaller */
  font-weight:400;
  color: #000000;
  border: 1px solid #e6e6e6;
 border-radius: 0px;
  background: #fff;
  cursor: pointer;
  transition: background 0.3s, color 0.3s;
}

#herb-tabs-1 .herb-tab.active {
  background: #556b2f;
  color: #fff;
}
#herb-tabs-1 {
  display: grid;
  grid-template-columns: 45% 10% 45%; /* left | middle | right */
  gap: 0px; /* optional spacing */
}

/* Remove unwanted spacing between left image and tabs */
.herb-left, 
.herb-tabs {
  margin: 0;
  padding: 0;
}

/* Force the middle column to align flush with image */
#herb-tabs-1 .herb-tab {
  margin: 0;          /* remove side margin */
  border-left: none;  /* remove left border to close the gap */
}
.herb-wrapper {
  display: flex;
  gap: 0;  /* remove default spacing between columns */
}
#herb-tabs-1 .herb-tabs {
    display: flex
;
    flex-direction: column;
    border-left: none;
    border-right: 1px solid #e6e6e6;/* End custom CSS */