* {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    body {
        background: #f0f4f8;
        font-family: system-ui, -apple-system, sans-serif;
    }

    /* Input focus ring */
    input:focus {
        outline: none;
        box-shadow: 0 0 0 2px #d1fae5;
    }

    /* Spinner animation */
    @keyframes spin {
        to {
            transform: rotate(360deg);
        }
    }

    .spinner {
        animation: spin 0.7s linear infinite;
    }

    /* Hover translate */
    .btn-cta:hover {
        opacity: 0.92;
        transform: translateY(-1px);
    }

    .btn-cta:active {
        transform: translateY(0);
    }

    .btn-cta:disabled {
        opacity: 0.7;
        cursor: not-allowed;
        transform: none;
    }

    /* Transition helpers */
    .transition-all {
        transition: all 0.2s;
    }

    /* Divide */
    .divide-y>li+li {
        border-top: 1px solid #f1f5f9;
    }

    .div-left {
        background: #fff;
        border-radius: 16px;
        padding: 32px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.07);
        border: 1px solid #f1f5f9;
        
    }

    .div-main {
        width: 90%;
        margin: 45px auto;
    }

    /* Responsive: 2 cols on desktop */
    @media (min-width: 1024px) {
        #checkout-grid {
            grid-template-columns: 2fr 2fr !important;
        }
    }

    @media(max-width: 768px) {
        .div-left {
            background: #fff;
            border-radius: 16px;
            padding: 32px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.07);
            border: 1px solid #f1f5f9;
            height: 100%;
        }
    }