.program-detail {
  display: flex;
  flex-direction: column;
  width: 1000px;
  align-items: center;
  gap: 48px;
  padding: 30px 0px 96px;
  position: relative;
  background-color: #ffffff;
}

.program-detail .program-cards {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  position: relative;
  flex: 0 0 auto;
  background-color: #ffffff;
}

.program-detail .base-card {
  width: 958px;
  align-items: flex-start;
  gap: 24px;
  flex: 0 0 auto;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  position: relative;
}

.program-detail .image-placeholder {
  position: relative;
  width: 467px;
  height: 262.69px;
  border-radius: 8px;
  border: 1px solid;
  border-color: #d0d5dd;
  background-image: url(../../img/image-placeholder-2.png);
  background-size: cover;
  background-position: 50% 50%;
}

.program-detail .content {
  display: flex;
  align-items: flex-start;
  gap: 48px;
  padding: 4px 0px;
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
  background-color: #ffffff;
}

.program-detail .text-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
}

.program-detail .headline {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.program-detail .title {
  position: relative;
  align-self: stretch;
  margin-top: -1px;
  font-family: var(--display-sm-semibold-font-family);
  font-weight: var(--display-sm-semibold-font-weight);
  color: #1d2939;
  font-size: var(--display-sm-semibold-font-size);
  letter-spacing: var(--display-sm-semibold-letter-spacing);
  line-height: var(--display-sm-semibold-line-height);
  font-style: var(--display-sm-semibold-font-style);
}

.program-detail .sub-headline {
  position: relative;
  align-self: stretch;
  font-family: var(--text-lg-regular-font-family);
  font-weight: var(--text-lg-regular-font-weight);
  color: #667085;
  font-size: var(--text-lg-regular-font-size);
  letter-spacing: var(--text-lg-regular-letter-spacing);
  line-height: var(--text-lg-regular-line-height);
  font-style: var(--text-lg-regular-font-style);
}

.program-detail .description-set {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.program-detail .div {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.program-detail .text {
  position: relative;
  width: 64px;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: #101828;
  font-size: var(--text-md-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  font-style: var(--text-md-medium-font-style);
}

.program-detail .description {
  position: relative;
  flex: 1;
  margin-top: -1px;
  font-family: var(--text-md-regular-font-family);
  font-weight: var(--text-md-regular-font-weight);
  color: #667085;
  font-size: var(--text-md-regular-font-size);
  letter-spacing: var(--text-md-regular-letter-spacing);
  line-height: var(--text-md-regular-line-height);
  font-style: var(--text-md-regular-font-style);
}

.program-detail .buttons {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.program-detail .button {
  all: unset;
  box-sizing: border-box;
  display: flex;
  width: 124px;
  align-items: center;
  justify-content: center;
  position: relative;
  align-self: stretch;
}

.program-detail .button-base {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid;
  border-color: #98a2b3;
  box-shadow: var(--shadow-xs);
}

.program-detail .text-wrapper {
  position: relative;
  width: fit-content;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: var(--text-md-semibold-font-family);
  font-weight: var(--text-md-semibold-font-weight);
  color: #475467;
  font-size: var(--text-md-semibold-font-size);
  text-align: center;
  letter-spacing: var(--text-md-semibold-letter-spacing);
  line-height: var(--text-md-semibold-line-height);
  white-space: nowrap;
  font-style: var(--text-md-semibold-font-style);
}

.program-detail .tabs {
  display: inline-flex;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .base-tab {
  width: 956px;
  height: 48px;
  align-items: flex-start;
  display: flex;
  position: relative;
}

.program-detail .base-part {
  height: 48px;
  flex: 1;
  flex-grow: 1;
  background-color: #667085;
  border: 1px solid;
  border-color: #344054;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
}

.program-detail .label-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 28px;
  position: relative;
  flex: 1;
  align-self: stretch;
  width: 100%;
  flex-grow: 1;
}

.program-detail .label {
  position: relative;
  flex: 1;
  margin-top: -2px;
  font-family: var(--text-xl-semibold-font-family);
  font-weight: var(--text-xl-semibold-font-weight);
  color: #ffffff;
  font-size: var(--text-xl-semibold-font-size);
  text-align: center;
  letter-spacing: var(--text-xl-semibold-letter-spacing);
  line-height: var(--text-xl-semibold-line-height);
  font-style: var(--text-xl-semibold-font-style);
}

.program-detail .div-wrapper {
  height: 48px;
  flex: 1;
  flex-grow: 1;
  margin-left: -1px;
  background-color: #ffffff;
  border: 1px solid;
  border-color: #d0d5dd;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
}

.program-detail .label-2 {
  position: relative;
  flex: 1;
  font-family: var(--text-lg-medium-font-family);
  font-weight: var(--text-lg-medium-font-weight);
  color: #667085;
  font-size: var(--text-lg-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-lg-medium-letter-spacing);
  line-height: var(--text-lg-medium-line-height);
  font-style: var(--text-lg-medium-font-style);
}

.program-detail .frame {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 56px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .title-program-detail {
  align-items: flex-start;
  align-self: stretch;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 8px 35px;
  position: relative;
  flex: 0 0 auto;
  border-radius: 8px;
}

.program-detail .text-wrapper-2 {
  position: relative;
  flex: 1;
  margin-top: -1px;
  font-family: var(--display-sm-semibold-font-family);
  font-weight: var(--display-sm-semibold-font-weight);
  color: #101828;
  font-size: var(--display-sm-semibold-font-size);
  text-align: center;
  letter-spacing: var(--display-sm-semibold-letter-spacing);
  line-height: var(--display-sm-semibold-line-height);
  font-style: var(--display-sm-semibold-font-style);
}

.program-detail .frame-2 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 48px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .subtitle-program {
  display: flex;
  flex-direction: column;
  width: 954px;
  align-items: center;
  justify-content: center;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .subtitle {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: var(--display-xs-semibold-font-family);
  font-weight: var(--display-xs-semibold-font-weight);
  color: #344054;
  font-size: var(--display-xs-semibold-font-size);
  letter-spacing: var(--display-xs-semibold-letter-spacing);
  line-height: var(--display-xs-semibold-line-height);
  white-space: nowrap;
  font-style: var(--display-xs-semibold-font-style);
}

.program-detail .flexcontainer-wrapper {
  align-items: center;
  padding: 0px 0px 0px 36px;
  display: flex;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.program-detail .flexcontainer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
}

.program-detail .text-i {
  position: relative;
  align-self: stretch;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #475467;
  font-size: 18px;
  letter-spacing: 0;
  line-height: normal;
}

.program-detail .span {
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #475467;
  font-size: 18px;
  letter-spacing: 0;
}

.program-detail .title-program-detail-2 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 35px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  border-radius: 8px;
}

.program-detail .frame-3 {
  position: relative;
  width: 956px;
  height: 412px;
  background-color: #f2f5f9;
  overflow: hidden;
}

.program-detail .frame-4 {
  display: flex;
  flex-direction: column;
  width: 110px;
  height: 412px;
  align-items: flex-start;
  gap: 2px;
  position: absolute;
  top: 0;
  left: 0;
}

.program-detail .frame-5 {
  position: relative;
  align-self: stretch;
  width: 100%;
  height: 64px;
  background-color: #3b78d9;
}

.program-detail .line {
  position: absolute;
  width: 103px;
  height: 64px;
  top: 0;
  left: 0;
}

.program-detail .text-wrapper-3 {
  position: absolute;
  top: 32px;
  left: 11px;
  font-family: var(--text-md-semibold-font-family);
  font-weight: var(--text-md-semibold-font-weight);
  color: #ffffff;
  font-size: var(--text-md-semibold-font-size);
  letter-spacing: var(--text-md-semibold-letter-spacing);
  line-height: var(--text-md-semibold-line-height);
  white-space: nowrap;
  font-style: var(--text-md-semibold-font-style);
}

.program-detail .text-wrapper-4 {
  position: absolute;
  top: 8px;
  left: 65px;
  font-family: var(--text-md-semibold-font-family);
  font-weight: var(--text-md-semibold-font-weight);
  color: #ffffff;
  font-size: var(--text-md-semibold-font-size);
  letter-spacing: var(--text-md-semibold-letter-spacing);
  line-height: var(--text-md-semibold-line-height);
  white-space: nowrap;
  font-style: var(--text-md-semibold-font-style);
}

.program-detail .frame-6 {
  display: flex;
  height: 120px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #64a1f2;
}

.program-detail .text-wrapper-5 {
  position: relative;
  width: fit-content;
  margin-left: -0.5px;
  margin-right: -0.5px;
  font-family: var(--text-md-semibold-font-family);
  font-weight: var(--text-md-semibold-font-weight);
  color: #ffffff;
  font-size: var(--text-md-semibold-font-size);
  letter-spacing: var(--text-md-semibold-letter-spacing);
  line-height: var(--text-md-semibold-line-height);
  white-space: nowrap;
  font-style: var(--text-md-semibold-font-style);
}

.program-detail .frame-7 {
  display: flex;
  height: 80px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #64a1f2;
}

.program-detail .text-wrapper-6 {
  position: relative;
  width: fit-content;
  font-family: var(--text-md-semibold-font-family);
  font-weight: var(--text-md-semibold-font-weight);
  color: #ffffff;
  font-size: var(--text-md-semibold-font-size);
  letter-spacing: var(--text-md-semibold-letter-spacing);
  line-height: var(--text-md-semibold-line-height);
  white-space: nowrap;
  font-style: var(--text-md-semibold-font-style);
}

.program-detail .frame-8 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px;
  position: relative;
  flex: 1;
  align-self: stretch;
  width: 100%;
  flex-grow: 1;
  background-color: #64a1f2;
}

.program-detail .frame-9 {
  display: flex;
  width: 844px;
  height: 64px;
  align-items: flex-start;
  gap: 2px;
  position: absolute;
  top: 0;
  left: 112px;
}

.program-detail .frame-10 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
}

.program-detail .frame-11 {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 0px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: #3c79da;
}

.program-detail .text-wrapper-7 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 24px;
  white-space: nowrap;
}

.program-detail .frame-12 {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 0px;
  position: relative;
  flex: 1;
  align-self: stretch;
  width: 100%;
  flex-grow: 1;
  background-color: #e0e8f6;
}

.program-detail .text-wrapper-8 {
  position: relative;
  width: fit-content;
  font-family: var(--text-sm-medium-font-family);
  font-weight: var(--text-sm-medium-font-weight);
  color: #101828;
  font-size: var(--text-sm-medium-font-size);
  letter-spacing: var(--text-sm-medium-letter-spacing);
  line-height: var(--text-sm-medium-line-height);
  white-space: nowrap;
  font-style: var(--text-sm-medium-font-style);
}

.program-detail .frame-13 {
  display: flex;
  flex-direction: column;
  width: 135px;
  align-items: flex-start;
  gap: 8px;
  position: absolute;
  top: 70px;
  left: 114px;
}

.program-detail .frame-14 {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #baefc9;
  border-radius: 999px;
}

.program-detail .text-wrapper-9 {
  position: relative;
  width: fit-content;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: #101828;
  font-size: var(--text-md-medium-font-size);
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  white-space: nowrap;
  font-style: var(--text-md-medium-font-style);
}

.program-detail .frame-15 {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #78e4af;
  border-radius: 999px;
}

.program-detail .frame-16 {
  display: flex;
  flex-direction: column;
  width: 697px;
  align-items: flex-start;
  gap: 12px;
  position: absolute;
  top: 233px;
  left: 251px;
}

.program-detail .frame-17 {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px 0px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #ffbfbf;
  border-radius: 999px;
}

.program-detail .text-wrapper-10 {
  position: relative;
  width: fit-content;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: #101828;
  font-size: var(--text-md-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  white-space: nowrap;
  font-style: var(--text-md-medium-font-style);
}

.program-detail .frame-18 {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  padding: 8px 0px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #d1b1fa;
  border-radius: 999px;
}

.program-detail .frame-19 {
  display: flex;
  width: 697px;
  align-items: flex-start;
  gap: 4px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .frame-20 {
  display: flex;
  flex-direction: column;
  width: 281px;
  height: 32px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px;
  position: relative;
  background-color: #afb9ec;
  border-radius: 999px;
}

.program-detail .frame-21 {
  display: flex;
  flex-direction: column;
  width: 412px;
  height: 32px;
  align-items: center;
  justify-content: center;
  position: relative;
  background-color: #95ceda;
  border-radius: 999px;
}

.program-detail .p {
  position: relative;
  width: fit-content;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: #101828;
  font-size: var(--text-md-medium-font-size);
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  white-space: nowrap;
  font-style: var(--text-md-medium-font-style);
}

.program-detail .frame-22 {
  display: flex;
  height: 32px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px 0px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #ffce85;
  border-radius: 999px;
}

.program-detail .title-program-detail-3 {
  width: 954px;
  align-items: center;
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 8px 35px;
  position: relative;
  flex: 0 0 auto;
  border-radius: 8px;
}

.program-detail .frame-23 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.program-detail .frame-24 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .frame-25 {
  display: flex;
  width: 956px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px;
  position: relative;
  flex: 0 0 auto;
  background-color: #344054;
  border-radius: 4px;
}

.program-detail .text-wrapper-11 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: var(--text-xl-semibold-font-family);
  font-weight: var(--text-xl-semibold-font-weight);
  color: #ffffff;
  font-size: var(--text-xl-semibold-font-size);
  text-align: center;
  letter-spacing: var(--text-xl-semibold-letter-spacing);
  line-height: var(--text-xl-semibold-line-height);
  white-space: nowrap;
  font-style: var(--text-xl-semibold-font-style);
}

.program-detail .frame-26 {
  display: flex;
  width: 956px;
  align-items: flex-start;
  gap: 40px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .frame-27 {
  position: relative;
  flex: 1;
  flex-grow: 1;
  height: 160px;
  background-color: #eff0ea;
  border-radius: 8px;
  overflow: hidden;
}

.program-detail .frame-28 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 16px;
  position: absolute;
  top: 14px;
  left: 66px;
  background-color: #ffffff;
  border-radius: 16px;
  border: 1px solid;
  border-color: #d0d5dd;
}

.program-detail .text-wrapper-12 {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-family: var(--text-md-semibold-font-family);
  font-weight: var(--text-md-semibold-font-weight);
  color: #344054;
  font-size: var(--text-md-semibold-font-size);
  text-align: center;
  letter-spacing: var(--text-md-semibold-letter-spacing);
  line-height: var(--text-md-semibold-line-height);
  white-space: nowrap;
  font-style: var(--text-md-semibold-font-style);
}

.program-detail .text-wrapper-13 {
  position: absolute;
  width: 163px;
  top: 61px;
  left: 18px;
  font-family: var(--text-sm-medium-font-family);
  font-weight: var(--text-sm-medium-font-weight);
  color: #344054;
  font-size: var(--text-sm-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-sm-medium-letter-spacing);
  line-height: var(--text-sm-medium-line-height);
  font-style: var(--text-sm-medium-font-style);
}

.program-detail .frame-29 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 16px;
  position: absolute;
  top: 14px;
  left: 52px;
  background-color: #ffffff;
  border-radius: 16px;
  border: 1px solid;
  border-color: #d0d5dd;
}

.program-detail .text-wrapper-14 {
  position: absolute;
  width: 164px;
  top: 61px;
  left: 18px;
  font-family: var(--text-sm-medium-font-family);
  font-weight: var(--text-sm-medium-font-weight);
  color: #344054;
  font-size: var(--text-sm-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-sm-medium-letter-spacing);
  line-height: var(--text-sm-medium-line-height);
  font-style: var(--text-sm-medium-font-style);
}

.program-detail .group {
  left: 217px;
  position: absolute;
  width: 24px;
  height: 18px;
  top: 67px;
}

.program-detail .overlap-group {
  position: relative;
  height: 16px;
  top: 1px;
}

.program-detail .rectangle {
  position: absolute;
  width: 16px;
  height: 4px;
  top: 5px;
  left: 0;
  background-color: #667085;
}

.program-detail .polygon {
  position: absolute;
  width: 9px;
  height: 16px;
  top: 0;
  left: 15px;
}

.program-detail .overlap-wrapper {
  left: 466px;
  position: absolute;
  width: 24px;
  height: 18px;
  top: 67px;
}

.program-detail .overlap-group-wrapper {
  left: 715px;
  position: absolute;
  width: 24px;
  height: 18px;
  top: 67px;
}

.program-detail .element {
  position: relative;
  width: fit-content;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: transparent;
  font-size: var(--text-md-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  white-space: nowrap;
  font-style: var(--text-md-medium-font-style);
}

.program-detail .text-wrapper-15 {
  color: #d92d20;
  font-family: var(--text-md-medium-font-family);
  font-style: var(--text-md-medium-font-style);
  font-weight: var(--text-md-medium-font-weight);
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  font-size: var(--text-md-medium-font-size);
}

.program-detail .text-wrapper-16 {
  color: #344054;
  font-family: var(--text-md-medium-font-family);
  font-style: var(--text-md-medium-font-style);
  font-weight: var(--text-md-medium-font-weight);
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  font-size: var(--text-md-medium-font-size);
}

.program-detail .frame-30 {
  position: relative;
  flex: 1;
  flex-grow: 1;
  height: 160px;
  background-color: #f0f0ea;
  border-radius: 8px;
  overflow: hidden;
}

.program-detail .frame-31 {
  left: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 16px;
  position: absolute;
  top: 14px;
  background-color: #ffffff;
  border-radius: 16px;
  border: 1px solid;
  border-color: #d0d5dd;
}

.program-detail .frame-32 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 16px;
  position: absolute;
  top: 14px;
  left: 42px;
  background-color: #ffffff;
  border-radius: 16px;
  border: 1px solid;
  border-color: #d0d5dd;
}

.program-detail .frame-33 {
  left: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 16px;
  position: absolute;
  top: 14px;
  background-color: #ffffff;
  border-radius: 16px;
  border: 1px solid;
  border-color: #d0d5dd;
}

.program-detail .group-2 {
  position: absolute;
  width: 24px;
  height: 18px;
  top: 71px;
  left: 217px;
}

.program-detail .group-3 {
  position: absolute;
  width: 24px;
  height: 18px;
  top: 71px;
  left: 466px;
}

.program-detail .group-4 {
  position: absolute;
  width: 24px;
  height: 18px;
  top: 71px;
  left: 715px;
}

.program-detail .base-tab-2 {
  display: inline-flex;
  align-items: flex-start;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .base-part-2 {
  width: 104px;
  height: 36px;
  background-color: #667085;
  border-radius: 999px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
}

.program-detail .label-3 {
  display: flex;
  height: 36px;
  align-items: center;
  justify-content: center;
  padding: 10px 28px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.program-detail .label-4 {
  position: relative;
  width: fit-content;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: #ffffff;
  font-size: var(--text-md-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  white-space: nowrap;
  font-style: var(--text-md-medium-font-style);
}

.program-detail .base-part-3 {
  flex-direction: column;
  width: 104px;
  height: 36px;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid;
  border-color: #d0d5dd;
  display: flex;
  position: relative;
}

.program-detail .label-5 {
  display: flex;
  height: 36px;
  align-items: center;
  justify-content: center;
  padding: 10px 28px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: #ffffff;
}

.program-detail .label-6 {
  position: relative;
  width: fit-content;
  margin-top: -3px;
  margin-bottom: -1px;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: #667085;
  font-size: var(--text-md-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  white-space: nowrap;
  font-style: var(--text-md-medium-font-style);
}

.program-detail .image-placeholder-wrapper {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 16px;
  position: relative;
  flex: 0 0 auto;
  background-color: #ffffff;
  border-radius: 16px;
  border: 16px solid;
  border-color: #000000;
}

.program-detail .image-placeholder-2 {
  position: relative;
  width: 505px;
  height: 284.06px;
  background-image: url(../../img/image-cookieshot-0.png);
  background-size: cover;
  background-position: 50% 50%;
}

.program-detail .frame-34 {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .frame-35 {
  display: flex;
  width: 570px;
  align-items: center;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
}

.program-detail .text-wrapper-17 {
  position: relative;
  flex: 1;
  margin-top: -1px;
  font-family: var(--text-lg-semibold-font-family);
  font-weight: var(--text-lg-semibold-font-weight);
  color: #344054;
  font-size: var(--text-lg-semibold-font-size);
  text-align: center;
  letter-spacing: var(--text-lg-semibold-letter-spacing);
  line-height: var(--text-lg-semibold-line-height);
  font-style: var(--text-lg-semibold-font-style);
}

.program-detail .text-wrapper-18 {
  position: relative;
  flex: 1;
  margin-top: -1px;
  font-family: var(--text-md-medium-font-family);
  font-weight: var(--text-md-medium-font-weight);
  color: #475467;
  font-size: var(--text-md-medium-font-size);
  text-align: center;
  letter-spacing: var(--text-md-medium-letter-spacing);
  line-height: var(--text-md-medium-line-height);
  font-style: var(--text-md-medium-font-style);
}