/* Shared viewport geometry for page chrome and text clearance. */
:root {
  --site-overlay-inset: 5vmin;
  --site-gap: 2vmin;
  --site-control-inset: calc(var(--site-overlay-inset) + var(--site-gap));
  --site-control-top: max(var(--site-control-inset), env(safe-area-inset-top));
  --site-control-left: max(var(--site-control-inset), env(safe-area-inset-left));
  --site-control-right: max(var(--site-control-inset), env(safe-area-inset-right));
  --site-control-bottom: max(var(--site-control-inset), env(safe-area-inset-bottom));
  --site-icon-size: 4vmin;
  --site-logo-width: min(20vmin, 120px);
  --site-logo-height: calc(var(--site-logo-width) * 190 / 221);
  --site-header-height: max(var(--site-logo-height), var(--site-icon-size));
  --site-content-top: calc(var(--site-control-top) + var(--site-header-height) + var(--site-gap));
  --site-content-bottom: calc(var(--site-control-bottom) + var(--site-icon-size) + var(--site-gap));
}
@media (min-width: 1023px) {
  :root { --site-logo-width: 22vmin; --site-logo-height: calc(var(--site-logo-width) * 125 / 458); }
}
@media (hover: none) and (pointer: coarse) { :root { --site-icon-size: 8vmin; } }
#site-logo { position: fixed; top: var(--site-control-top); left: var(--site-control-left); width: var(--site-logo-width); z-index: 2147483000; display: block; text-decoration: none; color: inherit; -webkit-tap-highlight-color: transparent; }
#site-logo img { display: block; width: 100%; height: var(--site-logo-height); object-fit: contain; object-position: left top; opacity: .8; }
#site-logo .site-logo-full { display: none; }
@media (min-width: 1023px) {
  #site-logo .site-logo-small { display: none; }
  #site-logo .site-logo-full { display: block; }
}
/* Shared shell:  these controls stay mounted during every internal transition. */
html, body { margin: 0; padding: 0; width: 100%; height: 100%; min-height: 100%; }
body { overflow-x: hidden; }
body[data-page="index"], body[data-page="portfolio-images"] { height: 100%; overflow-y: hidden; }
body[data-page="home"] { height: auto; overflow-y: auto; }
body[data-page="about"], body[data-page="portfolio"], body[data-page="contact"], body[data-page="model"], body[data-page="terms_of_use"], body[data-page="privacy_policy"], body[data-page="2257_compliance"] { height: 100%; overflow: hidden; overscroll-behavior: none; }
#site-view { min-height: 100vh; min-height: 100dvh; opacity: 1; }
#site-controls { position: relative; z-index: 2147483000; }
#hamburger { position: fixed; top: var(--site-control-top); right: var(--site-control-right); z-index: 2147483000; }
#fullscreen { position: fixed; right: var(--site-control-right); bottom: var(--site-control-bottom); z-index: 2147483000; }
#hamburger a, #fullscreen-toggle { display: grid; place-items: center; width: var(--site-icon-size); height: var(--site-icon-size); margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; appearance: none; cursor: pointer; }
#fullscreen-toggle:hover, #fullscreen-toggle:active, #fullscreen-toggle:focus { background: transparent; box-shadow: none; }
#hamburger img, #fullscreen-toggle img { width: var(--site-icon-size); height: var(--site-icon-size); object-fit: contain; background: transparent; border: 0; box-shadow: none; opacity: 1; }
#hamburger img { display: block; }
#fullscreen-toggle img { display: none; }
#fullscreen-toggle[aria-pressed="false"] img.icon-expand { display: block; }
#fullscreen-toggle[aria-pressed="true"] img.icon-restore { display: block; }
#fullscreen-toggle:disabled { opacity: .5; cursor: default; }
#hamburger a:focus-visible, #fullscreen-toggle:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
#fullscreen-status, #navigation-status { color: #fff; background: rgba(0,0,0,.85); padding: 10px; border-radius: 4px; font-size: 13px; }
#fullscreen-status { position: absolute; right: 0; bottom: calc(var(--site-icon-size) + var(--site-gap)); width: min(260px, 75vw); }
#navigation-status { position: fixed; left: var(--site-control-left); right: calc(var(--site-control-right) + var(--site-icon-size) + var(--site-gap)); bottom: var(--site-control-bottom); z-index: 2147483000; }
#fullscreen-status:empty, #navigation-status:empty { display: none; }


#site-logo:hover, #site-logo:active { color: inherit; background: transparent; }

/* Index entry replaces the visible hamburger; other pages retain their menu control. */
#site-entry { display: none; position: fixed; top: 66.666667%; left: 50%; transform: translate(-50%, 50%); z-index: 2147483000; min-width: clamp(100px, 18vmin, 160px); min-height: 44px; }
body[data-page="index"] #site-entry { display: inline-flex; align-items: center; justify-content: center; }
body[data-page="index"] #hamburger { display: none; }

/* Paint the photograph before fading in the content and shared controls. */
#site-view #container, #site-controls, .jgallery .nav-bottom, .jgallery .jgallery-thumbnails, .jgallery .next, .jgallery .prev { transition: opacity .35s ease; }
body.is-loading:not([data-page="index"]) :is(#site-view #container, #site-controls, #gallery, .jgallery .nav-bottom, .jgallery .jgallery-thumbnails, .jgallery .next, .jgallery .prev) { opacity: 0; visibility: hidden; pointer-events: none; }
.slideshow-waiting .slideshow li span { animation-play-state: paused; }
#site-entry { opacity: 0; visibility: hidden; transition: opacity .6s ease; }
body[data-page="index"].index-ready #site-entry { opacity: 1; visibility: visible; }
@media (prefers-reduced-motion: reduce) {
  #site-view #container, #site-controls, .jgallery .nav-bottom, .jgallery .jgallery-thumbnails, .jgallery .next, .jgallery .prev, #site-entry { transition: none; }
}

/* Blend complete page snapshots; initial visits keep the image-first reveal. */
body.is-navigating :is(#site-view #container, #site-controls, .jgallery .nav-bottom, .jgallery .jgallery-thumbnails, .jgallery .next, .jgallery .prev) { transition: none; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; animation-timing-function: ease-in-out; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
body.is-navigating .jgallery .pt-page { animation: none !important; }

/* A desktop drawer reserves space; touch layouts retain their sliding overlay. */
@media (min-width: 800px) and (hover: hover) and (pointer: fine) {
  :root { --site-menu-width: max(220px, calc(var(--site-control-left) + var(--site-logo-width) + var(--site-gap))); }
  body { --site-menu-offset: 0px; }
  body.menu-open:not([data-page="index"]) { --site-menu-offset: var(--site-menu-width); }
  body:not([data-page="index"]) #site-view {
    position: relative;
    display: flow-root;
    width: calc(100% - var(--site-menu-offset));
    height: 100dvh;
    margin-left: var(--site-menu-offset);
    transform: translateZ(0);
    transition: width .65s ease, margin-left .65s ease;
  }
  #home-background { width: 100%; }
  body[data-page="portfolio-images"] .jgallery { inset: 0; width: 100% !important; height: 100% !important; }
  body[data-page="portfolio-images"] .jgallery .zoom-container { width: 100% !important; }
}
@media (prefers-reduced-motion: reduce) { body:not([data-page="index"]) #site-view { transition: none; } }
