/* ─── Base ─────────────────────────────────────────────── */
    *, *::before, *::after { box-sizing: border-box; }
    body { font-family: 'DM Sans', sans-serif; background: #F8F6F1; color: #0D1B2A; }

    /* ─── Ticker ────────────────────────────────────────────── */
    .ticker-wrap { background: #0D1B2A; overflow: hidden; white-space: nowrap; border-bottom: 1px solid rgba(232,160,32,.15); }
    .ticker-track { display: inline-flex; animation: ticker 32s linear infinite; }
    @keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }

    /* ─── Form label ────────────────────────────────────────── */
    .field-label {
      display: block; font-size: 11px; font-weight: 600;
      color: #4A4030; letter-spacing: .05em; text-transform: uppercase;
      margin-bottom: 5px;
    }
    .field-label .req { color: #E8A020; margin-left: 2px; }
    .field-hint { font-size: 10px; color: #9A8F80; margin-top: 3px; }

    /* ─── Input / Select / Textarea ─────────────────────────── */
    input[type="text"],
    input[type="email"],
    input[type="number"],
    textarea,
    select {
      width: 100%;
      padding: 11px 14px;
      border: 1.5px solid #D4C9B0;
      border-radius: 9px;
      font-size: 14px;
      font-family: 'DM Sans', sans-serif;
      color: #0D1B2A;
      background: #fff;
      outline: none;
      transition: border-color .2s, box-shadow .2s;
      -webkit-appearance: none;
    }
    input:focus, select:focus, textarea:focus {
      border-color: #E8A020;
      box-shadow: 0 0 0 3px rgba(232,160,32,.12);
    }
    input.error, select.error, textarea.error {
      border-color: #e53e3e;
      box-shadow: 0 0 0 3px rgba(229,62,62,.10);
    }
    textarea { resize: vertical; min-height: 80px; }

    /* ─── Error message ─────────────────────────────────────── */
    .err-msg {
      color: #e53e3e; font-size: 11px;
      margin-top: 4px; display: none;
    }
    .err-msg.show { display: block; }

    /* ─── 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;
      border-bottom: 1px solid #EDE9E1;
      padding-bottom: 12px; margin-bottom: 20px; gap: 10px;
    }
    .section-head .sec-icon {
      width: 34px; height: 34px; border-radius: 8px;
      background: #FFF8EC; border: 1px solid #F5D98A;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .section-head .sec-icon i { color: #E8A020; font-size: 14px; }
    .section-head h3 {
      font-family: 'Playfair Display', serif;
      font-size: 17px; font-weight: 700; color: #0D1B2A;
    }

    /* ─── Radio pills ───────────────────────────────────────── */
    .radio-group { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
    .radio-opt-inp { display: none; }
    .radio-pill {
      display: flex; align-items: center; gap: 6px;
      border: 1.5px solid #D4C9B0; border-radius: 8px;
      padding: 9px 14px; cursor: pointer;
      font-size: 13px; color: #4A4030;
      transition: all .2s; user-select: none;
    }
    .radio-opt-inp:checked + .radio-pill {
      border-color: #E8A020; background: #FFF8EC;
      color: #0D1B2A; font-weight: 600;
    }
    .radio-dot {
      width: 13px; height: 13px; border-radius: 50%;
      border: 2px solid #C4B89A; background: #fff; flex-shrink: 0;
      transition: all .2s;
    }
    .radio-opt-inp:checked + .radio-pill .radio-dot {
      border-color: #E8A020; background: #E8A020;
    }

    /* ─── File upload zone ──────────────────────────────────── */
    .file-zone {
      border: 2px dashed #D4C9B0; border-radius: 10px;
      padding: 20px 16px; text-align: center; cursor: pointer;
      transition: border-color .2s, background .2s; position: relative;
      background: #fff;
    }
    .file-zone:hover, .file-zone.drag-over {
      border-color: #E8A020; background: #FFFBF0;
    }
    .file-zone input[type="file"] {
      position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%;
    }
    .file-zone .zone-icon { font-size: 24px; color: #C4B89A; margin-bottom: 8px; }
    .file-zone .zone-title { font-size: 13px; font-weight: 600; color: #4A4030; }
    .file-zone .zone-sub   { font-size: 11px; color: #9A8F80; margin-top: 3px; }
    .file-zone.has-file    { border-color: #0D1B2A; background: #F0F4F8; }
    .file-zone.error-zone  { border-color: #e53e3e; }

    /* file preview bar */
    .file-preview {
      display: none; margin-top: 10px;
      background: #F8F6F1; border-radius: 8px; padding: 10px 12px;
      align-items: center; gap: 10px; font-size: 12px;
    }
    .file-preview.show { display: flex; }
    .file-preview .fp-icon { color: #E8A020; flex-shrink: 0; font-size: 16px; }
    .file-preview .fp-name { flex: 1; color: #0D1B2A; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .file-preview .fp-size { color: #9A8F80; flex-shrink: 0; }
    .file-preview .fp-remove { color: #e53e3e; cursor: pointer; flex-shrink: 0; background: none; border: none; padding: 0; font-size: 14px; }
    .file-preview .fp-remove:hover { color: #c53030; }

    /* badge "optional" */
    .badge-opt {
      display: inline-block; font-size: 9px; font-weight: 600;
      letter-spacing: .06em; text-transform: uppercase;
      background: #EDE9E1; color: #8A8070; border-radius: 4px;
      padding: 2px 6px; margin-left: 6px; vertical-align: middle;
    }

    /* ─── Primary button ────────────────────────────────────── */
    .btn-gold {
      background: #E8A020; color: #0D1B2A;
      font-weight: 700; font-size: 14px;
      border-radius: 9px; padding: 13px 28px;
      border: none; cursor: pointer;
      display: inline-flex; align-items: center;
      justify-content: center; gap: 8px;
      transition: background .2s, transform .1s;
    }
    .btn-gold:hover:not(:disabled) { background: #F5B942; }
    .btn-gold:active:not(:disabled) { transform: scale(.98); }
    .btn-gold:disabled { background: #C4A060; cursor: not-allowed; opacity: .7; }

    /* ─── Spinner ────────────────────────────────────────────── */
    .spinner {
      width: 18px; height: 18px;
      border: 2.5px solid rgba(0,0,0,.15);
      border-top-color: #0D1B2A; border-radius: 50%;
      animation: spin .7s linear infinite; display: none; flex-shrink: 0;
    }
    @keyframes spin { to { transform: rotate(360deg); } }

    /* ─── Toast ──────────────────────────────────────────────── */
    #toast {
      position: fixed; bottom: 28px; left: 50%;
      transform: translateX(-50%) translateY(80px);
      background: #0D1B2A; color: #fff; border-radius: 10px;
      padding: 12px 22px; font-size: 13px; font-weight: 500;
      opacity: 0; transition: all .3s; z-index: 9999;
      display: flex; align-items: center; gap: 9px; white-space: nowrap;
      pointer-events: none;
    }
    #toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
    #toast.success i { color: #4ade80; }
    #toast.error   i { color: #f87171; }

    /* ─── Progress steps ─────────────────────────────────────── */
    .step-line { flex: 1; height: 2px; background: #D4C9B0; transition: background .4s; }
    .step-line.done { background: #E8A020; }
    .step-bubble {
      width: 34px; height: 34px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-weight: 700; font-size: 12px;
      border: 2px solid #D4C9B0; background: #fff; color: #8A8070;
      transition: all .3s; flex-shrink: 0;
    }
    .step-bubble.active { border-color: #E8A020; background: #E8A020; color: #0D1B2A; }
    .step-bubble.done   { border-color: #E8A020; background: #0D1B2A; color: #E8A020; }

    /* ─── Success screen ─────────────────────────────────────── */
    .success-ring {
      width: 80px; height: 80px; border-radius: 50%;
      background: linear-gradient(135deg, #0D1B2A, #1E3353);
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 20px;
      animation: pop .45s cubic-bezier(.3,1.5,.5,1);
    }
    @keyframes pop { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }

    /* ─── Responsive tweaks ──────────────────────────────────── */
    @media (max-width: 640px) {
      .form-section { padding: 18px 16px; }
    }