.banners-admin{max-width:1180px;margin:0 auto 40px}.banner-admin-grid{grid-template-columns:390px 1fr;gap:20px;display:grid}.banner-admin-grid>form,.banner-admin-list{background:#fff;border:1px solid #e8e8e8;border-radius:16px;padding:22px}.banner-admin-grid h3{margin-top:0}.banner-admin-grid form>p{color:#737d89;font-size:12px}.banner-admin-grid label{flex-direction:column;gap:6px;min-width:0;margin:13px 0;font-size:12px;font-weight:800;display:flex}.banner-admin-grid input{background:#fff;border:1px solid #ddd;border-radius:9px;width:100%;min-width:0;padding:11px}.banner-admin-grid form>button{background:#ffca36;border:0;border-radius:9px;width:100%;padding:12px;font-weight:900}.banner-admin-grid form>button:disabled{opacity:.65}.banner-preview{aspect-ratio:3;object-fit:cover;border:1px solid #ddd;border-radius:11px;width:100%;margin:10px 0;display:block}.banner-admin-list article{border-bottom:1px solid #eee;grid-template-columns:150px 1fr auto auto;align-items:center;gap:11px;padding:12px 0;display:grid}.banner-admin-list article.disabled{opacity:.55}.banner-admin-list article>img{aspect-ratio:3;object-fit:cover;background:#f5f5f5;border-radius:9px;width:150px}.banner-admin-list article>div{flex-direction:column;gap:4px;min-width:0;display:flex}.banner-admin-list a{color:#6c7581;text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.banner-admin-list small{color:#7b8490}.banner-admin-list button{border:0;border-radius:8px;padding:8px 10px;font-weight:800}.banner-admin-list .stop{color:#a22;background:#fff0f0}.banner-admin-list .start{color:#176a40;background:#e9f8ef}.banner-admin-list .delete{color:#555;background:#eee}.home-banners{max-width:1200px;margin:34px auto 0;padding:0 24px}.home-banners-head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.home-banners-head span{font-weight:900}.home-banners-head small{color:#818995}.home-banners-track{scroll-snap-type:x mandatory;gap:14px;padding-bottom:8px;display:flex;overflow-x:auto}.home-banners-track a{aspect-ratio:3;scroll-snap-align:start;background:#f4f4f4;border-radius:17px;flex:0 0 min(720px,78vw);position:relative;overflow:hidden;box-shadow:0 8px 25px #2221}.home-banners-track img{object-fit:cover;width:100%;height:100%;display:block}.home-banners-track span{color:#fff;background:#111b;border-radius:8px;padding:7px 11px;font-size:12px;font-weight:800;position:absolute;bottom:12px;right:12px}@media (max-width:850px){.banner-admin-grid{grid-template-columns:1fr}.banner-admin-list article{grid-template-columns:120px 1fr auto}.banner-admin-list article>img{width:120px}.banner-admin-list .delete{grid-column:3}}@media (max-width:600px){.home-banners{margin-top:22px;padding:0 16px}.home-banners-track a{flex-basis:88vw}.banner-admin-list article{grid-template-columns:1fr auto auto}.banner-admin-list article>img{grid-column:1/-1;width:100%}.banner-admin-list .delete{grid-column:auto}}.home-banners-head{max-width:960px;margin:0 auto 10px}.home-banners-track a{scroll-snap-align:center;flex-basis:min(960px,100%)}.home-banners-track a:only-child{margin-inline:auto}.banner-slider{aspect-ratio:3;background:#f4f4f4;border-radius:17px;width:min(960px,100%);margin:auto;position:relative;overflow:hidden;box-shadow:0 8px 25px #2221}.banner-slide{color:#fff;animation:.35s banner-in;display:block;position:absolute;inset:0}.banner-slide img{object-fit:cover;width:100%;height:100%;display:block}.banner-slide>span{color:#fff;background:#111b;border-radius:8px;padding:7px 11px;font-size:12px;font-weight:800;position:absolute;bottom:12px;right:12px}.banner-arrow{z-index:2;color:#333;background:#fffddd;border:0;border-radius:50%;place-items:center;width:40px;height:40px;font-size:28px;display:grid;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 5px 18px #0003}.banner-arrow.previous{right:12px}.banner-arrow.next{left:12px}.banner-dots{z-index:3;gap:6px;display:flex;position:absolute;bottom:13px;left:50%;transform:translate(-50%)}.banner-dots button{background:#fff9;border:0;border-radius:99px;width:8px;height:8px;padding:0;transition:all .2s}.banner-dots button.active{background:#ffca36;width:24px}@keyframes banner-in{0%{opacity:.35;transform:scale(1.01)}to{opacity:1;transform:scale(1)}}@media (max-width:600px){.banner-arrow{width:32px;height:32px;font-size:22px}.banner-slide>span{padding:5px 8px;font-size:10px}.banner-dots{bottom:8px}}
