.promo-banners{max-width:1440px;margin:0 auto;padding:32px clamp(16px,4vw,64px);display:grid;gap:20px}.promo-banner{margin:0;border-radius:16px;overflow:hidden;background:#20201a}.promo-banner picture,.promo-banner img{display:block;width:100%;height:auto}.banner-form{margin:20px 0}.banner-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.banner-fields label{min-width:0}.banner-fields input{max-width:100%}.banner-full{grid-column:1/-1}.banner-preview{display:block;width:100%;max-width:800px;height:auto;border-radius:12px;margin:12px 0}.banner-mobile-preview{max-width:320px}.banner-row{margin:18px 0}.banner-row img{max-height:240px;width:auto;max-width:100%;object-fit:contain;display:block}.banner-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}.banner-form small{display:block;line-height:1.6}.banner-feedback{min-height:1.5em}.banner-enabled{display:flex!important;align-items:center;gap:10px}.banner-enabled input{width:auto!important}
@media(max-width:640px){.promo-banners{padding:20px 16px;gap:16px}.promo-banner{border-radius:10px}.banner-fields{grid-template-columns:1fr}.banner-full{grid-column:auto}}

.menu-section>.promo-banners{padding:0;margin:0 0 36px}

/* Billboard lighting: stationary warm lights only above the artwork. */
.menu-section>.promo-banners{padding-top:30px}
.promo-banner{position:relative;isolation:isolate;overflow:visible;border:1px solid #ff9b4566;border-top:2px solid #ffd29b;box-shadow:0 -7px 24px -8px #ff861dcc,0 -20px 60px -24px #ff731899}
.promo-banner picture{overflow:hidden;border-radius:inherit}
.promo-banner::before{content:"";position:absolute;z-index:2;pointer-events:none;top:-17px;left:16%;width:12%;height:5px;border-radius:8px;background:#fff4dd;box-shadow:0 -3px 0 3px #30302a,0 0 9px 3px #ffdb9c,0 8px 24px 8px #ff9d3655}
.promo-banner::after{content:"";position:absolute;z-index:1;pointer-events:none;inset:0;border-radius:inherit;background:radial-gradient(ellipse 29% 75% at 22% 0%,#ffe3ad45,transparent 78%),radial-gradient(ellipse 29% 75% at 78% 0%,#ffe3ad45,transparent 78%),linear-gradient(#ffc57024,transparent 35%);mix-blend-mode:screen}
.promo-banner picture::before{content:"";position:absolute;z-index:2;pointer-events:none;top:-17px;right:16%;width:12%;height:5px;border-radius:8px;background:#fff4dd;box-shadow:0 -3px 0 3px #30302a,0 0 9px 3px #ffdb9c,0 8px 24px 8px #ff9d3655}
@media(max-width:640px){.menu-section>.promo-banners{padding-top:26px}.promo-banner::after{background:radial-gradient(ellipse 42% 45% at 22% 0%,#ffe3ad45,transparent 80%),radial-gradient(ellipse 42% 45% at 78% 0%,#ffe3ad45,transparent 80%),linear-gradient(#ffc57020,transparent 25%)}}

/* Stronger overhead wash, with a wider mobile presentation. */
.menu-section>.promo-banners{padding-top:62px;margin-bottom:44px}
.promo-banner{border-top-color:#fff3d6;box-shadow:0 -3px 12px #ffcf7c99,0 -18px 48px -10px #ff991fcc,0 -48px 100px -30px #ff791888}
.promo-banner img{filter:brightness(1.12) saturate(1.08)}
.promo-banner::before,.promo-banner picture::before{top:-28px;width:16%;height:7px;background:#fffbea;box-shadow:0 -4px 0 4px #3d3830,0 0 12px 4px #fff0bd,0 9px 28px 12px #ffbb6388,0 20px 56px 22px #ff911d66}
.promo-banner::before{left:14%}
.promo-banner picture::before{right:14%}
.promo-banner::after{background:radial-gradient(ellipse 38% 95% at 22% 0%,#fff0c995,#ffcc7040 40%,transparent 80%),radial-gradient(ellipse 38% 95% at 78% 0%,#fff0c995,#ffcc7040 40%,transparent 80%),linear-gradient(#fff4ce38,transparent 55%)}
.promo-banner picture::after{content:"";position:absolute;z-index:-1;pointer-events:none;left:0;right:0;top:-64px;height:140px;background:radial-gradient(ellipse at 22% 70%,#ffac474d,transparent 55%),radial-gradient(ellipse at 78% 70%,#ffac474d,transparent 55%);filter:blur(12px)}
@media(max-width:640px){
 .menu-section>.promo-banners{padding-top:54px;margin:0 -8px 38px;gap:52px}
 .promo-banner{border-radius:14px;box-shadow:0 -3px 14px #ffd596aa,0 -20px 40px -10px #ff991faa,0 -35px 65px -24px #ff791899}
 .promo-banner::before,.promo-banner picture::before{top:-26px;width:22%;height:6px}
 .promo-banner::before{left:12%}.promo-banner picture::before{right:12%}
 .promo-banner::after{background:radial-gradient(ellipse 55% 52% at 23% 0%,#ffedc080,#ffce7030 45%,transparent 85%),radial-gradient(ellipse 55% 52% at 77% 0%,#ffedc080,#ffce7030 45%,transparent 85%),linear-gradient(#fff2cb28,transparent 42%)}
 .promo-banner picture::after{top:-54px;height:115px}
}
/* One soft dip of the left fixture and its light; never a repeating strobe. */
@property --promo-left{syntax:'<number>';inherits:true;initial-value:1}
.promo-banner::before{opacity:var(--promo-left,1)}
.promo-banner::after{background:radial-gradient(ellipse 38% 95% at 22% 0%,rgba(255,240,201,calc(.58 * var(--promo-left,1))),rgba(255,204,112,calc(.25 * var(--promo-left,1))) 40%,transparent 80%),radial-gradient(ellipse 38% 95% at 78% 0%,#fff0c995,#ffcc7040 40%,transparent 80%),linear-gradient(#fff4ce38,transparent 55%)}
.promo-banner.is-light-glint{animation:promo-left-glint 720ms ease-in-out both}
@keyframes promo-left-glint{0%,100%{--promo-left:1}40%{--promo-left:.18}}
@media(max-width:640px){.promo-banner::after{background:radial-gradient(ellipse 55% 52% at 23% 0%,rgba(255,237,192,calc(.5 * var(--promo-left,1))),rgba(255,206,112,calc(.19 * var(--promo-left,1))) 45%,transparent 85%),radial-gradient(ellipse 55% 52% at 77% 0%,#ffedc080,#ffce7030 45%,transparent 85%),linear-gradient(#fff2cb28,transparent 42%)}}
@media(prefers-reduced-motion:reduce){.promo-banner.is-light-glint{animation:none}}
/* Two visible dips after scrolling settles; opacity works on older phones too. */
.promo-banner.is-light-glint{animation:promo-left-double 1800ms ease-in-out both}
.promo-banner.is-light-glint::before{animation:promo-fixture-double 1800ms ease-in-out both}
@keyframes promo-left-double{0%,30%,48%,80%,100%{--promo-left:1}12%,20%,60%,68%{--promo-left:.06}}
@keyframes promo-fixture-double{0%,30%,48%,80%,100%{opacity:1}12%,20%,60%,68%{opacity:.06}}
@media(prefers-reduced-motion:reduce){.promo-banner.is-light-glint,.promo-banner.is-light-glint::before{animation:none}}
/* A real off state, held by JS: the left housing stays, its light goes out. */
.promo-banner.is-light-off{--promo-left:0!important;animation:none!important}
.promo-banner.is-light-off::before{animation:none!important;opacity:1;background:#292720;box-shadow:0 -4px 0 4px #3d3830,inset 0 1px 3px #000}
@media(prefers-reduced-motion:reduce){.promo-banner.is-light-off{--promo-left:1!important}.promo-banner.is-light-off::before{background:#fffbea;box-shadow:0 -4px 0 4px #3d3830,0 0 12px 4px #fff0bd,0 9px 28px 12px #ffbb6388}}
