
/* Approved menu layout — 26/10/2026. */
.design-preview .hero{padding-top:32px;padding-bottom:40px;gap:40px;align-items:center}
.design-preview h1{font-size:clamp(34px,4.4vw,62px);line-height:1.12;margin:12px 0 20px}
.design-preview .hero-photo{max-width:390px;justify-self:center}.design-preview .hero-photo img{aspect-ratio:1.15;object-fit:cover;border-radius:24px}
.design-preview .seal{display:none}.design-preview .intro{font-size:17px;max-width:520px}
.design-preview .featured{padding-top:28px;padding-bottom:32px}.design-preview .section-head h2{font-size:30px}
.design-preview .feature{background:#fffdf7;border:1px solid var(--line);border-radius:16px;padding:12px;display:flex;flex-direction:column;align-items:flex-start}
.design-preview .feature img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:10px}.design-preview .feature .num{font:11px system-ui;letter-spacing:1px;margin-top:14px}.design-preview .feature h3{font-size:16px;min-height:48px;margin:8px 0}.design-preview .feature p{margin:0 0 10px;font-weight:700}.design-preview .feature button{margin-top:auto;min-height:44px;font-size:15px}
.menu-toolbar{position:sticky;top:0;z-index:2;background:var(--cream);padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:16px}.design-preview #filters{flex-wrap:nowrap;overflow-x:auto;margin:0 0 12px;padding-bottom:6px}.design-preview #filters button{white-space:nowrap;flex-shrink:0}
.view-switch{display:flex;gap:6px}.view-switch button{padding:8px 16px;min-height:44px;background:transparent;color:var(--green);border:1px solid var(--line);border-radius:8px}.view-switch button[aria-pressed=true]{background:var(--green);color:white}
.design-preview .search{max-width:none;font-size:16px}.design-preview .search input{border-radius:12px}.design-preview .card{border-radius:16px}.design-preview .card h3{font-size:18px;line-height:1.4;margin:0 0 8px}.design-preview .card p{font-size:15px}.design-preview .card-bottom strong{font-size:20px}.design-preview .card-bottom button{min-height:44px;font-size:15px}.design-preview .card-content{padding:16px}
.design-preview .compact .card{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center}.design-preview .compact .card>img{width:112px;height:112px;aspect-ratio:1;object-fit:contain}.design-preview .compact .card p{margin:0 0 10px}.design-preview .compact .card-bottom{flex-wrap:wrap;flex-direction:row;align-items:center}.design-preview .compact{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:800px){.design-preview .hero{grid-template-columns:1fr 150px;gap:16px;padding:24px 5%}.design-preview .hero-photo{width:150px}.design-preview .hero .eyebrow{font-size:10px}.design-preview .hero .intro{font-size:16px}.design-preview .hero-note{display:none}.design-preview .hero .actions{flex-wrap:wrap}.design-preview .hero .actions>*{font-size:15px;padding:10px 12px}.design-preview .feature-grid{display:flex;overflow-x:auto;gap:12px;padding-bottom:12px;scroll-snap-type:x proximity}.design-preview .feature{flex:0 0 180px;scroll-snap-align:start}.design-preview .feature:last-child{grid-column:auto}.design-preview .compact{grid-template-columns:1fr}.design-preview .section-head h2{font-size:27px}.menu-toolbar{z-index:1}.design-preview .hero h1{font-size:34px}}
@media(max-width:480px){.design-preview .hero{grid-template-columns:1fr}.design-preview .hero-photo{display:none}.design-preview .compact .card{grid-template-columns:96px minmax(0,1fr)}.design-preview .compact .card>img{width:96px;height:96px}.design-preview .card-content{padding:12px}}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){.design-preview .compact{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.design-preview *{scroll-behavior:auto}}

/* Short landscape viewports need room for products, not pinned controls. */
@media (orientation:landscape) and (max-height:600px) and (max-width:1100px){
 .design-preview .menu-toolbar{position:static;padding:8px 0}
 .mobile-bar{display:none}
 .design-preview #filters{margin-bottom:6px}
 .design-preview .view-switch{gap:6px}
 footer{padding-bottom:32px}
}
