/* Главная, лист заказа под hero — вариант B макета 29.10 (выбор Павла; эталон .autopilot/…/mockup/3-B, 4-B).
   Сборка site-order-first-screen, таск 02. Разметка — index.html (section#home-order), поведение — home-order.mjs.
   Кремовый лист со скруглёнными верхними углами наезжает на синий hero: «Доставка / Заберу сам», строка адреса с
   жёлтой кнопкой-стрелкой, плашки условий (или условия района), «когда привезут», ряд из четырёх блюд. На компьютере —
   тот же лист карточкой по центру, до 1120 px, блюда — четыре в ряд без прокрутки. Цвета — токены сайта (style.css):
   --navy, --cream, --yellow; рамки и подписи — оттенки --navy, как в макете. Скрытое — атрибутом hidden. */
.home-order [hidden]{display:none!important}
.home-order{position:relative;z-index:2;margin-top:-48px;color:var(--navy)}
.home-order-sheet{display:grid;gap:12px;padding:18px 16px 14px;border-radius:26px 26px 0 0;background:var(--cream);text-align:left}
.home-order-top,.home-order-panel{display:grid;gap:12px;min-width:0}
.home-icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Переключатель «Доставка / Заберу сам» */
.home-order-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:14px;background:rgba(9,42,97,.08)}
.home-order-tabs button{min-height:40px;margin:0;padding:0 8px;border:0;border-radius:11px;background:transparent;color:rgba(9,42,97,.62);font:800 14px/1 Manrope,Arial,sans-serif;transition:background-color .2s,color .2s,box-shadow .2s}
.home-order-tabs button[aria-selected=true]{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(9,42,97,.12)}
.home-order-tabs button:focus-visible{outline:3px solid var(--yellow);outline-offset:1px}

