/* FINAL FIX: Header/chrome is visible only on normal pages. It must never sit on top of modal/window content. */
body.fiktir-open .recep-chrome-layer,
body.bok-open .recep-chrome-layer,
body.don-open .recep-chrome-layer,
body.recep-podcast-open .recep-chrome-layer,
body.digital-twin-modal-open .recep-chrome-layer,
body.brief-modal-open .recep-chrome-layer,
body.partners-modal-open .recep-chrome-layer,
body.lexor-modal-open .recep-chrome-layer,
body.butterfly-modal-open .recep-chrome-layer,
body.brand-universe-mode .recep-chrome-layer,
html.pf-lock .recep-chrome-layer{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  display:none!important;
}

/* Keep real windows above everything and remove old header bleed-through. */
.fiktir-modal,
.bok-modal,
.don-modal,
.don-overlay,
.recep-podcast-modal,
.recep-podcast-overlay,
.dt-modal-overlay,
.brief-modal-overlay,
.partners-modal-overlay,
.lexor-modal,
.lexor-modal-overlay,
.butterfly-modal,
.butterfly-modal-overlay,
.brand-universe-stage{
  z-index:2147483647!important;
}

/* Normal internal pages: header remains at the top; page content starts below it. */
body.concept-mode .concept-pages,
body.services-mode #services-stage,
body.services-mode .services-stage,
body.contact-mode #contact-stage,
body.contact-mode .contact-stage,
body.power-mode #power-stage,
body.power-mode .power-stage{
  margin-top:260px!important;
  padding-top:0!important;
  z-index:100!important;
}
body.concept-mode .concept-page{
  padding-top:24px!important;
}
body.services-mode .services-stage,
body.contact-mode .contact-stage,
body.power-mode .power-stage{
  position:relative!important;
}

/* Mobile: stable header space before page content; no overlay on filters/forms/cards. */
@media(max-width:900px){
  body.concept-mode .concept-pages,
  body.services-mode #services-stage,
  body.services-mode .services-stage,
  body.contact-mode #contact-stage,
  body.contact-mode .contact-stage,
  body.power-mode #power-stage,
  body.power-mode .power-stage{
    margin-top:560px!important;
    padding-top:0!important;
  }
  body.concept-mode .concept-page{
    padding-top:18px!important;
  }
}

@media(max-width:520px){
  body.concept-mode .concept-pages,
  body.services-mode #services-stage,
  body.services-mode .services-stage,
  body.contact-mode #contact-stage,
  body.contact-mode .contact-stage,
  body.power-mode #power-stage,
  body.power-mode .power-stage{
    margin-top:520px!important;
  }
}

/* Home only: keep the footer/logo-bar below the mobile header area and never in it. */
@media(max-width:900px){
  body:not(.concept-mode):not(.services-mode):not(.contact-mode):not(.power-mode):not(.brand-universe-mode):not(.fiktir-open):not(.bok-open):not(.don-open):not(.recep-podcast-open):not(.brief-modal-open) .site{
    padding-top:560px!important;
    min-height:1320px!important;
  }
  body:not(.concept-mode):not(.services-mode):not(.contact-mode):not(.power-mode):not(.brand-universe-mode):not(.fiktir-open):not(.bok-open):not(.don-open):not(.recep-podcast-open):not(.brief-modal-open) .home-logo-bar{
    margin-top:0!important;
    margin-bottom:34px!important;
    width:100vw!important;
    max-width:100vw!important;
    overflow:hidden!important;
  }
  body:not(.concept-mode):not(.services-mode):not(.contact-mode):not(.power-mode):not(.brand-universe-mode):not(.fiktir-open):not(.bok-open):not(.don-open):not(.recep-podcast-open):not(.brief-modal-open) .home-logo-bar img{
    width:1200px!important;
    max-width:none!important;
    transform:translateX(-50%)!important;
    left:50%!important;
    position:relative!important;
  }
}