/* Shared small-screen layout and navigation for Sellars Projects pages. */
.mobile-menu{display:none;position:relative}
.mobile-menu>summary{list-style:none;cursor:pointer;user-select:none}
.mobile-menu>summary::-webkit-details-marker{display:none}
.mobile-menu-panel{display:none}
img,video{max-width:100%}
:focus-visible{outline:3px solid #617457;outline-offset:3px}
@media(max-width:760px){
 html{overflow-x:clip;scroll-padding-top:78px}
 .wrap{width:calc(100% - 32px)!important}
 .top,.topbar{position:relative;z-index:50;min-height:64px;height:auto;overflow:visible}
 .brand{font-size:12px;gap:8px}
 .nav{position:static;display:flex;align-items:center;justify-content:flex-end;gap:0}
 .nav>a{display:none!important}
 .mobile-menu{display:block;margin-left:auto}
 .mobile-menu>summary{min-height:44px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 13px;border:1px solid #d7d9cf;border-radius:5px;background:#fffefa;color:#30362d;font-size:14px;font-weight:600}
 .mobile-menu>summary:before{content:"☰";font-size:16px;color:#59634d}
 .mobile-menu[open]>summary{background:#f0efe9}
 .mobile-menu-panel{position:absolute;top:calc(100% + 7px);right:0;z-index:1000;width:min(320px,calc(100vw - 32px));padding:8px;border:1px solid #dedfd6;border-radius:7px;background:#fffefa;box-shadow:0 10px 30px #20241f24}
 .mobile-menu[open] .mobile-menu-panel{display:grid;grid-template-columns:1fr;gap:3px}
 .mobile-menu-panel a{display:flex!important;align-items:center;min-height:46px;padding:9px 12px;border-radius:4px;font-size:14px;color:#30362d}
 .mobile-menu-panel a:hover,.mobile-menu-panel a:focus-visible{background:#f0efe9}
 .hero{padding-top:38px!important;padding-bottom:28px!important}
 .hero-actions{flex-wrap:wrap;gap:12px}
 .section{padding-top:46px!important;padding-bottom:46px!important}
 .section-head{align-items:flex-start!important;flex-direction:column;gap:12px;margin-bottom:20px}
 .grid{gap:10px}
 .grid:not(.swatch-grid):not(.colour-card-grid){grid-template-columns:1fr!important}
 .services,.suppliers,.range-options,.spec,.heritage{grid-template-columns:1fr!important}
 .kitchen-photo-grid{grid-template-columns:1fr!important}
 .lpd-groups{grid-template-columns:1fr 1fr!important}
 .product{min-height:0;padding:18px}
 .cta,.cta-inner,.foot-inner,.footer-inner{align-items:flex-start;flex-direction:column;gap:14px}
 .toolbar{position:sticky!important;top:0;z-index:25;background:var(--white,#fffefa);box-shadow:0 3px 10px #20241f0c}
 .toolbar-inner{align-items:stretch;gap:8px;padding:9px 0}
 .search{flex:1 1 100%;max-width:none;width:100%;min-height:46px}
 .jumpbar{display:flex;gap:6px;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;padding:4px 0}
 .jumpbar a,.jumpbar button{flex:none;min-height:42px;white-space:nowrap}
 input,select,textarea{font-size:16px!important}
 button,.button{touch-action:manipulation}
 dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
 .image-viewer img{max-width:100%;max-height:calc(100dvh - 120px);object-fit:contain}
}
@media(max-width:420px){
 .wrap{width:calc(100% - 24px)!important}
 .hero h1{font-size:clamp(34px,10vw,46px)}
 .lpd-groups{grid-template-columns:1fr!important}
 .range-grid,.range-photos{grid-template-columns:1fr 1fr!important}
 .card{grid-template-columns:38% minmax(0,1fr)}
 .card-body{min-width:0}
 .toolbar-inner{width:100%}
}
