.jump-page { min-height: 100vh; display: flex; flex-direction: column; background: #f5f7fb; } .jump-shell { flex: 1; width: 100%; max-width: 1140px; margin: 0 auto; padding: 48px 15px 64px; } .jump-panel { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; align-items: center; gap: 22px; padding: 30px 34px; background: #fff; border: 1px solid #e8edf3; border-left: 5px solid var(--main-color); border-radius: 8px; box-shadow: 0 18px 45px rgba(20, 34, 54, .08); } .jump-icon { width: 54px; height: 54px; border-radius: 50%; background: var(--main-color); position: relative; } .jump-icon:after { content: ""; position: absolute; left: 18px; top: 14px; width: 16px; height: 24px; border: solid #fff; border-width: 0 4px 4px 0; transform: rotate(45deg); } .jump-panel--error { border-left-color: #d63622; } .jump-panel--error .jump-icon { background: #d63622; } .jump-panel--error .jump-icon:before, .jump-panel--error .jump-icon:after { content: ""; position: absolute; left: 17px; top: 25px; width: 20px; height: 4px; background: #fff; border: 0; transform: rotate(45deg); } .jump-panel--error .jump-icon:after { transform: rotate(-45deg); } .jump-content { min-width: 0; } .jump-message { margin: 0 0 8px; color: #172033; font-size: 24px; line-height: 1.35; font-weight: 700; word-break: break-word; } .jump-countdown { margin: 0; color: #5f6977; font-size: 15px; line-height: 1.7; } .jump-countdown span { color: var(--main-color); font-weight: 700; } .jump-actions { display: flex; justify-content: flex-end; } .jump-button { display: inline-flex; align-items: center; justify-content: center; min-width: 132px; min-height: 44px; padding: 0 22px; color: #fff; font-size: 15px; font-weight: 600; text-decoration: none; background: var(--main-color); border-radius: 8px; } .jump-button:hover { color: #fff; opacity: .92; text-decoration: none; } @media screen and (max-width: 640px) { .jump-shell { padding: 28px 15px 42px; } .jump-panel { grid-template-columns: 1fr; gap: 16px; padding: 28px 22px; } .jump-message { font-size: 22px; } .jump-actions { justify-content: flex-start; } }