/* LAYEGHMUSIC.COM / BUG FIXES / 2026-10-21  (layout only; no content changes)
   1. News & film pages on phones / landscape phones: the article was squeezed into a
      small inner scroll box (95-290px) under a fixed bar. It now flows as a normal page.
   2. News & film pages: the PLAY/PAUSE button sat on top of the native video controls.
   3. Works on phones: titles scrolled underneath the transparent fixed header.
   4. Works: the fixed bottom bar covered the end of the page.
   5. Room 01 on landscape phones: film panels hid the menu and the bottom navigator. */

/* 1 */
@media (max-width:900px),(orientation:landscape) and (max-height:500px){
 html:root body.film-detail-page.film-detail-page{overflow-y:auto!important;height:auto!important}
 html:root body.film-detail-page.film-detail-page>main{
  position:relative!important;inset:auto!important;top:auto!important;height:auto!important;min-height:0!important;
  overflow:visible!important;padding-top:66px!important;
 }
 html:root body.film-detail-page.film-detail-page .news-detail-stage{display:block!important;height:auto!important;min-height:0!important}
 html:root body.film-detail-page.film-detail-page .news-detail-media{height:auto!important;aspect-ratio:16/9;max-height:none!important}
 html:root body.film-detail-page.film-detail-page .news-detail-media>video{position:static!important;width:100%!important;height:100%!important;object-fit:contain!important}
 html:root body.film-detail-page.film-detail-page .news-detail-copy{display:block!important;height:auto!important;max-height:none!important;overflow:visible!important}
 html:root body.film-detail-page.film-detail-page .news-scroll{height:auto!important;max-height:none!important;overflow:visible!important}
 html:root body.film-detail-page.film-detail-page .site-footer{position:relative!important;inset:auto!important}
}
@media (orientation:landscape) and (max-height:500px){
 html:root body.film-detail-page.film-detail-page .news-detail-media{max-width:min(100%,calc((100svh - 66px) * 16 / 9));margin-inline:auto}
}

/* 2  PLAY/SOUND sit in the top corners of the picture (film-detail-20261021.js measures the letterbox) */
html:root body.film-detail-page.film-detail-page .news-detail-media>.news-play{top:calc(var(--pic-top,0px) + 16px)!important;bottom:auto!important;left:calc(var(--pic-left,0px) + 16px)!important;right:auto!important}
html:root body.film-detail-page.film-detail-page .news-detail-media>.news-sound{top:calc(var(--pic-top,0px) + 16px)!important;bottom:auto!important;right:calc(var(--pic-right,0px) + 16px)!important;left:auto!important}

/* 3 + 4 */
@media (max-width:900px){
 html:root body.atelier-preview.works-page.works-page:not(.menu-open) .site-header{background:rgba(12,11,10,.9)!important}
}
html:root body.atelier-preview.works-page.works-page>main{padding-bottom:calc(58px + env(safe-area-inset-bottom))!important}

/* 5 */
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .site-header,
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .site-header *,
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .at-gallery-controls,
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .at-gallery-controls *{visibility:visible!important}
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .site-header,
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .at-gallery-controls{z-index:4000!important;pointer-events:auto!important}
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .site-header :is(a,button),
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .at-gallery-controls button{pointer-events:auto!important}
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape:not(.menu-open) .site-header{background:linear-gradient(rgba(5,5,5,.72),rgba(5,5,5,0))!important}
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape .room-video-sound,
html:root body.atelier-preview.work-page.work-page.lex-film-landscape.lex-film-landscape [data-room-sound]{translate:0 62px!important}

/* 6  Home hero name on desktop: same treatment as on phones (outlined FAROKHZAD over a larger
      tan LAYEGH, offset right, uppercase serif, tight tracking), scaled for the desktop hero.
      Phone ratios: LAYEGH = 1.514 x FAROKHZAD, offset = .49 x FAROKHZAD. Header/menu untouched. */
@media (min-width:1024px) and (orientation:landscape){
 html:root body.atelier-preview.home-page.home-page .home-stage .at-name{flex-direction:column!important;align-items:flex-start!important;gap:0!important;
  font-size:clamp(64px,min(6.2vw,10.5svh),124px)!important}
 html:root body.atelier-preview.home-page.home-page .home-stage .at-name span{display:block!important;white-space:nowrap!important;
  font:400 1em/.74 var(--at-serif)!important;letter-spacing:-.096em!important;text-transform:uppercase!important;margin:0!important}
 html:root body.atelier-preview.home-page.home-page .home-stage .at-name span:first-child{color:transparent!important;-webkit-text-fill-color:transparent!important;
  -webkit-text-stroke:1px rgba(243,238,230,.96)!important}
 html:root body.atelier-preview.home-page.home-page .home-stage .at-name span:last-child{font-size:1.514em!important;margin-left:.326em!important;
  color:#c49a80!important;-webkit-text-fill-color:#c49a80!important;-webkit-text-stroke:0!important}
}

/* 7  Film/news captions inside room scenes: no inner scrollbar, a calmer title size on desktop,
      and a clear gap above the bottom strip. */
html:root body.atelier-preview.work-page.work-page.work-page .room-chapter:not(#fx-a):not(#fx-b):not(#fx-c) .media-meta{overflow:visible!important;max-height:none!important}
@media (min-width:1024px) and (orientation:landscape){
 html:root body.atelier-preview.work-page.work-page.work-page .room-chapter:not(#fx-a):not(#fx-b):not(#fx-c) .media-meta h3{
  font-size:clamp(28px,min(3vw,5.6svh),48px)!important;line-height:1.08!important;letter-spacing:-.018em!important;max-width:20em!important}
 html:root body.atelier-preview.work-page.work-page.work-page.room-01 [data-immersive-film]:not(#fx-a):not(#fx-b):not(#fx-c) .media-meta{bottom:calc(max(84px,11svh) + 22px)!important}
}

/* 8  Page changes: the cross-page fade was 560ms; keep it, but quick. */
::view-transition-group(root){animation-duration:220ms!important}
::view-transition-old(root),::view-transition-new(root){animation-duration:220ms!important}
