/* Wealth Power Institute v55 — fixes from live client screenshots/video */

/* 1) LESSON VOCABULARY: give every term/definition its own clean lane. */
.wpi-route-lesson .vocabulary,
.wpi-route-lesson .wpi55-vocabulary{
  display:grid!important;
  grid-template-columns:minmax(170px,220px) minmax(0,1fr)!important;
  gap:32px!important;
  align-items:start!important;
  overflow:hidden!important;
}
.wpi-route-lesson .vocabulary>h2,
.wpi-route-lesson .vocabulary>h3,
.wpi-route-lesson .wpi55-vocabulary>h2,
.wpi-route-lesson .wpi55-vocabulary>h3{
  grid-column:1!important;
  margin:0!important;
  line-height:1.15!important;
}
.wpi-route-lesson .vocabulary>p.program-overline,
.wpi-route-lesson .wpi55-vocabulary>p.program-overline{
  grid-column:1/-1!important;
  margin:0 0 4px!important;
}
.wpi-route-lesson .vocabulary dl,
.wpi-route-lesson .wpi55-vocabulary dl{
  grid-column:2!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  column-gap:34px!important;
  row-gap:28px!important;
}
.wpi-route-lesson .vocabulary dl>div,
.wpi-route-lesson .wpi55-vocabulary dl>div{
  min-width:0!important;
  margin:0!important;
  padding:16px 0 0!important;
  display:block!important;
  border-top:1px solid rgba(195,137,60,.25)!important;
}
.wpi-route-lesson .vocabulary dt,
.wpi-route-lesson .wpi55-vocabulary dt{
  display:block!important;
  width:auto!important;
  margin:0 0 9px!important;
  padding:0!important;
  color:var(--wpi-gold-soft)!important;
  font-weight:900!important;
  line-height:1.3!important;
  white-space:normal!important;
}
.wpi-route-lesson .vocabulary dd,
.wpi-route-lesson .wpi55-vocabulary dd{
  display:block!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  font-size:15px!important;
  line-height:1.55!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}

/* 2) PROGRAMS HERO: use the empty right side for a strong program image. */
.programs-page-head{
  position:relative!important;
  min-height:620px!important;
  padding-right:min(49vw,820px)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  overflow:hidden!important;
}
.programs-page-head>.wpi55-program-hero-image{
  position:absolute!important;
  z-index:1!important;
  right:clamp(34px,6vw,110px)!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:min(40vw,690px)!important;
  height:min(68%,470px)!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:24px!important;
  border:1px solid rgba(195,137,60,.42)!important;
  box-shadow:0 28px 70px rgba(5,2,10,.34)!important;
}
.programs-page-head>*:not(.wpi55-program-hero-image){position:relative!important;z-index:2!important}
.programs-page-head h1{max-width:760px!important}
.programs-page-head>span{max-width:700px!important;line-height:1.55!important}

/* 3) EVENT HERO: move headline/copy/actions toward the left side of the panel. */
.event-detail-hero{position:relative!important;overflow:hidden!important}
.event-detail-hero>div:last-child:not(.event-detail-shade),
.event-detail-hero .wpi55-event-copy{
  margin-left:clamp(28px,4.5vw,78px)!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:20px!important;
  width:min(760px,78vw)!important;
  max-width:760px!important;
  text-align:left!important;
  align-items:flex-start!important;
  justify-items:start!important;
}
.event-detail-hero>div:last-child:not(.event-detail-shade) h1,
.event-detail-hero>div:last-child:not(.event-detail-shade) h2,
.event-detail-hero>div:last-child:not(.event-detail-shade) p,
.event-detail-hero>div:last-child:not(.event-detail-shade) span,
.event-detail-hero .wpi55-event-copy h1,
.event-detail-hero .wpi55-event-copy h2,
.event-detail-hero .wpi55-event-copy p,
.event-detail-hero .wpi55-event-copy span{
  text-align:left!important;
  margin-left:0!important;
  margin-right:0!important;
}
.event-detail-hero>div:last-child:not(.event-detail-shade)>div,
.event-detail-hero>div:last-child:not(.event-detail-shade) .event-detail-actions,
.event-detail-hero>div:last-child:not(.event-detail-shade) .hero-actions,
.event-detail-hero .wpi55-event-copy>div,
.event-detail-hero .wpi55-event-copy .event-detail-actions,
.event-detail-hero .wpi55-event-copy .hero-actions{
  justify-content:flex-start!important;
  align-items:flex-start!important;
  margin-left:0!important;
}

@media(max-width:900px){
  .wpi-route-lesson .vocabulary,.wpi-route-lesson .wpi55-vocabulary{grid-template-columns:1fr!important}
  .wpi-route-lesson .vocabulary>h2,.wpi-route-lesson .vocabulary>h3,.wpi-route-lesson .vocabulary dl,.wpi-route-lesson .wpi55-vocabulary>h2,.wpi-route-lesson .wpi55-vocabulary>h3,.wpi-route-lesson .wpi55-vocabulary dl{grid-column:1!important}
  .wpi-route-lesson .vocabulary dl,.wpi-route-lesson .wpi55-vocabulary dl{grid-template-columns:1fr!important}
  .programs-page-head{min-height:auto!important;padding-right:clamp(22px,6vw,56px)!important;padding-bottom:50px!important}
  .programs-page-head>.wpi55-program-hero-image{position:relative!important;right:auto!important;top:auto!important;transform:none!important;width:100%!important;height:340px!important;margin-top:34px!important}
  .event-detail-hero>div:last-child:not(.event-detail-shade),.event-detail-hero .wpi55-event-copy{width:auto!important;max-width:none!important;margin-left:24px!important;margin-right:24px!important;padding-right:0!important}
}
