/* Mobile and tablet overrides only. Desktop styling remains in style.css. */
@media(max-width:850px){
 html{scroll-padding-top:100px}
 .header-inner{gap:15px}.menu-toggle{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex-shrink:0}
 .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:16px 5% 24px;max-height:calc(100dvh - 108px);overflow-y:auto;overscroll-behavior:contain;border-bottom:1px solid var(--line);box-shadow:0 12px 22px #30332514;gap:5px;flex-direction:column;align-items:stretch}
 .nav.open{display:flex}.nav a:not(.button){padding:12px 8px;min-height:48px;font-size:16px}.nav .button{margin-top:10px;min-height:48px}
 body.mobile-menu-open main,body.mobile-menu-open footer{pointer-events:none}
 .button,.back-link{min-height:48px}.button{font-size:16px}.channel-option{min-height:72px}.channel-option small{font-size:14px}
 .contact-form input,.contact-form textarea{font-size:16px;min-height:48px}.contact-form textarea{min-height:120px}
 .modal-close{width:44px;height:44px;z-index:2}.order-dialog{max-height:calc(100dvh - 24px);overscroll-behavior:contain;scroll-padding:20px}.order-dialog .form-note{font-size:13px}
 .lightbox{max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}.lightbox img{height:auto;max-height:calc(100dvh - 180px)}.lightbox button{min-width:48px;min-height:48px}.lightbox-top{line-height:1.4}
 .work-categories{gap:8px 12px}.work-categories a{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:4px;font-size:14px}
 .floating{bottom:calc(18px + env(safe-area-inset-bottom));right:calc(18px + env(safe-area-inset-right))}
 .contact-form,.contacts>div,.about>div{min-width:0}.contacts p,.channel-option small{overflow-wrap:anywhere}
}
@media(max-width:600px){
 .nav{max-height:calc(100dvh - 84px)}.wrap{padding-left:6%;padding-right:6%}
 .intro h1{font-size:clamp(29px,8.5vw,35px)}.intro-side{font-size:16px}.intro-side p{font-size:16px}
 .hero-gallery{height:365px;scroll-padding-inline:6%;padding-left:6%;padding-right:6%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
 .hero-item,.hero-item:hover,.hero-item:focus-visible{flex:0 0 86%}.hero-item:hover img{transform:none}.hero-caption{font-size:24px;left:18px;bottom:22px}.hero-caption small{font-size:12px}
 .gallery-note{flex-wrap:wrap;gap:4px 14px}.gallery-note span{font-size:12px}.gallery-note .mobile-hint{margin-left:auto}
 .categories{font-size:14px}.section p{font-size:16px}.section{padding-top:48px;padding-bottom:48px}
 .page-heading{padding-top:34px;padding-bottom:28px}.page-heading h1{font-size:clamp(32px,10vw,40px)}
 .work-group .section-head{gap:14px}.group-count{white-space:nowrap}.work-group .section-head h2{font-size:26px}.work-card small{font-size:13px}.work-card figcaption{font-size:21px}
 .order-dialog{width:calc(100% - 20px);max-width:none;padding:48px 22px 24px;border-radius:12px}.order-dialog h2{font-size:28px;margin-right:0}.order-dialog .eyebrow{font-size:11px}.channel-option{gap:12px}.channel-option small{font-size:14px}.channel-option strong{font-size:16px}
 .contact-form{padding:24px 20px}.contact-form .button{width:100%}.form-fields{grid-template-columns:1fr;gap:0}
 .lightbox{padding:12px;width:calc(100% - 20px);max-width:none}.lightbox-top{font-size:16px}.lightbox-top>span{flex:1;min-width:0}
 footer{padding-bottom:calc(95px + env(safe-area-inset-bottom));font-size:13px}.portrait{min-height:320px}
}
@media(max-width:850px) and (orientation:landscape) and (max-height:500px){
 .order-dialog,.lightbox{max-height:calc(100dvh - 16px)}.order-dialog{padding-top:35px}.lightbox img{max-height:55dvh}
}