/* 4dsHub V16 — ONLY home game staging + persistent left brand dock */

/* Universe + Kreatif Podcast: always together, same spot on every site page. */
body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock,
body.home-reference-mode.concept-mode .recep-chrome-layer .hero-header .home-brand-dock,
body.home-reference-mode.services-mode .recep-chrome-layer .hero-header .home-brand-dock,
body.home-reference-mode.contact-mode .recep-chrome-layer .hero-header .home-brand-dock,
body.home-reference-mode.power-mode .recep-chrome-layer .hero-header .home-brand-dock,
body.home-reference-mode.form-mode .recep-chrome-layer .hero-header .home-brand-dock{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  right:auto!important;
  bottom:auto!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:clamp(22px,1.8vw,34px)!important;
  width:max-content!important;
  max-width:34vw!important;
  transform:none!important;
  pointer-events:auto!important;
  z-index:2147482050!important;
}
body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button,
body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-universe.brand-universe-footer-trigger,
body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-podcast{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:.96!important;
  position:relative!important;
  inset:auto!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
  pointer-events:auto!important;
}
body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-universe img{
  width:clamp(108px,7vw,138px)!important;
  max-width:none!important;
}
body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-podcast img{
  width:clamp(112px,7.4vw,146px)!important;
  max-width:none!important;
}

/* DESKTOP: intentionally stagger the five games like the approved reference. */
@media (min-width:901px){
  body.home-reference-mode:not(.concept-mode):not(.services-mode):not(.contact-mode):not(.power-mode):not(.brand-universe-mode):not(.form-mode) .home-game-showcase{
    position:absolute!important;
    left:50%!important;
    top:clamp(255px,28.5svh,300px)!important;
    width:min(1510px,94vw)!important;
    height:clamp(520px,61svh,625px)!important;
    transform:translateX(-50%)!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    z-index:80!important;
  }

  body.home-reference-mode:not(.concept-mode):not(.services-mode):not(.contact-mode):not(.power-mode):not(.brand-universe-mode):not(.form-mode) .home-game-link{
    position:absolute!important;
    top:auto!important;
    right:auto!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    display:block!important;
    transform:none!important;
    animation:none!important;
    overflow:visible!important;
  }

  body.home-reference-mode .home-game-link.is-catpuf{
    left:0.7%!important;
    bottom:0%!important;
    width:20.7%!important;
    --float-up:-17px;
    --float-down:27px;
    --float-time:7.3s;
    --float-delay:-1.0s;
  }
  body.home-reference-mode .home-game-link.is-elie{
    left:20.0%!important;
    bottom:11.5%!important;
    width:20.1%!important;
    --float-up:-32px;
    --float-down:16px;
    --float-time:9.1s;
    --float-delay:-6.2s;
  }
  body.home-reference-mode .home-game-link.is-cess{
    left:40.0%!important;
    bottom:16.5%!important;
    width:19.5%!important;
    --float-up:-21px;
    --float-down:29px;
    --float-time:6.4s;
    --float-delay:-2.7s;
  }
  body.home-reference-mode .home-game-link.is-shitart{
    left:59.5%!important;
    bottom:3.5%!important;
    width:21.6%!important;
    --float-up:-36px;
    --float-down:18px;
    --float-time:10.7s;
    --float-delay:-8.4s;
  }
  body.home-reference-mode .home-game-link.is-setris{
    left:80.7%!important;
    bottom:13.0%!important;
    width:18.8%!important;
    --float-up:-26px;
    --float-down:34px;
    --float-time:8.2s;
    --float-delay:-4.6s;
  }

  body.home-reference-mode:not(.concept-mode):not(.services-mode):not(.contact-mode):not(.power-mode):not(.brand-universe-mode):not(.form-mode) .home-game-link img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    object-fit:contain!important;
    transform:translate3d(0,0,0)!important;
    animation:gameFloatV16 var(--float-time) cubic-bezier(.42,.04,.58,.96) var(--float-delay) infinite alternate!important;
    will-change:transform!important;
    backface-visibility:hidden!important;
  }

  @keyframes gameFloatV16{
    0%{transform:translate3d(0,var(--float-down),0)}
    100%{transform:translate3d(0,var(--float-up),0)}
  }
}

/* Short desktop screens: keep the composition visible without flattening it. */
@media (min-width:901px) and (max-height:760px){
  body.home-reference-mode:not(.concept-mode):not(.services-mode):not(.contact-mode):not(.power-mode):not(.brand-universe-mode):not(.form-mode) .home-game-showcase{
    top:clamp(232px,28svh,260px)!important;
    height:clamp(430px,58svh,485px)!important;
    width:min(1380px,92vw)!important;
  }
}

@media (max-width:900px){
  body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.concept-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.services-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.contact-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.power-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.form-mode .recep-chrome-layer .hero-header .home-brand-dock{
    left:0!important;
    top:-82px!important;
    gap:10px!important;
    max-width:58vw!important;
  }
  body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-universe img{width:72px!important;}
  body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-podcast img{width:78px!important;}
}

@media (max-width:520px){
  body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.concept-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.services-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.contact-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.power-mode .recep-chrome-layer .hero-header .home-brand-dock,
  body.home-reference-mode.form-mode .recep-chrome-layer .hero-header .home-brand-dock{
    top:-76px!important;
    gap:6px!important;
    max-width:62vw!important;
  }
  body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-universe img{width:52px!important;}
  body.home-reference-mode .recep-chrome-layer .hero-header .home-brand-dock .home-brand-button.is-podcast img{width:58px!important;}
}

@media (prefers-reduced-motion:reduce){
  body.home-reference-mode .home-game-link img{animation:none!important;will-change:auto!important;}
}