/* Homepage cards use current catalog records and links with explicit set intent. */
body.public-ui #sets .ui-sets{gap:24px}
body.public-ui #sets .ui-set{display:flex;flex-direction:column;align-items:stretch;padding:0;border:0;border-radius:20px;background:transparent;overflow:visible;gap:0}
body.public-ui #sets .ui-set-photo{display:block;width:100%;aspect-ratio:16/10;border-radius:20px;overflow:hidden;background:#bee3b5}
body.public-ui #sets .ui-set-photo img{width:100%;height:100%;object-fit:contain;transform:none;background:transparent}
body.public-ui #sets .ui-set-body{display:flex;flex:1;flex-direction:column;padding:20px 0 0;gap:10px}
body.public-ui #sets .ui-set h3{font-size:23px;line-height:1.3;font-weight:600;letter-spacing:-.02em;padding:0;margin:0}
body.public-ui #sets .ui-set p{font-size:15px;line-height:1.5;margin:0;color:#65705e;padding:0}
body.public-ui #sets .ui-set-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:12px;flex-wrap:nowrap}
body.public-ui #sets .ui-set-bottom strong{font-size:24px;font-weight:600;white-space:nowrap;line-height:1.3}
body.public-ui #sets .ui-set .ui-button{font-size:14px;min-height:44px;padding:10px 14px;width:auto!important;flex:none}
/* Same published field and renderer power the homepage and editor preview. Images are visible without animation. */
.how22 .how22-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.how22 .how22-step{position:relative;min-width:0;min-height:470px;padding:26px;border:0;border-radius:28px;overflow:hidden;isolation:isolate;opacity:1;transform:none;color:#263d2b}
.how22-yellow{background:#f4efbe}.how22-lime{background:#dfedc9}.how22-sand{background:#eee6d6}.how22-peach{background:#f7deca}
.how22 .how22-copy{position:relative;z-index:2;pointer-events:none}
.how22 .how22-number{display:block;font-size:36px;line-height:1;font-weight:450;letter-spacing:-.04em;color:#58624e;margin:0 0 18px}
.how22 .how22-step h3{font-size:29px;line-height:1.2;letter-spacing:-.025em;font-weight:600;margin:0 0 12px;max-width:100%}
.how22 .how22-step p{font-size:15px;line-height:1.5;color:#56614f;margin:0;max-width:500px}
.how22 .how22-photos{position:absolute;inset:0;z-index:1;pointer-events:none}
.how22 .how22-photos img{display:block;position:absolute;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;background:transparent;transform:none}
.how22 .how22-photos-multiple img{height:55%;width:auto;max-width:none;object-fit:contain;bottom:-6px;left:4%}
.how22 .how22-photos-multiple img:nth-child(2){left:48%}
.how22 .how22-photos-multiple img:nth-child(3){left:92%}
.how22 .how22-fallback{display:block;margin:38px auto 0;color:#477044}
.how16-admin-preview .how22 .ui-container{width:100%;max-width:none}
.how16-admin-preview .how22 .how22-step{min-height:440px}
/* Restore compact size buttons; the rest of stage21's delivery/header fixes remain. */
html:root body.public-ui.page-menu .weekly-customer[data-menu-page]{padding-top:24px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading{margin:0 0 20px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading h1{font-size:32px!important;line-height:1.2!important;margin:0 0 8px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading p{margin:0!important;color:#65705e!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .set-size-title{font-size:18px!important;margin:0 0 12px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set-list{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;margin:0 0 18px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set{min-height:112px!important;padding:16px 18px 36px!important;border-radius:16px!important;gap:6px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set strong{font-size:18px!important;line-height:1.3!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set small{font-size:14px!important;margin-top:5px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set b{font-size:21px!important;line-height:1.3!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-layout{display:block!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-note{background:transparent!important;padding:0!important;margin:0 0 12px!important;font-size:14px!important;line-height:1.5!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-feedback:empty{display:none}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .week-reset[hidden]{display:none!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .week-reset{margin:0 0 16px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-category-links{display:none}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-categories{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-category{display:contents!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-category__heading{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dishes{display:contents!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish{border-radius:16px!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish>img{width:100%!important;height:auto!important;aspect-ratio:4/3!important;object-fit:contain!important;border-radius:16px 16px 0 0!important;background:#e7efda!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body{padding:14px!important;gap:7px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish h3{font-size:17px!important;line-height:1.35!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body>p{font-size:14px!important;line-height:1.4!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions{gap:6px!important;padding-top:4px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions button{font-size:13px!important;min-height:44px!important;padding:8px 10px!important;gap:5px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;margin:24px 0 0!important;padding:18px!important;background:#edf3e7!important;border-radius:16px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-order{width:auto!important;padding:0!important;background:transparent!important;border:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-order-panel{padding:0!important;border:0!important;background:transparent!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__head{display:flex!important;align-items:center!important;gap:12px!important;margin:0!important;padding:0!important;border:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__head img{width:64px!important;height:64px!important;border-radius:10px!important;object-fit:contain!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__footer{display:flex!important;align-items:center!important;gap:20px!important;width:auto!important;padding:0!important;background:transparent!important;border:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__total{display:grid!important;gap:4px!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary__total strong{font-size:24px!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-cart-link{font-size:14px!important;margin:0!important}
html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-addon-link{margin-top:24px;padding:18px 20px;align-items:center;flex-direction:row}
.menu-addon-link h2{font-size:20px;margin-bottom:6px}
/* Real gaps between transparent addon cards, with the circle fully inside each cell. */
body.public-ui .addons-page [data-addons-catalog]{column-gap:24px;row-gap:30px}
body.public-ui .cart-content [data-addons-catalog]{column-gap:22px;row-gap:28px}
body.public-ui .addition-card{gap:14px}
body.public-ui .addition-card .addition-photo-shell,body.public-ui .cart-content .addition-card .addition-photo-shell{width:calc(100% - 12px);max-width:210px;overflow:hidden}
body.public-ui .addition-card .addition-copy{gap:10px;padding:0 4px}
body.public-ui .addition-heading{gap:4px 10px;align-items:baseline}
@media(max-width:1099px){
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-categories{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-summary{display:none!important}
 body.public-ui #sets .ui-set h3{font-size:20px}
 body.public-ui #sets .ui-set-bottom{flex-wrap:wrap}
 .how22 .how22-step{min-height:430px;padding:24px}
 .how22 .how22-step h3{font-size:25px}
 .how22 .how22-step p{font-size:14px}
}
@media(max-width:700px){
 body.public-ui #sets .ui-sets{grid-template-columns:1fr;gap:28px}
 body.public-ui #sets .ui-set-photo{aspect-ratio:16/10}
 body.public-ui #sets .ui-set-body{padding-top:16px}
 body.public-ui #sets .ui-set h3{font-size:22px}
 body.public-ui #sets .ui-set-bottom{flex-wrap:nowrap;padding-top:6px}
 body.public-ui #sets .ui-set-bottom strong{font-size:23px}
 .how22 .how22-steps{grid-template-columns:1fr;gap:16px}
 .how22 .how22-step{min-height:420px;padding:24px;border-radius:24px}
 .how22 .how22-number{font-size:30px;margin-bottom:16px}
 .how22 .how22-step h3{font-size:25px;margin-bottom:12px}
 .how22 .how22-step p{font-size:15px;line-height:1.5}
 .how22 .how22-photos-multiple img{height:48%}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-heading h1{font-size:28px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set-list{grid-template-columns:1fr!important;gap:8px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set{flex-direction:row!important;min-height:84px!important;padding:12px 14px 30px!important;align-items:center!important;gap:10px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set strong{font-size:16px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set b{font-size:19px!important;flex:none!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-set>.set-choice-state{bottom:6px!important;left:14px!important;font-size:12px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-categories{grid-template-columns:1fr!important;gap:12px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish{display:grid!important;grid-template-columns:36% minmax(0,1fr)!important;align-items:stretch!important;min-height:154px!important;overflow:hidden!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish>img{height:100%!important;min-height:154px!important;aspect-ratio:auto!important;border-radius:15px 0 0 15px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body{width:100%!important;padding:12px!important;gap:6px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish h3{font-size:16px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body>p{font-size:14px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions{gap:4px!important;flex-wrap:wrap!important;padding-top:0!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions button{font-size:12px!important;padding:6px 7px!important;min-height:44px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions svg{width:16px;height:16px;flex:none}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-addon-link{align-items:flex-start;flex-direction:column;gap:14px}
 body.public-ui .addons-page [data-addons-catalog],body.public-ui .cart-content [data-addons-catalog]{column-gap:14px;row-gap:16px}
 body.public-ui .addition-card .addition-photo-shell,body.public-ui .cart-content .addition-card .addition-photo-shell{width:calc(100% - 8px)}
 body.public-ui .addition-card .addition-copy{padding:0 2px}
}
@media(max-width:359px){
 .how22 .how22-step{min-height:400px;padding:20px}
 .how22 .how22-step h3{font-size:24px}
 .how22 .how22-step p{font-size:14px}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish{grid-template-columns:34% minmax(0,1fr)!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__body{padding:10px!important}
 html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-dish__actions button{padding:6px!important;font-size:12px!important}
}

html:root body.public-ui.page-menu .weekly-customer[data-menu-page] .menu-page-composition span{display:inline!important}

/* The phone uses a dedicated photo area under the readable copy. */
@media(max-width:700px){
 .how22 .how22-step{display:flex;flex-direction:column;min-height:0;padding:24px}
 .how22 .how22-photos{position:relative;inset:auto;flex:none;height:230px;margin:12px -24px -24px;overflow:clip}
 .how22 .how22-photos:not(.how22-photos-multiple) img{width:130%;height:auto;left:-15%;max-width:none;bottom:0}
 .how22 .how22-photos-multiple img{height:100%;bottom:-6px}
}
@media(max-width:359px){
 .how22 .how22-step{padding:20px}
 .how22 .how22-photos{height:215px;margin:12px -20px -20px}
}
