/* FXCHS V3.26 – one reading axis, stable phone width, quieter map placeholders.
   This follows V3.25. The rounded cinema viewport and floating room layout
   deliberately remain as they are. */

/* The V3.25 rule matched only a direct child of main (offer pages), while
   normal blog/project pages render their heading inside main > article.
   The heading and white text paper must share the same centred 820px rail. */
html.fxv2-js body.fxv2 :is(.fxv2-hybrid-panel,.fxv2-detail-panel)
  main.fxv2-article-page > article > :is(.fxv2-article-intro,.fxv2-article-content),
html.fxv2-js body.fxv2 :is(.fxv2-hybrid-panel,.fxv2-detail-panel)
  main.fxv2-article-page > .fxv2-article-intro {
  box-sizing:border-box!important;
  min-width:0!important;
  width:100%!important;
  max-width:820px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Cover images and the embedded film stay on the same reading axis. Keep
   genuinely wide, finger-scrollable panoramas free to use their own width. */
html.fxv2-js body.fxv2 :is(.fxv2-hybrid-panel,.fxv2-detail-panel)
  main.fxv2-article-page > article > :is(.fxv2-article-film,.fxv2-article-cover:not(.fxv260-wide-pano)) {
  box-sizing:border-box;
  min-width:0;
  max-width:min(100%,820px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* A predictable mobile column prevents a wide inner element from pushing
   an article against one edge. Scroll only overflowing code/table content. */
@media(max-width:700px) {
  html.fxv2-js body.fxv2 :is(.fxv2-hybrid-panel,.fxv2-detail-panel)
    main.fxv2-article-page > article {
    box-sizing:border-box;
    min-width:0;
    max-width:100%;
  }
  html.fxv2-js body.fxv2 :is(.fxv2-hybrid-panel,.fxv2-detail-panel)
    main.fxv2-article-page > article > :is(.fxv2-article-intro,.fxv2-article-content) {
    max-width:100%!important;
  }
  html.fxv2-js body.fxv2 :is(.fxv2-hybrid-panel,.fxv2-detail-panel)
    main.fxv2-article-page :is(pre,table) {
    max-width:100%;
    overflow-x:auto;
  }
}

/* The empty map state is an invitation, not a fictional street map. Loading
   still happens only on an explicit button press in fxchs-v322.js. */
body.fxv2 .fxv322-map-stage > .fxv322-map-placeholder {
  display:grid;
  place-items:center;
  background:radial-gradient(circle at 52% 44%,#dbece0 0 16%,transparent 65%),
             linear-gradient(135deg,#d4e4d8,#b8d1c2);
  opacity:1;
}
body.fxv2 .fxv322-map-stage > .fxv322-map-placeholder::before {
  content:'Karte auf Wunsch';
  position:relative;
  z-index:1;
  padding:10px 15px;
  border:1px solid #8cb5a0;
  border-radius:10px;
  background:rgba(245,253,247,.78);
  color:#335a45;
  font:750 12px/1.35 system-ui,sans-serif;
  letter-spacing:.02em;
  text-align:center;
}
body.fxv2 .fxv322-map-stage > .fxv322-map-placeholder::after {
  content:none;
}