/* The phone layout shares the original artwork, media and desktop design. */
@media (max-width:680px), (max-width:960px) and (max-height:500px){
 :root{--gp-phone-nav-space:calc(96px + env(safe-area-inset-bottom,0px))}
 body{padding-bottom:var(--gp-phone-nav-space)}
 .gp-side-nav{top:auto;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));transform:none;flex-direction:row;align-items:center;justify-content:space-around;gap:0;width:auto;max-width:400px;margin-inline:auto;padding:5px 4px;border:1px solid #ffffff1b;border-radius:22px;background:linear-gradient(145deg,#252b32ed,#15191fed);box-shadow:0 8px 32px #0006,inset 0 1px 0 #ffffff0b;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);pointer-events:auto}
 .gp-side-nav .gp-glass-button{flex:0 1 78px;width:clamp(62px,19vw,78px);height:64px;min-width:0;border-radius:14px;touch-action:manipulation}
 .gp-side-nav .gp-glass-button:hover{transform:none}
 .gp-contact-open .gp-side-nav,.gp-viewer-open .gp-side-nav,.fc-viewer-open .gp-side-nav,body:has(.gallery-lightbox[open]) .gp-side-nav{visibility:hidden;pointer-events:none}
 .experience-story{height:340svh}
 .experience-story .stage{height:100vh;height:100dvh}
 .experience-story .intro,.experience-story .ending{top:10%;left:6vw;right:6vw}
 .experience-story .intro h1{font-size:clamp(42px,12vw,58px);line-height:1.05;letter-spacing:-.055em;margin:20px 0}
 .experience-story .hint{margin-top:22px;font-size:12px}
 .experience-story .ending h2{font-size:clamp(32px,9.5vw,44px);line-height:1.08}
 .experience-story .package-copy{display:none}
 .experience-story .package-copy h2{font-size:clamp(28px,8.5vw,38px)}
 .experience-story .loading-note{bottom:calc(var(--gp-phone-nav-space) + 12px);font-size:11px}
 .categories{padding:56px 6vw 48px}
 .categories-heading h2{font-size:clamp(34px,10vw,44px);line-height:1.06}
 .categories-heading>p{font-size:13px;line-height:1.65}
 .category-grid{gap:40px}
 .category-caption h3{font-size:23px}
 .category-caption small{font-size:11px;line-height:1.5}
 .category-actions{gap:9px;flex-wrap:wrap}
 .category-actions button{min-height:44px;min-width:44px;padding:10px 14px;font-size:12px;touch-action:manipulation}
 .animation-viewer{height:100dvh}
 .animation-viewer>.category-card{width:96vw}
 .animation-viewer .category-visual{height:calc(100dvh - 144px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 .animation-viewer .category-caption{width:fit-content;max-width:100%;margin:8px auto 0;padding:8px 12px;background:#15191fe6;border:1px solid #ffffff1a;border-radius:16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
 .animation-viewer .category-caption>div{gap:4px 12px}
 .animation-viewer .category-caption h3{font-size:14px}
 .animation-viewer .category-actions button{font-size:12px;padding:8px 10px;min-height:44px}
 .animation-viewer[data-fit-display] .category-visual{height:calc(100% - 72px)}
 .animation-viewer[data-fit-display] .category-caption{height:64px;max-width:100%;margin:8px auto 0;padding:6px 12px}
 .animation-viewer-close{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));width:44px;height:44px;background:#15191fd9;border:1px solid #ffffff25;border-radius:50%;font-size:30px}
 .fc-pin{height:calc(100svh - var(--gp-phone-nav-space));min-height:0}
 .fc-heading{top:24px;left:6vw;right:6vw}
 .fc-heading h2{font-size:clamp(28px,9vw,36px)}
 .fc-window{inset:108px 0 76px}
 .fc-stage-controls{left:6vw;gap:18px}
 .fc-stage-controls button{min-height:44px;min-width:44px;font-size:11px;touch-action:manipulation}
 .fc-visual{inset:43px 0 0;height:calc(100% - 43px)}
 .fc-footer{left:6vw;right:6vw;bottom:14px;padding-top:0}
 .fc-scroll-note p{font-size:10px}
 .fc-scroll-note small{font-size:9px}
 .fc-floating-viewer{height:100dvh}
 .fc-floating-viewer canvas{top:8dvh;height:84dvh}
 .gallery-hero,.gallery-collection,.gallery-footer{padding-left:6vw;padding-right:6vw}
 .gallery-hero{padding-top:30px;padding-bottom:28px;min-height:0}
 .gallery-hero .gallery-eyebrow,.gallery-ready .gallery-hero .gallery-eyebrow{max-width:none;margin-top:40px;font-size:9px}
 .gallery-hero h1,.gallery-ready .gallery-hero h1{font-size:clamp(48px,13.5vw,64px)}
 .gallery-intro{font-size:14px;line-height:1.65;max-width:30ch}
 .gallery-collection{padding-top:18px;padding-bottom:48px}
 .gallery-toolbar{gap:14px 12px;margin-bottom:24px}
 .gallery-filters{gap:8px}
 .gallery-filters button{min-height:44px;padding:11px 16px;font-size:13px;touch-action:manipulation}
 .gallery-category select,.gallery-search input{min-height:48px;font-size:16px}
 .gallery-grid{gap:26px 12px}
 .gallery-caption{font-size:12px;line-height:1.5;padding:12px 0 0}
 .gallery-caption small{font-size:11px;line-height:1.45}
 .gallery-more,.gallery-no-results button{min-height:48px;font-size:13px;padding:12px 22px;touch-action:manipulation}
 .gallery-lightbox{height:100dvh;padding:max(66px,calc(env(safe-area-inset-top) + 54px)) 12px max(88px,calc(env(safe-area-inset-bottom) + 72px))}
 .gallery-lightbox figure img,.gallery-lightbox figure video{max-height:calc(100dvh - 180px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 .gallery-lightbox button{width:44px;height:44px;touch-action:manipulation}
 .gallery-lightbox-close{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}
 .gallery-prev,.gallery-next{bottom:max(16px,env(safe-area-inset-bottom))}
 .gallery-lightbox-count{bottom:max(32px,calc(env(safe-area-inset-bottom) + 14px))}
 .gp-contact-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:20px}
 .gp-contact-inner{padding:34px 24px 26px}
 .gp-contact-close{top:10px;right:10px;width:44px;height:44px}
 .gp-contact-title{font-size:32px;margin-right:20px}
 .gp-contact-field input,.gp-contact-field textarea{font-size:16px;min-height:48px}
 .gp-contact-send{min-height:48px;font-size:14px}
 .after{padding:56px 6vw 48px;min-height:50svh}
 .after h2{font-size:clamp(34px,10vw,48px)}
}
@media (max-width:960px) and (max-height:500px){
 :root{--gp-phone-nav-space:calc(76px + env(safe-area-inset-bottom,0px))}
 .gp-side-nav{max-width:330px;padding:2px 4px;border-radius:18px;bottom:max(7px,env(safe-area-inset-bottom))}
 .gp-side-nav .gp-glass-button{height:52px;max-width:66px}
 .experience-story .intro,.experience-story .ending{top:13%;left:5vw;right:auto;max-width:43vw}
 .experience-story .intro h1{font-size:34px}
 .experience-story .hint{font-size:11px;margin-top:15px}
 .experience-story .ending h2,.experience-story .package-copy h2{font-size:28px}
 .experience-story .package-copy{top:10%;left:5vw;right:auto;max-width:42vw}
 .fc-heading{top:16px}.fc-heading h2{font-size:28px}.fc-heading>p{margin-bottom:5px}
 .fc-window{inset:78px 0 56px}.fc-footer{bottom:8px}
 .fc-scroll-note p{font-size:9px}.fc-scroll-note small{display:none}
 .animation-viewer .category-visual{height:calc(100dvh - 100px)}
 .animation-viewer[data-fit-display] .category-visual{height:calc(100% - 60px)}
 .animation-viewer[data-fit-display] .category-caption{height:52px}
}
@media (prefers-reduced-motion:reduce) and (max-width:680px), (prefers-reduced-motion:reduce) and (max-width:960px) and (max-height:500px){.experience-story{height:100svh}}