.course-detail-page .container {
    width: min(100%, 1440px);
    max-width: 1440px;
  }

  .course-detail-page .course-hero__grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, 1.02fr);
    gap: 0;
    align-items: stretch;
  }

  .course-detail-page .course-hero-info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .course-detail-page .course-hero-info-card__value {
    line-height: 1.35;
  }

  .course-detail-page .course-detail-split {
    grid-template-columns: minmax(0, 1.45fr) minmax(340px, 1fr);
  }

  @media (min-width: 1400px) {
    .course-detail-page .container {
      width: min(100%, 1520px);
      max-width: 1520px;
    }

    .course-detail-page .course-hero__grid {
      grid-template-columns: minmax(0, 1.04fr) minmax(450px, 0.98fr);
    }

    .course-detail-page .course-detail-split {
      grid-template-columns: minmax(0, 1.52fr) minmax(360px, 0.96fr);
    }
  }

  @media (max-width: 1199px) {
    .course-detail-page .container {
      width: min(100%, 100%);
      max-width: 100%;
    }

    .course-detail-page .course-hero__grid {
      grid-template-columns: 1fr;
    }

    .course-detail-page .course-detail-split {
      grid-template-columns: 1fr;
    }
  }

  .course-detail-page .course-hero-card__media--video .course-hero-card__media-inner {
    position: relative;
    overflow: hidden;
    min-height: 100%;
    background:
      linear-gradient(180deg, rgba(7, 19, 49, 0.18), rgba(7, 19, 49, 0.58)),
      radial-gradient(circle at top right, rgba(57, 170, 230, 0.22), transparent 30%),
      #12264d;
  }

  .course-detail-page .course-hero-card__video-thumb {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.035);
    filter: saturate(1.06) contrast(1.02);
  }

  .course-detail-page .course-hero-card__video-overlay {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgba(6, 16, 40, 0.18), rgba(6, 16, 40, 0.62)),
      radial-gradient(circle at center, rgba(255, 255, 255, 0.06), transparent 34%);
    pointer-events: none;
  }

  .course-detail-page .course-hero-card__video-preview {
    position: relative;
    z-index: 2;
    backdrop-filter: blur(10px);
  }

  .course-detail-page .course-video-launch {
    position: relative;
    z-index: 2;
  }

  .course-detail-page .course-hero {
    overflow: hidden;
    position: relative;
  }

  .course-detail-page .public-hero.course-hero--enhanced {
    background: linear-gradient(180deg, #12264d 0%, #1a3563 100%);
  }

  .course-detail-page .course-hero-slider {
    position: relative;
    overflow: hidden;
    border-radius: inherit;
  }

  .course-detail-page .course-hero-slider__track {
    display: flex;
    width: 200%;
    transition: transform .55s ease;
    will-change: transform;
  }

  .course-detail-page .course-hero-slide {
    width: 100%;
    min-width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1.14fr) minmax(340px, 0.86fr);
    align-items: stretch;
  }

  .course-detail-page .course-hero-slide__copy,
  .course-detail-page .course-hero-slide__panel {
    min-width: 0;
  }

  .course-detail-page .course-hero__copy {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 100%;
    padding-right: 1rem;
  }

  .course-detail-page .course-hero__title {
    margin-bottom: .35rem;
    max-width: none;
    line-height: 1.02;
  }

  .course-detail-page .course-hero__subtitle {
    margin: 0 0 .85rem;
    max-width: 42rem;
    font-size: clamp(1rem, 1.35vw, 1.28rem);
    font-weight: 500;
    line-height: 1.35;
    color: rgba(186, 230, 253, 0.92);
    letter-spacing: 0.01em;
  }

  .course-detail-page .course-hero-info-grid {
    gap: .55rem;
  }

  .course-detail-page .course-hero__actions {
    margin-top: .95rem;
    align-items: center;
  }

  .course-detail-page .public-eyebrow {
    display: inline-flex;
    width: fit-content;
    max-width: max-content;
    padding: .2rem .55rem;
    font-size: .62rem;
    letter-spacing: .04em;
    line-height: 1.1;
  }

  .course-detail-page .course-trust-strip {
    margin-top: .75rem;
  }

  .course-detail-page .course-hero-slide__copy {
    padding: 1rem 1rem .92rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .course-detail-page .course-hero-slide__panel {
    position: relative;
    min-height: 100%;
    background: linear-gradient(180deg, rgba(18, 38, 77, 0.86), rgba(26, 53, 99, 0.9));
    border-left: 1px solid rgba(148, 197, 255, 0.12);
    padding: 1.25rem 1.2rem 1.15rem;
  }

  .course-detail-page .course-hero-slide__panel--media {
    overflow: hidden;
  }

  .course-detail-page .course-hero-slide__panel-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  .course-detail-page .course-hero-slide__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin-bottom: .55rem;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8bd5ff;
  }

  .course-detail-page .course-hero-slide__lead {
    margin: 0 0 1rem;
    max-width: 54ch;
    color: rgba(226, 239, 255, 0.82);
    line-height: 1.5;
    font-size: .9rem;
  }

  .course-detail-page .course-hero-slide__media-wrap {
    position: relative;
    min-height: 340px;
    flex: 1;
    overflow: hidden;
  }

  .course-detail-page .course-hero-slide__media-wrap .course-hero-card__media,
  .course-detail-page .course-hero-slide__media-wrap .course-hero-card__media-inner {
    height: 100%;
    min-height: 100%;
  }

  .course-detail-page .course-hero-invest {
    padding: 0;
    display: grid;
    gap: .58rem;
    height: 100%;
    align-content: start;
  }

  .course-detail-page .course-hero-invest__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8bd5ff;
  }

  .course-detail-page .course-hero-invest__lead {
    margin: -.1rem 0 .1rem;
    color: rgba(226, 239, 255, 0.8);
    font-size: .82rem;
    line-height: 1.45;
    max-width: 34ch;
  }

  .course-detail-page .course-hero-invest__actions {
    display: grid;
    gap: .58rem;
  }

  .course-detail-page .course-hero-slide:first-child .course-hero-info-grid {
    gap: .48rem;
  }

  .course-detail-page .course-hero-slide:first-child .course-hero-info-card {
    min-height: 0;
  }

  /* Programas asíncronos: solo 4 datos clave — más aire vertical en el hero */
  .course-detail-page .course-hero--async-balanced .course-hero-slide {
    min-height: 26rem;
    align-items: stretch;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-slide__copy {
    padding: 1.85rem 1.45rem 1.7rem;
    justify-content: center;
    gap: 0;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-slide:first-child .course-hero-info-grid {
    gap: 0.9rem;
    margin: 1.2rem 0 1.35rem;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-slide:first-child .course-hero-info-card {
    min-height: 4.5rem;
    padding: 1rem 1.1rem;
    gap: 0.85rem;
    align-items: center;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-slide:first-child .course-hero__actions {
    margin-top: 1.4rem;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-slide:first-child .course-trust-strip {
    margin-top: 1.15rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    row-gap: 0.55rem;
  }

  .course-detail-page .course-hero--async-balanced .public-eyebrow {
    margin-bottom: 0.8rem;
  }

  .course-detail-page .course-hero--async-balanced .course-hero__title {
    margin-bottom: 0.9rem;
    line-height: 1.14;
  }

  .course-detail-page .course-hero--async-balanced .course-hero__subtitle {
    margin-bottom: 1.2rem;
    line-height: 1.45;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-info-grid {
    gap: 0.9rem;
    margin: 1.2rem 0 1.35rem;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-info-card {
    min-height: 4.5rem;
    padding: 1rem 1.1rem;
    gap: 0.85rem;
    align-items: center;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-info-card__icon {
    width: 2.4rem;
    height: 2.4rem;
    font-size: 0.95rem;
    border-radius: 0.62rem;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-info-card__label {
    font-size: 0.68rem;
    line-height: 1.5;
    letter-spacing: 0.07em;
    margin-bottom: 0.22rem;
  }

  .course-detail-page .course-hero--async-balanced .course-hero-info-card__value {
    font-size: 0.94rem;
    line-height: 1.5;
  }

  .course-detail-page .course-hero--async-balanced .course-hero__actions {
    margin-top: 1.4rem;
    gap: 0.7rem;
  }

  .course-detail-page .course-hero--async-balanced .course-trust-strip {
    margin-top: 1.15rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    row-gap: 0.55rem;
    column-gap: 1.1rem;
  }

  .course-detail-page .course-hero-slide:first-child .course-hero__actions {
    margin-top: .75rem;
  }

  .course-detail-page .course-hero-slide:first-child .course-trust-strip {
    margin-top: .6rem;
    row-gap: .45rem;
  }

  .course-detail-page .course-hero-slide:first-child .course-hero-card__share-shell {
    grid-template-columns: 1fr;
  }

  .course-detail-page .course-hero-slide:first-child .course-hero-card__currency {
    justify-content: flex-start;
  }

  .course-detail-page .course-hero-slide:first-child .course-hero-card__currency .currency-switch {
    margin-left: 0;
  }

  .course-detail-page .course-hero-slide:nth-child(2) {
    grid-template-columns: 1fr;
  }

  .course-detail-page .course-hero-corner-thumb {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 5;
    width: 336px;
    height: 208px;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid rgba(125, 211, 252, 0.34);
    background:
      radial-gradient(circle at top left, rgba(255,255,255,.12), transparent 42%),
      linear-gradient(135deg, rgba(7, 31, 67, 0.94), rgba(18, 84, 136, 0.92));
    box-shadow: 0 18px 34px rgba(6, 16, 40, 0.28);
    backdrop-filter: blur(10px);
    pointer-events: none;
  }

  .course-detail-page .course-hero-corner-thumb > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none;
    z-index: 0;
  }

  .course-detail-page .course-hero-corner-thumb > .course-hero-corner-thumb__fallback {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at top, rgba(103, 232, 249, 0.2), transparent 45%), rgba(7, 20, 46, 0.82);
    font-size: 2.35rem;
    color: #dceaf8;
    pointer-events: none;
    z-index: 0;
  }

  .course-detail-page .course-hero-corner-thumb__open {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .75rem;
    margin: 0;
    border: 0;
    cursor: pointer;
    color: #fff;
    background: linear-gradient(180deg, rgba(7, 20, 46, 0.08), rgba(7, 20, 46, 0.48));
    transition: background .2s ease;
    pointer-events: auto;
  }

  .course-detail-page .course-hero-corner-thumb__open:hover,
  .course-detail-page .course-hero-corner-thumb__open:focus-visible {
    background: linear-gradient(180deg, rgba(7, 20, 46, 0.28), rgba(7, 20, 46, 0.78));
    outline: none;
  }

  .course-detail-page .course-hero-corner-thumb__open:focus-visible {
    box-shadow: inset 0 0 0 2px rgba(125, 211, 252, 0.65);
  }

  .course-detail-page .course-hero-corner-thumb__open-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 999px;
    background: rgba(255,255,255,.22);
    border: 1px solid rgba(255,255,255,.35);
    font-size: 1.25rem;
    box-shadow: 0 10px 28px rgba(2, 12, 32, 0.45);
  }

  .course-detail-page .course-hero-corner-thumb__open-label {
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-shadow: 0 2px 12px rgba(2, 8, 23, 0.65);
  }

  /* Esquina decorativa solo sin video: mismo look que la preview flotante, sin clic ni popup */
  .course-detail-page .course-hero-corner-thumb--effects {
    animation: heroCornerFloat 3.1s ease-in-out infinite;
    background:
      radial-gradient(circle at top left, rgba(255,255,255,.18), transparent 42%),
      linear-gradient(135deg, rgba(7, 31, 67, 0.94), rgba(18, 84, 136, 0.92));
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
    pointer-events: none;
  }

  .course-detail-page .course-hero-corner-thumb--effects::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
      linear-gradient(180deg, rgba(8, 20, 45, 0.04), rgba(8, 20, 45, 0.32)),
      linear-gradient(115deg, transparent 0%, rgba(255,255,255,.12) 48%, transparent 72%);
    transform: translateX(-135%);
    animation: heroCornerShine 4.6s ease-in-out infinite;
    pointer-events: none;
  }

  .course-detail-page .course-hero-corner-thumb--effects::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #86b8e7;
    box-shadow: 0 0 0 0 rgba(103, 232, 249, 0.55);
    animation: heroCornerPulse 2.2s ease-out infinite;
    pointer-events: none;
  }

  /* Sin foto ni video: mismo marco flotante con arte azul tipo “marcador” (solo decorativo). */
  .course-detail-page .course-hero-corner-thumb--placeholder {
    background:
      radial-gradient(circle at 18% 12%, rgba(186, 230, 253, 0.35), transparent 38%),
      radial-gradient(circle at 92% 8%, rgba(57, 170, 230, 0.25), transparent 32%),
      linear-gradient(160deg, #0f2847 0%, #0e3a62 42%, #0c4c6f 72%, #164e7a 100%);
  }

  .course-detail-page .course-hero-corner-thumb__demo-fill {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
      linear-gradient(
        125deg,
        rgba(103, 232, 249, 0.12) 0%,
        transparent 38%,
        rgba(59, 130, 246, 0.2) 70%,
        rgba(125, 211, 253, 0.14) 100%
      ),
      repeating-linear-gradient(
        -18deg,
        transparent,
        transparent 9px,
        rgba(255, 255, 255, 0.035) 9px,
        rgba(255, 255, 255, 0.035) 10px
      ),
      radial-gradient(ellipse 95% 80% at 55% 100%, rgba(15, 23, 42, 0.55), transparent 62%);
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.12);
  }

  .course-detail-page .course-hero-corner-thumb__demo-icon {
    position: absolute;
    left: 50%;
    top: 52%;
    transform: translate(-50%, -50%);
    font-size: 2.6rem;
    line-height: 1;
    color: rgba(224, 242, 254, 0.32);
    text-shadow: 0 12px 28px rgba(2, 8, 23, 0.45);
  }

  .course-detail-page .course-hero-corner-thumb__demo-accent {
    position: absolute;
    width: 78px;
    height: 56px;
    border-radius: 12px;
    border: 1px solid rgba(125, 211, 253, 0.22);
    background: rgba(15, 40, 75, 0.45);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.08),
      0 10px 24px rgba(2, 20, 50, 0.35);
    pointer-events: none;
  }

  .course-detail-page .course-hero-corner-thumb__demo-accent--a {
    left: 12%;
    top: 16%;
    transform: rotate(-6deg);
    opacity: .55;
    animation: heroCornerDemoAccent 7s ease-in-out infinite;
  }

  .course-detail-page .course-hero-corner-thumb__demo-accent--b {
    right: 14%;
    bottom: 38%;
    width: 64px;
    height: 48px;
    transform: rotate(8deg);
    opacity: .4;
    animation: heroCornerDemoAccentB 8.5s ease-in-out infinite;
  }

  @keyframes heroCornerDemoAccent {
    0%, 100% { transform: rotate(-6deg) translate(0, 0); }
    50% { transform: rotate(-6deg) translate(2px, -3px); }
  }

  @keyframes heroCornerDemoAccentB {
    0%, 100% { transform: rotate(8deg) translate(0, 0); }
    50% { transform: rotate(8deg) translate(-2px, 2px); }
  }

  @keyframes heroCornerFloat {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -5px, 0); }
  }

  @keyframes heroCornerPulse {
    0% { box-shadow: 0 0 0 0 rgba(103, 232, 249, 0.5); }
    70% { box-shadow: 0 0 0 10px rgba(103, 232, 249, 0); }
    100% { box-shadow: 0 0 0 0 rgba(103, 232, 249, 0); }
  }

  @keyframes heroCornerShine {
    0%, 70%, 100% { transform: translateX(-135%); }
    84% { transform: translateX(135%); }
  }

  .course-detail-page .course-hero-invest .ceo-money__toggle {
    display: inline-flex;
    align-items: center;
    gap: .1rem;
    width: fit-content;
    padding: .12rem;
    margin: -.05rem 0 .15rem;
    border-radius: 999px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
  }

  .course-detail-page .course-hero-invest .ceo-money__choice {
    padding: .22rem .5rem;
    border-radius: 999px;
    font-size: .62rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .01em;
    color: rgba(226, 239, 255, 0.68);
    opacity: 1;
  }

  .course-detail-page .course-hero-invest .ceo-money__choice.is-active {
    background: rgba(57, 170, 230, 0.14);
    color: #dceaf8;
    box-shadow: inset 0 0 0 1px rgba(103, 232, 249, 0.14);
  }

  .course-detail-page .course-aside-card--cta .ceo-money__toggle {
    width: fit-content;
    max-width: 100%;
    justify-self: start;
  }

  .course-detail-page .course-aside-card--cta .ceo-money__choice {
    min-width: 3.85rem;
    padding: 0.34rem 0.55rem;
    font-size: 0.7rem;
    text-align: center;
  }

  .course-detail-page .course-hero-slider__nav {
    position: absolute;
    left: 50%;
    bottom: .95rem;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    z-index: 3;
    padding: .38rem .55rem;
    border-radius: 999px;
    background: rgba(8, 20, 45, 0.38);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(191, 219, 254, 0.14);
  }

  .course-detail-page .course-hero-slider__dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    border: 0;
    background: rgba(255,255,255,.28);
    transition: transform .2s ease, background .2s ease;
    cursor: pointer;
  }

  .course-detail-page .course-hero-slider__dot.is-active {
    background: #39AAE6;
    transform: scale(1.18);
  }

  .course-detail-page .course-aside-card--related {
    overflow: hidden;
    background:
      radial-gradient(circle at top right, rgba(57, 170, 230, 0.16), transparent 28%),
      linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  }

  .course-detail-page .course-related-sales {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    margin-bottom: 1rem;
  }

  .course-detail-page .course-related-sales__icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(57, 170, 230, 0.18), rgba(34, 49, 97, 0.16));
    color: #1f5d92;
    box-shadow: inset 0 0 0 1px rgba(57, 170, 230, 0.18);
    flex-shrink: 0;
  }

  .course-detail-page .course-related-sales__eyebrow {
    display: block;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #39AAE6;
    margin-bottom: .2rem;
  }

  .course-detail-page .course-related-sales__title {
    margin: 0;
    font-size: 1.06rem;
    font-weight: 800;
    color: #153765;
    line-height: 1.2;
  }

  .course-detail-page .course-related-sales__copy {
    margin: .3rem 0 0;
    font-size: .85rem;
    color: #4b6488;
    line-height: 1.5;
  }

  .course-detail-page .course-related-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: .85rem;
  }

  .course-detail-page .course-related-card {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: .8rem;
    align-items: center;
    text-decoration: none;
    border: 1px solid #d9e7f5;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    padding: .85rem;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }

  .course-detail-page .course-related-card:hover {
    transform: translateY(-2px);
    border-color: #9ec9ef;
    box-shadow: 0 18px 30px rgba(34, 49, 97, 0.12);
  }

  .course-detail-page .course-related-card__media {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    overflow: hidden;
    background: linear-gradient(135deg, #dbeafe 0%, #1d4ed8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .course-detail-page .course-related-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .course-detail-page .course-related-card__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.02), rgba(15, 23, 42, 0.18));
  }

  .course-detail-page .course-related-card__icon {
    position: relative;
    z-index: 1;
    font-size: 1.2rem;
    color: #fff;
  }

  .course-detail-page .course-related-card__body {
    min-width: 0;
  }

  .course-detail-page .course-related-card__pill {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .2rem .52rem;
    border-radius: 999px;
    background: #dceaf8;
    color: #3258A1;
    font-size: .68rem;
    font-weight: 800;
    margin-bottom: .45rem;
  }

  .course-detail-page .course-related-card__name {
    display: block;
    font-size: .92rem;
    font-weight: 800;
    color: #1e3a5f;
    line-height: 1.35;
  }

  .course-detail-page .course-related-card__cta {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-top: .45rem;
    font-size: .78rem;
    font-weight: 800;
    color: #0f766e;
  }

  .course-detail-page .course-related-footer {
    margin-top: 1rem;
  }

  .course-detail-page .course-related-footer .btn {
    width: 100%;
    justify-content: center;
  }

  .course-detail-page .course-hero-card__body {
    padding: .8rem .95rem .9rem;
    display: grid;
    gap: .58rem;
    align-content: start;
  }

  .course-detail-page .course-hero-card__topline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .85rem;
  }

  .course-detail-page .course-hero-card__title-group {
    min-width: 0;
  }

  .course-detail-page .course-hero-card__label {
    margin: 0 0 .16rem;
  }

  .course-detail-page .course-hero-card__hint {
    margin: 0;
    max-width: 34ch;
    font-size: .76rem;
    line-height: 1.42;
  }

  .course-detail-page .course-hero-card__brochure {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .85rem;
    padding: .74rem .86rem;
    border-radius: 16px;
    text-decoration: none;
    color: #fff;
    background:
      radial-gradient(circle at top left, rgba(255,255,255,.12), transparent 34%),
      linear-gradient(135deg, rgba(8, 47, 73, 0.92) 0%, rgba(14, 116, 144, 0.92) 100%);
    border: 1px solid rgba(125, 211, 252, 0.2);
    box-shadow: 0 16px 32px rgba(8, 47, 73, 0.22);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  }

  .course-detail-page .course-hero-card__brochure:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 38px rgba(8, 47, 73, 0.28);
    border-color: rgba(186, 230, 253, 0.4);
    color: #fff;
  }

  .course-detail-page .course-hero-card__brochure::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 0%, rgba(255,255,255,.14) 48%, transparent 72%);
    transform: translateX(-135%);
    animation: brochureShine 4.8s ease-in-out infinite;
    pointer-events: none;
  }

  .course-detail-page .course-hero-card__brochure-visual {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.14);
    border: 1px solid rgba(255,255,255,0.18);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
    flex-shrink: 0;
    font-size: 1.15rem;
  }

  .course-detail-page .course-hero-card__brochure-copy {
    flex: 1;
    min-width: 0;
  }

  .course-detail-page .course-hero-card__brochure-label {
    display: block;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(224, 242, 254, 0.92);
    margin-bottom: .18rem;
  }

  .course-detail-page .course-hero-card__brochure-title {
    display: block;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.25;
    color: #fff;
  }

  .course-detail-page .course-hero-card__brochure-meta {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-top: .35rem;
    font-size: .76rem;
    font-weight: 700;
    color: #bae6fd;
  }

  .course-detail-page .course-hero-card__brochure-arrow {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
    flex-shrink: 0;
  }

  .course-detail-page .course-hero-card__share-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .6rem;
    align-items: start;
    padding: .62rem .72rem;
    border-radius: 16px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
  }

  .course-detail-page .course-hero-card__share {
    margin-top: 0;
  }

  .course-detail-page .course-hero-card__share-label {
    margin-bottom: .35rem;
  }

  .course-detail-page .course-hero-card__currency {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .course-detail-page .course-hero-card__currency .currency-switch {
    margin-left: auto;
  }

  .course-detail-page .course-hero__card {
    display: grid;
    grid-template-rows: minmax(240px, 1fr) auto;
  }

  .course-detail-page .course-hero-card__media {
    min-height: 240px;
  }

  .course-detail-page .course-hero-card__media-inner {
    height: 100%;
  }

  .course-detail-page .course-hero-card__media-img {
    animation: heroFloat 14s ease-in-out infinite;
    transform-origin: center center;
  }

  .course-detail-page .course-hero-card__video-thumb {
    animation: heroFloat 16s ease-in-out infinite;
  }

  .course-detail-page .course-hero__card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top right, rgba(57, 170, 230, 0.1), transparent 28%);
    pointer-events: none;
  }

  @keyframes heroFloat {
    0%, 100% { transform: scale(1.035) translate3d(0, 0, 0); }
    50% { transform: scale(1.055) translate3d(0, -4px, 0); }
  }

  @media (max-width: 1199px) {
    .course-detail-page .course-hero-slide {
      grid-template-columns: 1fr;
    }

    .course-detail-page .course-hero__copy {
      padding-right: 0;
    }

    .course-detail-page .course-hero__title {
      max-width: none;
    }

    .course-detail-page .course-hero__card {
      grid-template-rows: auto auto;
    }

    .course-detail-page .course-hero-slide__copy {
      padding: 1rem;
    }

    .course-detail-page .course-hero-slide__media-wrap {
      min-height: 280px;
    }

    .course-detail-page .course-hero-corner-thumb {
      top: .85rem;
      right: .85rem;
      width: min(42vw, 280px);
      height: auto;
      aspect-ratio: 336 / 208;
    }
  }

  @media (max-width: 960px) {
    .course-detail-page .course-hero-info-grid {
      grid-template-columns: 1fr;
    }

    .course-detail-page .course-hero--async-balanced .course-hero-slide {
      min-height: 0;
    }

    .course-detail-page .course-hero--async-balanced .course-hero-slide__copy {
      padding: 1.45rem 1.15rem 1.35rem;
    }
  }

  @media (max-width: 480px) {
    .course-detail-page .course-hero-corner-thumb {
      position: relative;
      top: auto;
      right: auto;
      width: 100%;
      max-width: 100%;
      margin: .75rem auto 0;
      pointer-events: auto;
    }

    .course-detail-page .course-hero__title {
      font-size: clamp(1.35rem, 6.5vw, 1.85rem);
      line-height: 1.08;
    }
  }

  @keyframes brochureShine {
    0%, 68%, 100% { transform: translateX(-135%); }
    82% { transform: translateX(135%); }
  }