:root { --flow-accent: #5b8def; --flow-accent-text: #ffffff; }
.hero-product { pointer-events: none !important; }
.flow-modal[hidden] { display: none !important; }
.flow-modal { position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: center; padding: 16px; }
.flow-modal__backdrop { position: absolute; inset: 0; background: rgba(2, 5, 12, .76); backdrop-filter: blur(8px); }
.flow-modal__panel { position: relative; width: min(840px, calc(100vw - 32px)); max-height: min(820px, calc(100dvh - 32px)); overflow: auto; border: 1px solid rgba(244,229,174,.34); border-radius: 24px; background: #182236; color: #f7f8fb; box-shadow: 0 28px 80px rgba(0,0,0,.55); }
.flow-modal__head { display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: start; padding: 24px 24px 16px; border-bottom: 1px solid rgba(244,229,174,.18); }
.flow-modal__eyebrow { margin: 0 0 7px; color: var(--flow-accent); font: 800 12px/1.2 "Nunito Sans", system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; }
.flow-modal h2 { margin: 0; color: #fff; font: 900 clamp(24px, 4vw, 36px)/1.04 "Nunito Sans", system-ui, sans-serif; letter-spacing: -.03em; }
.flow-modal__lede { margin: 10px 0 0; color: #cbd2df; font: 600 15px/1.5 "Nunito Sans", system-ui, sans-serif; }
.flow-modal__close { width: 44px; height: 44px; border: 1px solid rgba(244,229,174,.28); border-radius: 50%; background: rgba(255,255,255,.06); color: #fff; font-size: 22px; cursor: pointer; }
.flow-modal__summary { margin: 18px 24px 0; padding: 12px 14px; border: 1px solid rgba(244,229,174,.2); border-radius: 14px; background: rgba(244,229,174,.07); color: #f4e5ae; font: 800 14px/1.4 "Nunito Sans", system-ui, sans-serif; }
.flow-merch { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 16px 24px 20px; }
.flow-merch__card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid rgba(244,229,174,.28); border-radius: 18px; background: #202c42; }
.flow-merch__art { display: block; width: 100%; height: 200px; padding: 14px; object-fit: contain; box-sizing: border-box; background: #f7f4ec; border-bottom: 1px solid rgba(244,229,174,.28); }
.flow-merch__body { display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; align-items: center; padding: 15px 16px 16px; }
.flow-merch__name { margin: 0; color: #fff; font: 900 17px/1.2 "Nunito Sans", system-ui, sans-serif; }
.flow-merch__price { margin: 0; color: #f4e5ae; font: 800 15px/1.3 "Nunito Sans", system-ui, sans-serif; }
.flow-merch__add { grid-column: 1 / -1; min-height: 44px; width: 100%; margin-top: 7px; border: 0; border-radius: 8px; padding: 11px 14px; background: var(--flow-accent); color: var(--flow-accent-text); font: 900 14px/1 "Nunito Sans", system-ui, sans-serif; cursor: pointer; }
.flow-merch__add[disabled] { opacity: .72; cursor: default; }
.flow-modal__status { min-height: 20px; margin: -6px 24px 12px; color: #aeb8c9; font: 600 13px/1.4 system-ui, sans-serif; }
.flow-modal__foot { position: sticky; bottom: 0; display: grid; grid-template-columns: 1fr 1.4fr; gap: 12px; padding: 16px 24px 22px; border-top: 1px solid rgba(255,255,255,.1); background: rgba(11,16,27,.96); }
.flow-modal__button { min-height: 50px; border-radius: 999px; padding: 14px 18px; font: 800 15px/1 system-ui, sans-serif; cursor: pointer; }
.flow-modal__button--secondary { border: 1px solid rgba(255,255,255,.17); background: transparent; color: #fff; }
.flow-modal__button--primary { border: 0; background: var(--flow-accent); color: var(--flow-accent-text); }
.flow-modal-open { overflow: hidden !important; }
@media (max-width: 640px) {
  .flow-modal { align-items: end; padding: 0; }
  .flow-modal__panel { width: 100%; max-height: 92dvh; border-radius: 24px 24px 0 0; }
  .flow-modal__head { padding: 20px 18px 14px; }
  .flow-modal__summary { margin: 14px 18px 0; }
  .flow-merch { grid-template-columns: 1fr; padding: 14px 18px 18px; }
  .flow-merch__art { height: min(188px, 33dvh); }
  .flow-modal__status { margin: -4px 18px 10px; }
  .flow-modal__foot { padding: 14px 18px max(18px, env(safe-area-inset-bottom)); }
}