* { box-sizing: border-box; }
    body { font-family: 'DM Sans', sans-serif; background: #F8F6F1; }

    /* --- Progress Bar --- */
    .step-line { flex: 1; height: 2px; background: #D4C9B0; transition: background .4s; }
    .step-line.done { background: #E8A020; }

    /* --- Step bubble --- */
    .step-bubble {
      width: 36px; height: 36px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-weight: 700; font-size: 13px;
      border: 2px solid #D4C9B0; background: #fff; color: #8A8070;
      transition: all .3s;
    }
    .step-bubble.active { border-color: #E8A020; background: #E8A020; color: #0D1B2A; }
    .step-bubble.done   { border-color: #E8A020; background: #0D1B2A; color: #E8A020; }

    /* --- Field label --- */
    label { display: block; font-size: 11px; font-weight: 600; color: #4A4030; letter-spacing: .05em; text-transform: uppercase; margin-bottom: 5px; }
    label .req { color: #E8A020; margin-left: 2px; }

    /* --- Inputs --- */
    input, select {
      width: 100%; padding: 10px 14px; border: 1.5px solid #D4C9B0;
      border-radius: 8px; font-size: 14px; font-family: 'DM Sans', sans-serif;
      background: #fff; color: #0D1B2A; outline: none;
      transition: border-color .2s, box-shadow .2s;
    }
    input:focus, select:focus {
      border-color: #E8A020;
      box-shadow: 0 0 0 3px rgba(232,160,32,.12);
    }
    input.error, select.error { border-color: #e53e3e; }
    .err-msg { color: #e53e3e; font-size: 11px; margin-top: 4px; display: none; }
    .err-msg.show { display: block; }

    /* --- Radio group --- */
    .radio-group { display: flex; gap: 10px; flex-wrap: wrap; }
    .radio-opt { display: none; }
    .radio-label {
      display: flex; align-items: center; gap: 7px;
      border: 1.5px solid #D4C9B0; border-radius: 8px;
      padding: 9px 16px; cursor: pointer; font-size: 13px; color: #4A4030;
      transition: all .2s;
    }
    .radio-opt:checked + .radio-label {
      border-color: #E8A020; background: #FFF8EC; color: #0D1B2A; font-weight: 600;
    }
    .radio-dot {
      width: 14px; height: 14px; border-radius: 50%;
      border: 2px solid #D4C9B0; background: #fff; transition: all .2s;
      flex-shrink: 0;
    }
    .radio-opt:checked + .radio-label .radio-dot {
      border-color: #E8A020; background: #E8A020;
    }

    /* --- Section card --- */
    .form-section {
      background: #fff; border-radius: 16px;
      border: 1px solid #E8E2D5; padding: 24px;
      margin-bottom: 20px;
    }
    .section-head {
      display: flex; align-items: center; gap:10px;
      border-bottom: 1px solid #EDE9E1; padding-bottom: 12px; margin-bottom: 20px;
    }
    .section-head i { color: #E8A020; margin-right: 10px; font-size: 15px; }
    .section-head h3 { font-family: 'Playfair Display', serif; font-size: 17px; font-weight: 700; color: #0D1B2A; }

    /* --- Payment method cards --- */
    .pay-opt { display: none; }
    .pay-label {
      display: flex; align-items: center; justify-content: center; gap: 8px;
      border: 1.5px solid #D4C9B0; border-radius: 10px; padding: 14px 18px;
      cursor: pointer; font-size: 13px; color: #4A4030;
      transition: all .2s; text-align: center;
    }
    .pay-opt:checked + .pay-label {
      border-color: #E8A020; background: #FFF8EC; color: #0D1B2A; font-weight: 600;
    }
    .pay-label i { font-size: 18px; }

    /* --- Submit button --- */
    .btn-gold {
      background: #E8A020; color: #0D1B2A; font-weight: 700; font-size: 14px;
      border-radius: 8px; padding: 13px 28px; border: none; cursor: pointer;
      transition: background .2s, transform .1s;
      display: inline-flex; align-items: center; gap: 8px;
    }
    .btn-gold:hover { background: #F5B942; }
    .btn-gold:active { transform: scale(.98); }
    .btn-gold:disabled { background: #C4A060; cursor: not-allowed; opacity: .7; }

    /* --- Toast --- */
    #toast {
      position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(80px);
      background: #0D1B2A; color: #fff; border-radius: 10px;
      padding: 12px 24px; font-size: 13px; font-weight: 500;
      opacity: 0; transition: all .35s; z-index: 9999; white-space: nowrap;
      display: flex; align-items: center; gap: 10px;
    }
    #toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
    #toast.success i { color: #4ade80; }
    #toast.error i { color: #f87171; }

    /* --- Loader spinner --- */
    .spinner {
      width: 18px; height: 18px; border: 2.5px solid rgba(0,0,0,.2);
      border-top-color: #0D1B2A; border-radius: 50%;
      animation: spin .7s linear infinite; display: none;
    }
    @keyframes spin { to { transform: rotate(360deg); } }

    /* --- Payment success overlay --- */
    #pay-success {
      display: none; text-align: center; padding: 32px 16px;
    }
    .check-circle {
      width: 72px; height: 72px; border-radius: 50%;
      background: #0D1B2A; margin: 0 auto 20px;
      display: flex; align-items: center; justify-content: center;
      animation: pop .4s cubic-bezier(.3,1.5,.5,1);
    }
    @keyframes pop { from { transform: scale(0); } to { transform: scale(1); } }

    /* --- Divider --- */
    .divider { display: flex; align-items: center; gap: 12px; color: #9A8F80; font-size: 11px; margin: 18px 0; }
    .divider::before, .divider::after { content: ''; flex: 1; height: 1px; background: #E8E2D5; }

    /* --- Ticker --- */
    .ticker-wrap { background: #0D1B2A; overflow: hidden; white-space: nowrap; }
    .ticker-track { display: inline-flex; animation: ticker 30s linear infinite; }
    @keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }

    /* fee badge */
    .fee-badge {
      background: linear-gradient(135deg, #0D1B2A 0%, #1E3353 100%);
      border-radius: 12px; padding: 18px 22px;
      display: flex; align-items: center; justify-content: space-between;
    }

    @media (max-width: 640px) {
      .form-section { padding: 18px 16px; }
    }

    input,
    select,
    textarea {
        height: 42px;
        padding: 12px 16px;
        font-size: 14px;
        border-radius: 12px;
    }