/* PRO.REMONT51 v6 — responsive layer for v5's full-screen galleries.
   Desktop art direction and original GLB are unchanged. */
html,body{max-width:100%;overflow-x:clip}
.hero, .chapter-sticky{min-width:0}
/* Give touch targets room without changing the desktop layout. */
@media (hover:none),(pointer:coarse){
  .menu-toggle,.chapter .skip-experience,.floating-main,.compare-chip{touch-action:manipulation}
}
@media (max-width:800px){
  html{scroll-padding-top:70px}
  .site-header{padding-inline:clamp(14px,4vw,23px);height:calc(70px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px)}
  .site-header.is-scrolled{height:calc(65px + env(safe-area-inset-top,0px))}
  .header-brand{min-width:0;letter-spacing:.045em}
  .main-nav.is-open{max-height:calc(100svh - 65px - env(safe-area-inset-top,0px));overflow-y:auto;overscroll-behavior:contain}
  .hero{min-height:100svh;min-height:100dvh}
  .hero-content{min-width:0;max-width:100%;padding:clamp(108px,16svh,144px) 6vw clamp(105px,14svh,138px)}
  .hero h1{font-size:clamp(1.85rem,9.25vw,4.25rem);letter-spacing:-.055em;overflow-wrap:anywhere}
  .hero h2{font-size:clamp(1.45rem,5.8vw,2.55rem)}
  .hero-actions .btn{max-width:100%}
  .chapter{height:calc(var(--scene-steps) * 100svh)}
  .chapter .chapter-sticky{height:100svh;min-height:0;overflow:hidden;isolation:isolate}
  .chapter .stage-body{position:static;padding:0;width:100%;height:100%;min-height:0;pointer-events:none}
  /* Keep each real GLB door as a separate full-viewport 3D scene. */
  .chapter .door-stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;min-height:0!important;transform:none!important;overflow:hidden!important;perspective:none}
  .chapter .door-webgl-host{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
  .chapter .door-webgl-host canvas{width:100%;height:100%;display:block}
  /* Important: the gallery is a SIBLING of .stage-body in v5, not its child.
     The original 16:9 photos must be entirely visible on portrait screens. */
  .chapter-sticky>.fullscreen-gallery{position:absolute;inset:0;width:100%;height:100%;background:#17252a;overflow:hidden;isolation:isolate}
  .chapter-sticky>.fullscreen-gallery::before{
    content:"";position:absolute;inset:-24px;z-index:0;pointer-events:none;
    background-image:linear-gradient(#111e2470,#111e2470),var(--photo-backdrop);
    background-size:cover;background-position:center;
    filter:blur(16px) saturate(.85);transform:scale(1.025);
  }
  .chapter-sticky>.fullscreen-gallery .photo-zoom{
    display:block!important;position:absolute!important;
    inset:calc(88px + env(safe-area-inset-top,0px)) 0 calc(94px + env(safe-area-inset-bottom,0px))!important;
    width:100%!important;height:auto!important;max-width:none!important;overflow:hidden;
    background:transparent!important;z-index:1;
  }
  .chapter-sticky>.fullscreen-gallery .photos-layer{position:absolute!important;inset:0!important;width:100%;height:100%;background:transparent}
  .chapter-sticky>.fullscreen-gallery .scene-photo{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
    object-fit:contain!important;object-position:center center!important;
  }
  .chapter-sticky>.fullscreen-gallery .photo-shading{pointer-events:none;opacity:.12}
  .chapter.is-entered .chapter-sticky::after{display:none!important}
  .chapter .chapter-meta{top:calc(79px + env(safe-area-inset-top,0px));left:0;right:0;padding:0 16px;z-index:12}
  .chapter .chapter-tag{display:none}
  .chapter .project-ident{
    position:absolute;top:calc(132px + env(safe-area-inset-top,0px));left:13px;right:13px;
    width:auto;max-width:none;text-align:center;align-items:center;gap:5px;z-index:9;pointer-events:none
  }
  .chapter .project-ident strong{font-size:clamp(1.43rem,5.7vw,2.1rem);line-height:1.12}
  .chapter .project-ident-caption{font-size:clamp(.66rem,2.45vw,.82rem);line-height:1.25}
  .chapter.is-entered .project-ident{opacity:0!important;pointer-events:none}
  .chapter .chapter-prompt{
    position:absolute;bottom:calc(16px + env(safe-area-inset-bottom,0px));left:50%;
    transform:translateX(-50%);width:max-content;max-width:calc(100% - 24px);
    text-align:center;padding:8px 12px;line-height:1.3;z-index:11
  }
  .chapter .chapter-bottom{bottom:calc(70px + env(safe-area-inset-bottom,0px));padding:0 16px;z-index:9}
  .chapter .chapter-bottom span:first-child{font-size:.69rem;max-width:100%}
  .chapter .skip-experience{
    position:absolute;left:50%;right:auto;
    bottom:calc(83px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);
    z-index:14;min-height:43px;padding:10px 17px;white-space:nowrap
  }
  .chapter .chapter-gallery-hud{
    position:absolute;left:calc(12px + env(safe-area-inset-left,0px))!important;
    bottom:calc(15px + env(safe-area-inset-bottom,0px))!important;
    transform:none!important;width:auto;min-width:0;max-width:calc(100vw - 24px);
    padding:8px 11px;gap:3px;z-index:11!important
  }
  .chapter .chapter-gallery-hud .hud-word,.chapter .chapter-gallery-hud .hud-fraction{font-size:.54rem}
  .chapter .chapter-gallery-hud .hud-caption{font-size:.74rem;line-height:1.3}
  .chapter--country .chapter-gallery-hud{max-width:calc(100vw - 163px)!important}
  .chapter .compare-chip{
    left:auto!important;right:calc(12px + env(safe-area-inset-right,0px))!important;
    bottom:calc(16px + env(safe-area-inset-bottom,0px))!important;top:auto!important;
    max-width:135px;min-height:42px;z-index:13!important;
    font-size:.67rem;padding:8px 10px;transform:none!important
  }
  /* The contact button must not cover the gallery, its caption or comparison action. */
  body.is-door-scene .floating-contacts{display:none!important}
  .floating-contacts{right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));transition:opacity .12s,visibility .12s}
  .chapter.three-error .skip-experience,.chapter.three-error .chapter-prompt{display:none!important}
  .chapter.three-error .fullscreen-gallery{opacity:1!important;pointer-events:auto!important}
  .chapter.three-error .fullscreen-gallery .photo-zoom{pointer-events:auto!important}
  .image-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0}
  .dialog-top{min-height:calc(58px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 12px 0}
  .dialog-center{min-width:0;width:100%;overflow:hidden}
  .dialog-center img{min-width:0;max-width:calc(100vw - 90px);max-height:100%;object-fit:contain}
  .dialog-bottom{padding-inline:12px;gap:9px}
}
@media(max-width:400px){
  .header-brand{font-size:.84rem}
  .chapter .project-ident{top:calc(115px + env(safe-area-inset-top,0px))}
  .chapter .project-ident strong{font-size:clamp(1.36rem,5.7vw,1.7rem)}
  .chapter .project-ident-caption{font-size:.65rem}
  .chapter .chapter-gallery-hud .hud-caption{font-size:.7rem}
  .chapter--country .chapter-gallery-hud{max-width:calc(100vw - 156px)!important}
  .chapter .compare-chip{max-width:129px;font-size:.63rem}
}
@media(max-width:800px) and (max-height:700px){
  .chapter .project-ident{top:calc(101px + env(safe-area-inset-top,0px))}
  .chapter .project-ident-caption,.chapter .chapter-bottom{display:none}
  .chapter .skip-experience{bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  .chapter-sticky>.fullscreen-gallery .photo-zoom{
    inset:calc(65px + env(safe-area-inset-top,0px)) 0 calc(77px + env(safe-area-inset-bottom,0px))!important
  }
}
/* Short landscape phones: keep the photograph and its caption usable. */
@media(max-width:900px) and (max-height:480px) and (orientation:landscape){
  .chapter .chapter-meta,.chapter .project-ident-caption,.chapter .chapter-bottom{display:none}
  .chapter .project-ident{top:65px}
  .chapter-sticky>.fullscreen-gallery .photo-zoom{inset:60px 0 60px!important}
  .chapter .skip-experience{bottom:18px}
  .chapter .chapter-gallery-hud{bottom:8px!important}
  .chapter .chapter-gallery-hud .hud-word{display:none}
  .chapter .chapter-gallery-hud .hud-caption{font-size:.67rem}
}
/* Low-motion version uses the existing static photo grids. */
@media(prefers-reduced-motion:reduce){
  .chapter.chapter--reduced{height:auto!important;min-height:0!important}
  .chapter.chapter--reduced .chapter-sticky{
    height:auto!important;min-height:0!important;position:relative!important;display:block!important;
    padding:105px 18px 44px!important
  }
  .chapter.chapter--reduced .stage-body,.chapter.chapter--reduced .door-stage,
  .chapter.chapter--reduced .fullscreen-gallery{display:none!important}
  .chapter.chapter--reduced .project-ident{position:relative!important;inset:auto!important;opacity:1!important;margin-bottom:22px!important}
  .chapter.chapter--reduced .reduced-gallery-title{display:block!important}
  .chapter.chapter--reduced .reduced-gallery{display:grid!important}
  .chapter.chapter--reduced .compare-chip{position:relative!important;inset:auto!important;transform:none!important;margin:22px 0 0!important}
}

/* The no-WebGL fallback displays photos immediately: hide door-only headings. */
.chapter.three-error .project-ident,.chapter.three-error .chapter-bottom{display:none!important}

/* Horizontal phone screens can be wider than 800 CSS pixels: retain the touch menu
   and full image viewport rather than squeezing desktop navigation into 390px height. */
@media(min-width:801px) and (max-width:950px) and (max-height:480px) and (orientation:landscape) and (pointer:coarse){
 .site-header{height:58px;padding:0 18px}
 .main-nav{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;background:#1c282ef8;gap:0;padding:8px 20px;max-height:calc(100svh - 58px);overflow-y:auto}
 .main-nav.is-open{display:flex}
 .main-nav a{padding:8px 0;border-bottom:1px solid #ffffff16}
 .menu-toggle{display:block}
 .chapter .door-stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;min-height:0!important}
 .chapter-sticky>.fullscreen-gallery{position:absolute;inset:0}
 .chapter-sticky>.fullscreen-gallery .photo-zoom{inset:58px 0 55px!important;height:auto!important}
 .chapter-sticky>.fullscreen-gallery .scene-photo{object-fit:contain!important}
 .chapter .chapter-meta,.chapter .chapter-bottom{display:none}
 .chapter .chapter-gallery-hud{bottom:8px!important;left:12px!important;padding:5px 9px}
 .chapter .compare-chip{bottom:9px!important}
 body.is-door-scene .floating-contacts{display:none!important}
}
/* A phone rotated sideways is only 390px tall: the usual centred hero pushed
   the title entirely above the viewport. Make that hero vertically scrollable. */
@media(max-width:950px) and (max-height:480px) and (orientation:landscape) and (pointer:coarse){
 .hero{height:auto!important;min-height:560px!important;align-items:flex-start!important;overflow:hidden}
 .hero-content{padding:95px 6vw 105px!important;max-width:850px}
 .hero h1{font-size:clamp(2.1rem,5.2vw,3.5rem)!important}
 .hero h2{font-size:clamp(1.28rem,3vw,2rem)!important;line-height:1.25!important}
 .hero-meta{font-size:.7rem}
 .hero-actions{display:flex;flex-flow:row wrap;max-width:680px}
 .hero-actions .btn{width:auto;min-height:42px}
 .hero-bottom{bottom:15px}
}


/* v6.1: reliable compact fallback and genuinely usable reduced-motion view.
   Do not make visitors scroll through several empty walls when WebGL fails. */
.chapter.chapter--static,.chapter.chapter--reduced{height:auto!important;min-height:0!important}
.chapter.chapter--static .chapter-sticky,.chapter.chapter--reduced .chapter-sticky{
 position:relative!important;display:block!important;height:auto!important;min-height:0!important;
 padding:clamp(100px,14vw,135px) clamp(14px,4vw,28px) 44px!important;overflow:hidden
}
.chapter.chapter--static .stage-body,.chapter.chapter--static .door-stage,
.chapter.chapter--static .fullscreen-gallery,.chapter.chapter--static .chapter-meta,
.chapter.chapter--static .chapter-gallery-hud,.chapter.chapter--static .chapter-bottom,
.chapter.chapter--static .chapter-prompt,.chapter.chapter--static .skip-experience,
.chapter.chapter--reduced .stage-body,.chapter.chapter--reduced .door-stage,
.chapter.chapter--reduced .fullscreen-gallery,.chapter.chapter--reduced .chapter-meta,
.chapter.chapter--reduced .chapter-gallery-hud,.chapter.chapter--reduced .chapter-bottom,
.chapter.chapter--reduced .chapter-prompt,.chapter.chapter--reduced .skip-experience{display:none!important}
.chapter.chapter--static .project-ident,.chapter.chapter--reduced .project-ident{
 display:flex!important;position:relative!important;inset:auto!important;transform:none!important;
 opacity:1!important;visibility:visible!important;align-items:center!important;text-align:center!important;
 margin:0 auto 20px!important;width:100%!important;max-width:680px!important
}
.chapter .reduced-gallery-title{display:none!important}
.chapter.chapter--static .reduced-gallery,.chapter.chapter--reduced .reduced-gallery{
 display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));
 gap:clamp(12px,2.2vw,22px);width:min(1060px,100%);margin-inline:auto;
 position:relative;z-index:6
}
.reduced-gallery-item{display:flex;flex-direction:column;gap:10px;min-width:0;text-align:left;
 padding:9px 9px 13px;background:#17252ccf;border:1px solid #cba8765c;color:#f3ebe0;
 box-shadow:0 10px 28px #0003;cursor:zoom-in;border-radius:4px}
.reduced-gallery-item img{display:block;width:100%;aspect-ratio:16/9;height:auto;object-fit:contain;
 background:#0d171d;user-select:none}
.reduced-gallery-item span{padding:0 3px;font-size:clamp(.77rem,2.7vw,.95rem);line-height:1.4}
.chapter.chapter--static .compare-chip,.chapter.chapter--reduced .compare-chip{
 display:flex!important;position:relative!important;inset:auto!important;
 margin:22px auto 0!important;transform:none!important;opacity:1!important;
 visibility:visible!important;pointer-events:auto!important;width:max-content
}
/* Fullscreen lightbox uses remaining height rather than a fixed sum that
   ignored iOS safe areas and shrank images on 320px screens. */
@media (max-width:800px),((max-height:480px) and (pointer:coarse)){
 .image-dialog{display:flex;flex-direction:column;height:100dvh;max-height:100dvh;overflow:hidden}
 .image-dialog:not([open]){display:none}
 .image-dialog .dialog-top{flex:0 0 auto;height:auto;min-height:calc(58px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px)}
 .image-dialog .dialog-center{flex:1 1 auto;height:auto!important;min-height:0;width:100%;position:relative;padding:8px 8px;gap:0}
 .image-dialog .dialog-center img{width:100%;height:100%;min-width:0;max-width:100%!important;max-height:100%!important;object-fit:contain}
 .image-dialog .dialog-arrow{flex:none;position:absolute;z-index:2;top:50%;transform:translateY(-50%);
   width:42px;height:48px;background:#132329cc;border-color:#ffffff86;touch-action:manipulation}
 .image-dialog #image-prev{left:4px}
 .image-dialog #image-next{right:4px}
 .image-dialog .dialog-bottom{flex:0 0 auto;height:auto;min-height:58px;padding:10px max(12px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));gap:10px}
 .image-dialog .dialog-bottom #dialog-caption{min-width:0;overflow-wrap:anywhere}
 .site-header{padding-left:max(14px,env(safe-area-inset-left,0px));padding-right:max(14px,env(safe-area-inset-right,0px))}
}
/* Fallback's heading lives outside the hidden 3D stage. */
.chapter.chapter--static .reduced-gallery-title,.chapter.chapter--reduced .reduced-gallery-title{
 display:block!important;position:relative;z-index:6;text-align:center;
 margin:0 auto 24px;max-width:800px;padding:0 10px;
 font:500 clamp(1.65rem,5vw,2.7rem)/1.15 Georgia,'Times New Roman',serif;
 color:#fff3df;text-shadow:0 2px 8px #0007;
}
.chapter--kids.chapter--static .reduced-gallery-title,.chapter--kids.chapter--reduced .reduced-gallery-title{
 color:#25343b;text-shadow:0 1px 2px #fff9
}
