/* FloS /topics/ — PC hero clean rebuild v31
 * Scope: desktop hero only.
 * Goal: preserve the approved Picture2 room composition, let the room/background
 * remain visible behind the copy, and replace the old recommendation mascot with
 * the exact user-supplied three-finger Champsoon. Mobile/lower cards untouched.
 */
@media (min-width:761px){
  .topics-home-v3 .th-hero-v15{
    position:relative!important;
    isolation:isolate!important;
    grid-template-columns:minmax(0,.52fr) minmax(0,.48fr)!important;
    min-height:390px!important;
    overflow:hidden!important;
    background-image:url("/assets/img/topics-home-bg-v18.webp?v=20261003-v31")!important;
    background-position:center 52%!important;
    background-size:cover!important;
    background-repeat:no-repeat!important;
  }

  /* Keep the studio/book-room visible all the way through the text side.
     Only a soft readability veil remains; no hard white split/seam. */
  .topics-home-v3 .th-hero-v15::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    display:block!important;
    background:linear-gradient(
      90deg,
      rgba(255,250,244,.34) 0%,
      rgba(255,250,244,.24) 23%,
      rgba(255,249,243,.13) 40%,
      rgba(255,247,241,.045) 58%,
      rgba(255,246,240,0) 72%
    )!important;
    pointer-events:none!important;
  }
  .topics-home-v3 .th-hero-v15::after{
    content:none!important;
    display:none!important;
  }

  .topics-home-v3 .th-hero-v15-copy{
    position:relative!important;
    z-index:5!important;
  }

  /* Old recommendation-board Champsoon is desktop-only hidden. */
  .topics-home-v3 .th-hero-v15-mobile-mascot{
    display:none!important;
  }

  .topics-home-v3 .th-hero-v15-art{
    position:relative!important;
    z-index:4!important;
    min-width:0!important;
    overflow:visible!important;
  }

  /* Exact original supplied by the user. No redraw, stretch, crop, or finger edit. */
  .topics-home-v3 .th-hero-v15-art::before{
    content:""!important;
    position:absolute!important;
    z-index:4!important;
    right:5.4%!important;
    bottom:-5px!important;
    width:318px!important;
    height:402px!important;
    background:url("/assets/img/champsoon-top3-exact-v31.webp?v=20261003-v31") center bottom/contain no-repeat!important;
    filter:drop-shadow(0 15px 22px rgba(151,72,111,.12))!important;
    pointer-events:none!important;
  }

  .topics-home-v3 .th-hero-v15-handnote{
    position:absolute!important;
    z-index:7!important;
    top:44px!important;
    right:30px!important;
  }
}
