.elementor-636 .elementor-element.elementor-element-12fdef9{--display:flex;}.elementor-636 .elementor-element.elementor-element-51d7942{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-636 .elementor-element.elementor-element-c6d1a9d.elementor-element{--align-self:center;}.elementor-636 .elementor-element.elementor-element-c6d1a9d{text-align:center;}.elementor-636 .elementor-element.elementor-element-c6d1a9d .elementor-heading-title{font-family:"Barlow Condensed", Sans-serif;font-size:33px;font-weight:900;text-transform:uppercase;text-decoration:none;-webkit-text-stroke-width:1px;stroke-width:1px;-webkit-text-stroke-color:#000;stroke:#000;color:var( --e-global-color-eaed1d6 );}body.elementor-page-636:not(.elementor-motion-effects-element-type-background), body.elementor-page-636 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-4460e49 );}@media(max-width:767px){.elementor-636 .elementor-element.elementor-element-c6d1a9d .elementor-heading-title{font-size:20px;-webkit-text-stroke-width:1px;stroke-width:1px;}}/* Start custom CSS *//* =========================
   GLOBAL / PAGE FEEL
   ========================= */

body {
  background-color: #000;
}

.thp-guests-grid-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  padding: 32px 16px;
  font-family: "Montserrat", system-ui, sans-serif;
  color: #fff;
}

/* =========================
   GRID LAYOUT
   ========================= */

.thp-guests-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* Tablet */
@media (max-width: 1024px) {
  .thp-guests-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ==========================
   MOBILE — TEXT & OVERLAY
   ========================== */
@media (max-width: 600px) {

  .thp-guests-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }

  .thp-guests-grid-wrapper {
    padding: 14px 10px;
  }

  /* Reduce overlay footprint */
  .thp-guest-overlay {
    height: 28%;
    padding: 8px 10px;
  }

  /* Soft dark plate (Option B) */
  .thp-guest-overlay::before {
    left: 8px;
    right: 8px;
    bottom: 8px;
    height: 60%;
    border-radius: 10px;
  }

  /* Guest name — smaller & tighter */
  .thp-guest-name {
    font-size: 11px;
    line-height: 1.15;
    font-weight: 600;
    margin: 0 0 3px;

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  /* Position / company — clearly secondary */
  .thp-guest-meta {
    font-size: 9.5px;
    line-height: 1.0;
    opacity: 0.75;
    margin: 0;

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
}



/* =========================
   MESSAGE
   ========================= */

.thp-guests-grid-message {
  text-align: center;
  font-size: 14px;
  opacity: 0.7;
  margin-top: 16px;
}

/* =========================
   CARD
   ========================= */

.thp-guest-card {
  background: #0c0c0c;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6);
  display: flex;
  flex-direction: column;
}

/* =========================
   IMAGE
   ========================= */

.thp-guest-image-wrapper {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.thp-guest-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
  filter: brightness(1.05) contrast(1.05);
}

.thp-guest-card:hover img {
  transform: scale(1.05);
}

/* =========================
   OVERLAY
   ========================= */

.thp-guest-overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 55%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 16px;
  box-sizing: border-box;
  backdrop-filter: blur(0.5px);
}

.thp-guest-overlay::before {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  height: 45%;
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.45);
  pointer-events: none;
}

.thp-guest-overlay > * {
  position: relative;
  z-index: 1;
}

.thp-guest-name,
.thp-guest-meta {
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.85);
}


/* =========================
   TEXT (LOCKED SIZES)
   ========================= */

.thp-guest-name {
  font-size: 18px !important;
  font-weight: 700;
  margin: 0 0 4px;
  line-height: 1.15;
}

.thp-guest-meta {
  font-size: 13px !important;
  opacity: 0.85;
  margin: 0;
  line-height: 1.3;
}

/* =========================
   EPISODES AREA
   ========================= */

.thp-guest-episodes {
  padding: 12px 16px 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* =========================
   EPISODE PILL
   ========================= */

.thp-episode-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  padding: 8px 10px;
  border-radius: 10px;

  border: 1px solid #ffc303;
  background: rgba(255, 195, 3, 0.08);
  color: #fff;

  text-decoration: none;
  line-height: 1;
  font-size: 12px;
  font-weight: 500;

  transition: transform 0.15s ease, background 0.15s ease;
}

.thp-episode-btn span {
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #ffc303;
  opacity: 0.95;
}

.thp-episode-btn strong {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
}

.thp-episode-btn:hover {
  background: rgba(255, 195, 3, 0.22);
  transform: translateY(-1px);
}

/* =========================
   NO EPISODES TEXT
   ========================= */

.thp-guest-no-episodes {
  font-size: 12px;
  opacity: 0.6;
}/* End custom CSS */