/* Reset some list styles */
.fte-wrapper { box-sizing: border-box; }

/* Overall layout */
.fte-wrapper {
  display: flex;
  gap: 40px;
  align-items: flex-start;
  width: 100%;
  padding: 0;
}

/* Desktop tabs (left column) */
.fte-cats { flex: 0 0 150px; }
.fte-cats ul { list-style: none; margin: 0; padding: 0; }
.fte-cats li {
  cursor: pointer;
  font-size: 20px;
  color: #bdbdbd;
  margin: 14px 0;
  transition: color .18s ease;
  padding-left: 0;
  list-style: none;
}
.fte-cats li.active { color: #111; font-weight: 600; }

/* Dropdown wrapper - default hidden on desktop */
.fte-dropdown { display: none; width: 100%; }

/* Dropdown select styling */
.fte-tab-select {
  width: 100%;
  padding: 12px 16px;
  font-size: 16px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-weight: 500;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transition: all .15s ease;

  /* center text horizontally */
  text-align: center;
  text-align-last: center;

  /* center vertically: set height/line-height for consistent center */
  height: 48px;
  line-height: 48px;

  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* Main content area */
.fte-main {
  flex: 1 1 auto;
}

/* Individual tab content hidden by default */
.fte-tab-content { display: none; }
.fte-tab-content.active { display: block; }

/* Inner grid: small image + text on left, big image on right */
.fte-inner-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 32px;
  align-items: start;
}

/* Left small image column */
.fte-left { max-width: 420px; }
.fte-left-media img, .fte-right-media img { width: 100%; height: auto; display: block; object-fit: cover; }

/* Content under small image */
.fte-content-block { margin-top: 18px; }
.fte-title { font-size: 28px; margin: 0 0 12px; }
.fte-text { color: #666; line-height: 1.6; margin-bottom: 12px; }

/* Learn more underline style */
.fte-learn {
  display: inline-block;
  color: #111;
  text-decoration: none;
  border-bottom: 1px solid #111;
  padding-bottom: 2px;
}
.fte-learn:hover { color: #666; border-color: #666; }

/* Right big image takes remaining space */
.fte-right { }

/* Responsive rules: hide desktop tabs on smaller screens and show dropdown */
@media (max-width: 980px) {
  .fte-wrapper { flex-direction: column; gap: 18px; }
  .fte-cats { display: none !important; } /* hide vertical tabs on tablet/mobile */
  .fte-dropdown { display: block; margin-top: 6px; margin-bottom: 18px; width: 100%; }
  .fte-inner-grid { grid-template-columns: 1fr; gap: 20px; }
  .fte-left { order: 1; }
  .fte-right { order: 2; }

  /* make dropdown visually prominent and full width */
  .fte-tab-select { height: 52px; line-height: 52px; font-size: 17px; padding-left: 18px; padding-right: 18px; }
}

/* Small tweak so the widget looks tidy inside Elementor editor area */
.elementor-editor .fte-wrapper { max-width: 100%; }