/* ============================================================ DEMO BAR — preview-only banner. Cream so it contrasts hard against the dark navy site and can't be missed. No price shown: the customer sees pricing on the Stripe checkout page. To LAUNCH the real site: delete this file's in and the block at the end of . ============================================================ */ body { padding-bottom: 64px; } .demo-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 22px; padding: 11px 18px; background: #F7F4EF; color: #050B12; text-decoration: none; font-family: "Montserrat", system-ui, sans-serif; font-size: 0.9rem; box-shadow: 0 -8px 26px rgba(0, 0, 0, 0.45); } .demo-bar__text strong { font-weight: 700; } .demo-bar__cta { display: inline-flex; align-items: center; gap: 10px; padding: 9px 22px; background: #050B12; color: #F7F4EF; font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; white-space: nowrap; transition: background 0.2s ease, transform 0.15s ease; } .demo-bar__cta .arrow { color: #D8B46A; font-size: 14px; line-height: 1; } .demo-bar:hover .demo-bar__cta { background: #0B1C2E; transform: translateY(-1px); } @media (max-width: 600px) { body { padding-bottom: 98px; } }