/* Строка адреса: поле с булавкой и галочкой + жёлтая кнопка-стрелка. Подпись поля — для экранного диктора. */
.home-order-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:0}
.home-address-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.home-address-box{position:relative;min-width:0;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(9,42,97,.22);transition:box-shadow .2s}
.home-address-box:focus-within{box-shadow:inset 0 0 0 2px var(--navy)}
.home-address-box input{display:block;width:100%;height:52px;margin:0;padding:0 42px 0 44px;border:0;border-radius:12px;background:transparent;color:var(--navy);font:600 16px/1.2 Manrope,Arial,sans-serif;outline:0;text-overflow:ellipsis}
.home-address-box input::placeholder{color:rgba(9,42,97,.55);opacity:1}
.home-address-pin{position:absolute;left:14px;top:17px;color:rgba(9,42,97,.55);pointer-events:none}
.home-address-ok{position:absolute;right:14px;top:17px;color:#1c8a4a;stroke-width:2.6;pointer-events:none}
.home-address-go{display:grid;place-items:center;width:56px;min-height:52px;margin:0;padding:0;border:0;border-radius:12px;background:var(--yellow);color:var(--navy);transition:background-color .2s,scale .15s}
.home-address-go svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.home-address-go:focus-visible{outline:3px solid var(--navy);outline-offset:2px}
.home-address-go:active{scale:.96}
@media(hover:hover){.home-address-go:hover{background:#ffc400}}

/* Подсказки адреса (address-suggest-ui.mjs): список под полем, поверх ряда блюд. Вид — как в корзине
   (assets/delivery/delivery-quote.css), этот лист его не грузит. */
.home-order .address-suggest{position:relative;height:0}
.home-order .address-suggest-panel{position:absolute;z-index:13;top:6px;left:0;right:-64px;max-height:var(--address-suggest-room,320px);border:1px solid #d7dfe9;border-radius:12px;background:#fff;color:var(--navy);box-shadow:0 16px 40px rgba(9,42,97,.18);overflow:hidden}
.home-order .address-suggest-panel:not([hidden]){display:flex;flex-direction:column}
.home-order .address-suggest-head{flex:none;margin:0;padding:10px 14px 4px;font-size:14px;font-weight:800;line-height:1.4}
.home-order .address-suggest-list{position:relative;flex:1 1 auto;min-height:0;margin:0;padding:4px 0;list-style:none;overflow-y:auto;overscroll-behavior:contain}
.home-order .address-suggest-option{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:44px;padding:8px 14px;line-height:1.35;cursor:pointer;overflow-wrap:anywhere;-webkit-tap-highlight-color:transparent}
.home-order .address-suggest-option[aria-selected=true]{background:#f3f1ee;box-shadow:inset 3px 0 0 var(--navy)}
@media(hover:hover){.home-order .address-suggest-option:hover{background:#f3f1ee}}
.home-order .address-suggest-title{font-size:15px;font-weight:800}
.home-order .address-suggest-subtitle{font-size:13px;color:#46566c}
.home-order .address-suggest-hint{flex:none;margin:0;padding:8px 14px 4px;border-top:1px solid #d7dfe9;font-size:13px;font-weight:600;line-height:1.4;color:#46566c}
.home-order .address-suggest-credit{flex:none;margin:0;padding:4px 14px 8px;border-top:1px solid #d7dfe9;font-size:11px;color:#46566c}
.home-order .address-suggest-hint:not([hidden])+.address-suggest-credit{border-top:0;padding-top:0}

/* Состояние адреса и путь к самовывозу */
.home-status{margin:0;font:700 14px/1.35 Manrope,Arial,sans-serif;color:rgba(9,42,97,.72)}
.home-status.is-block{color:#a61d20}
.home-to-pickup{justify-self:start;min-height:36px;margin:-6px 0 0;padding:0;border:0;background:none;color:var(--navy);font:800 14px/1.2 Manrope,Arial,sans-serif;text-decoration:underline;text-underline-offset:4px}

/* Плашки условий до адреса; «куда возим ›» раскрывает районы */
.home-terms{display:flex;flex-wrap:wrap;gap:6px}
.home-chip{display:inline-flex;align-items:center;margin:0;padding:6px 10px;border:0;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1px rgba(9,42,97,.14);color:var(--navy);font:700 12px/1.2 Manrope,Arial,sans-serif;white-space:nowrap}
.home-zones-toggle{position:relative;cursor:pointer}
.home-zones-toggle::after{content:"";position:absolute;inset:-8px -2px}
.home-zones-toggle[aria-expanded=true]{background:var(--navy);color:#fff;box-shadow:none}
.home-zones-toggle:focus-visible{outline:3px solid var(--yellow);outline-offset:1px}
.home-zones{margin:-4px 0 0;font:600 13px/1.4 Manrope,Arial,sans-serif;color:rgba(9,42,97,.78)}

/* Условия района после адреса */
.home-zone{display:grid;gap:2px}
.home-zone p{margin:0}
.home-zone-name{font:800 14px/1.3 Manrope,Arial,sans-serif}
.home-zone-terms{font:600 13px/1.4 Manrope,Arial,sans-serif;color:rgba(9,42,97,.72)}
.home-zone-cafe{justify-self:start;margin-top:4px!important;padding:4px 10px;border-radius:99px;background:rgba(255,211,63,.45);font:700 12px/1.2 Manrope,Arial,sans-serif}

/* «Когда привезут» */
.home-hours{display:flex;align-items:flex-start;gap:8px;margin:0;font:600 14px/1.35 Manrope,Arial,sans-serif}
.home-hours .home-icon{margin-top:1px}
@media(max-width:400px){.home-hours{font-size:13px}} /* «Привезём как можно скорее или ко времени» — одной строкой на 360–400 px */

/* Самовывоз: кафе из branches конфига */
.home-pickup-lead{margin:0;font:600 14px/1.35 Manrope,Arial,sans-serif;color:rgba(9,42,97,.78)}
.home-pickup-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.home-pickup-list a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px;min-height:56px;padding:9px 14px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px rgba(9,42,97,.14)}
.home-pickup-list b{font:800 15px/1.25 Manrope,Arial,sans-serif}
.home-pickup-list span{grid-column:1;font:600 12px/1.3 Manrope,Arial,sans-serif;color:rgba(9,42,97,.66)}
.home-pickup-list svg{grid-column:2;grid-row:1/span 2;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.home-pickup-list a:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
@media(hover:hover){.home-pickup-list a:hover{box-shadow:inset 0 0 0 2px var(--navy)}}

/* «С чего начать»: ряд из четырёх карточек; на телефоне — прокрутка вбок */
.home-dishes-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:4px}
.home-dishes-head h2{margin:0;font-size:17px;line-height:1.1;letter-spacing:.01em}
.home-dishes-all{display:inline-flex;align-items:center;min-height:32px;font:700 13px/1 Manrope,Arial,sans-serif;text-decoration:underline;text-underline-offset:3px}
.home-dishes{display:grid;grid-auto-flow:column;grid-auto-columns:132px;gap:10px;margin:0 -16px;padding:0 16px 4px;list-style:none;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-inline:16px;scrollbar-width:none;overscroll-behavior-x:contain}
.home-dishes::-webkit-scrollbar{display:none}
.home-dishes>li{min-width:0;scroll-snap-align:start}
.home-dish{display:flex;flex-direction:column;gap:6px;height:100%;padding:8px;border-radius:14px;background:#fff;box-shadow:0 1px 0 rgba(9,42,97,.08);transition:transform .2s,box-shadow .2s}
.home-dish-img{display:block;aspect-ratio:1;border-radius:10px;overflow:hidden;background:#f1ede4}
.home-dish-img img{display:block;width:100%;height:100%;object-fit:cover}
.home-dish-name{display:block;flex:1;min-height:30px;font:700 12px/1.25 Manrope,Arial,sans-serif}
.home-dish-foot{display:flex;align-items:center;justify-content:space-between;gap:6px}
.home-dish-price{font:800 13px/1 Manrope,Arial,sans-serif}
.home-dish-add{display:grid;place-items:center;width:26px;height:26px;flex:none;border-radius:50%;background:var(--yellow);font:800 16px/1 Manrope,Arial,sans-serif}
.home-dish:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
@media(hover:hover){.home-dish:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(9,42,97,.12)}}

/* Карточка игры — сразу после листа (была в hero): та же ссылка «Сыграть», таблица недели, кнопка «Играть». */
.home-play{padding:8px 18px 36px;background:var(--cream)}
.home-play .overview-play-game{position:relative;right:auto;bottom:auto;display:grid;grid-template-columns:90px minmax(0,1fr);align-items:stretch;width:100%;max-width:520px;margin:0 auto;padding:7px}
.home-play .overview-play-game img{width:100%;height:100%;min-height:112px;aspect-ratio:auto;object-fit:cover;object-position:60% center}
.home-play .overview-play-game .overview-play-copy{height:auto;min-height:112px;margin:0;justify-content:center}

/* Компьютер и планшет: лист — карточка по центру до 1120 px, наезд на hero больше; блюда — четыре в ряд. */
@media(min-width:761px){
  .home-order{margin-top:-72px;padding:0 24px}
  .home-order-sheet{max-width:1120px;margin:0 auto;padding:24px 28px 28px;border-radius:26px;gap:16px;box-shadow:0 18px 44px rgba(0,16,48,.18)}
  .home-order-top{width:100%;max-width:720px;margin:0 auto}
  .home-dishes-head h2{font-size:22px}
  .home-dishes{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-columns:auto;gap:16px;margin:0;padding:0;overflow:visible}
  .home-dish{padding:10px;gap:8px}
  .home-dish-name{font-size:15px;min-height:38px}
  .home-dish-price{font-size:16px}
  .home-dish-add{width:34px;height:34px;font-size:20px}
  .home-play{padding:32px 24px 48px;background:transparent}
  .home-play .overview-play-game{grid-template-columns:180px minmax(0,1fr);padding:8px}
  .home-play .overview-play-game img{min-height:140px}
}
@media(prefers-reduced-motion:reduce){.home-order *,.home-play *{transition:none!important}.home-dish:hover{transform:none}}