/* Compact layouts for the nine demos; desktop styles remain unchanged. */
@media(max-width:650px){
 html{scroll-padding-top:20px}.wrap{width:calc(100% - 40px)}.demo-bar{padding:11px 18px;gap:12px}.demo-bar span{font-size:9px;line-height:1.65;max-width:150px}.demo-bar button{font-size:10px;min-height:40px;padding:9px 12px;border-radius:13px;max-width:120px}.site-nav{height:77px;gap:12px}.brand{font-size:24px;letter-spacing:-.045em}.brand small{font-size:7px;letter-spacing:.2em}.site-nav .pill{font-size:10px;min-height:40px;padding:10px 13px;gap:8px;border-radius:13px}.kicker{font-size:9px;letter-spacing:.1em;line-height:1.7}.hero,.barber .hero,.coffee .hero,.restaurant .hero,.nails .hero,.aesthetic .hero,.wellness .hero{padding:28px 0 34px;gap:25px}.hero-copy{gap:18px}.hero h1,.restaurant h1,.nails h1,.heritage h1,.spa h1,.boutique h1{font-size:clamp(31px,8.8vw,39px);line-height:1.17;letter-spacing:-.045em}.hero p{font-size:14px;line-height:1.8}.actions{gap:10px;display:flex;flex-direction:column;width:100%}.actions .pill{font-size:12px;min-height:44px;padding:12px 17px;border-radius:15px;gap:13px}.pill{font-size:12px;min-height:44px;padding:12px 18px;gap:12px;border-radius:15px}.pill:hover{transform:none}.pill:after{font-size:15px}.hero-media,.coffee .hero-media,.wellness .hero-media{min-height:0;height:285px;border-radius:22px}.barber .hero-media{box-shadow:4px 5px 0 var(--accent);border-radius:130px 130px 20px 20px}.nails .hero-media{transform:none}.heritage .hero{padding-top:28px}.heritage .hero-copy{margin-bottom:24px}.heritage .hero-media{height:285px;min-height:0;border-radius:120px 120px 20px 20px}.spa .hero,.boutique .hero{min-height:565px;padding:33px 22px;margin-top:8px;border-radius:23px}.spa .hero-media,.boutique .hero-media{height:100%;min-height:0}.spa .hero-copy,.boutique .hero-copy{gap:19px}.hero-caption{font-size:8px;gap:16px;line-height:1.75;padding:16px 0}.line-strip{padding:16px 0}.line-track{font-size:9px;gap:26px}.line-track span:after{margin-left:26px}.section{padding:58px 0}.section-title{margin-bottom:24px}.section h2{font-size:clamp(28px,7.8vw,34px);line-height:1.2;letter-spacing:-.035em}.section-title p{font-size:13px;line-height:1.8;margin-top:19px}.tabs{gap:7px;margin:20px 0}.tabs button{min-height:40px;font-size:10px;padding:10px 13px;border-radius:13px}.catalog-grid,.barber .catalog-grid,.heritage .catalog-grid,.restaurant .catalog-grid,.nails .catalog-grid,.aesthetic .catalog-grid,.boutique .catalog-grid,.spa .catalog-grid{gap:22px;grid-template-columns:1fr}.item{border-radius:20px!important}.item .photo,.barber .item .photo,.restaurant .item .photo,.aesthetic .item .photo,.spa .item .photo,.heritage .item .photo,.boutique .item .photo{height:205px;min-height:0}.item-copy{padding:21px}.item small{font-size:9px;line-height:1.7}.item h3{font-size:20px;line-height:1.3;margin:11px 0 12px}.item p{font-size:13px;line-height:1.8;min-height:0}.item button{font-size:12px;min-height:44px;padding:11px 15px;margin-top:18px;border-radius:14px}.story-grid,.restaurant .story-grid,.planner-grid{gap:27px}.story-art{gap:13px}.story-art .photo{height:260px;border-radius:21px}.story-art .inset{height:160px;width:66%;border-width:5px;border-radius:20px}.story-copy p,.planner-copy p{font-size:14px;line-height:1.8;margin:20px 0}.gallery-grid,.barber .gallery-grid,.spa .gallery-grid,.restaurant .gallery-grid,.nails .gallery-grid,.aesthetic .gallery-grid,.boutique .gallery-grid,.wellness .gallery-grid{gap:11px}.gallery-button{border-radius:18px}.gallery-button .photo{height:160px}.gallery-button:first-child .photo{height:260px}.gallery-button span.label{font-size:10px;padding:14px 12px;line-height:1.5}.planner{padding:23px 20px;border-radius:21px}.planner label{font-size:12px;line-height:1.6;margin-bottom:17px}.planner select{min-height:47px;font-size:16px;padding:12px;border-radius:11px;margin-top:8px}.planner .pill{font-size:12px;min-height:45px;margin-top:18px}.planner .summary{font-size:12px;line-height:1.75;padding-top:18px}.planner .summary b{font-size:19px;line-height:1.4}.planner .summary small{font-size:10px;line-height:1.75}.closing{padding:45px 0}.closing h2{font-size:28px;line-height:1.25}.closing p{font-size:12px;line-height:1.8}.closing .pill{font-size:12px;min-height:45px;margin-top:22px}footer{font-size:10px;line-height:1.8;gap:15px;padding:23px 0 32px}.motion .reveal{opacity:1;transform:none;transition:none}.modal-photo{height:235px}.modal-copy{padding:24px 21px}.modal-copy h2{font-size:25px;line-height:1.3}.modal-copy p{font-size:13px;line-height:1.85;margin:18px 0}.gallery-controls button{min-height:44px;min-width:44px;font-size:12px;border-radius:13px;padding:11px 15px}
}
@media(max-width:360px){.wrap{width:calc(100% - 36px)}.hero h1,.restaurant h1,.nails h1,.heritage h1,.spa h1,.boutique h1{font-size:30px}.hero-media,.coffee .hero-media,.wellness .hero-media,.heritage .hero-media{height:255px}.spa .hero-media,.boutique .hero-media{height:100%}.site-nav .pill{font-size:9px;padding:10px 11px}.brand{font-size:23px}.item .photo{height:185px}.item-copy{padding:19px}}