/* TrueRateGuide Application Forms - Shared Styles v1 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Plus Jakarta Sans','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#f8fafc;color:#0f172a;line-height:1.5;min-height:100vh;-webkit-font-smoothing:antialiased}

/* Header */
.trg-header{background:#fff;border-bottom:1px solid #e5e7eb;padding:16px 0;position:sticky;top:0;z-index:50;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.trg-header-inner{max-width:640px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between}
.trg-logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:800;font-size:20px}
.trg-logo-icon{width:36px;height:36px;background:#1e3a8a;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff}
.trg-logo-text{color:#1e3a8a}
.trg-logo-text span{color:#f97316}
.trg-secure{display:flex;align-items:center;gap:6px;font-size:13px;color:#16a34a;font-weight:600}
.trg-secure svg{width:16px;height:16px}

/* Layout */
.trg-container{max-width:640px;margin:0 auto;padding:24px 20px 60px}
.trg-hero{text-align:center;margin-bottom:24px}
.trg-hero h1{font-size:28px;font-weight:800;color:#0f172a;margin-bottom:8px;line-height:1.2}
.trg-hero p{font-size:15px;color:#64748b}

/* Progress Bar */
.trg-progress-wrap{background:#fff;border-radius:12px;padding:16px 20px;margin-bottom:20px;border:1px solid #e5e7eb}
.trg-progress-label{display:flex;justify-content:space-between;font-size:13px;font-weight:600;color:#64748b;margin-bottom:8px}
.trg-progress-label .step-num{color:#1e3a8a}
.trg-progress-bar{width:100%;height:8px;background:#e5e7eb;border-radius:99px;overflow:hidden}
.trg-progress-fill{height:100%;background:linear-gradient(90deg,#1e3a8a,#f97316);border-radius:99px;transition:width .4s ease;width:0%}

/* Card */
.trg-card{background:#fff;border-radius:16px;padding:28px 24px;border:1px solid #e5e7eb;box-shadow:0 4px 20px rgba(0,0,0,.04)}

/* Steps */
.trg-step{display:none}
.trg-step.active{display:block;animation:fadeIn .3s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.trg-step-title{font-size:22px;font-weight:800;color:#0f172a;margin-bottom:6px;line-height:1.3}
.trg-step-subtitle{font-size:14px;color:#64748b;margin-bottom:20px}

/* Form groups */
.trg-field{margin-bottom:16px}
.trg-field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
@media (max-width:480px){.trg-field-row{grid-template-columns:1fr}}
.trg-label{display:block;font-size:13px;font-weight:600;color:#334155;margin-bottom:6px}
.trg-label .required{color:#dc2626}
.trg-input,.trg-select,.trg-textarea{width:100%;padding:14px 16px;border:2px solid #e5e7eb;border-radius:10px;font-size:16px;font-family:inherit;color:#0f172a;background:#fff;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.trg-input:focus,.trg-select:focus,.trg-textarea:focus{outline:none;border-color:#1e3a8a;box-shadow:0 0 0 3px rgba(30,58,138,.1)}
.trg-input::placeholder{color:#94a3b8}
.trg-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%2364748b' stroke-width='2' stroke-linecap='round' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:18px;padding-right:40px}
.trg-input.error,.trg-select.error{border-color:#dc2626}
.trg-error-msg{color:#dc2626;font-size:13px;margin-top:4px;display:none}
.trg-error-msg.show{display:block}

/* Option buttons (tile selector) */
.trg-options{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:16px}
.trg-options.three{grid-template-columns:repeat(3,1fr)}
.trg-options.one{grid-template-columns:1fr}
@media (max-width:480px){.trg-options,.trg-options.three{grid-template-columns:1fr 1fr}}
.trg-option{background:#f8fafc;border:2px solid #e5e7eb;border-radius:12px;padding:16px 12px;cursor:pointer;text-align:center;font-weight:600;font-size:14px;color:#334155;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:6px;min-height:76px;justify-content:center}
.trg-option:hover{border-color:#1e3a8a;background:#eff6ff}
.trg-option.selected{border-color:#1e3a8a;background:#eff6ff;color:#1e3a8a;box-shadow:0 0 0 2px rgba(30,58,138,.15)}
.trg-option .icon{font-size:24px;line-height:1}
.trg-option input{display:none}

/* Checkbox */
.trg-checkbox{display:flex;gap:10px;align-items:flex-start;padding:12px;background:#f8fafc;border-radius:10px;margin-bottom:12px;cursor:pointer}
.trg-checkbox input{margin-top:3px;width:18px;height:18px;accent-color:#1e3a8a;flex-shrink:0;cursor:pointer}
.trg-checkbox-text{font-size:12px;color:#475569;line-height:1.5}
.trg-checkbox-text a{color:#1e3a8a;text-decoration:underline}

/* Buttons */
.trg-btn-row{display:flex;gap:12px;margin-top:24px}
.trg-btn{flex:1;padding:16px 24px;border:none;border-radius:12px;font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px}
.trg-btn-primary{background:#f97316;color:#fff;box-shadow:0 4px 12px rgba(249,115,22,.3)}
.trg-btn-primary:hover{background:#ea580c;transform:translateY(-1px);box-shadow:0 6px 16px rgba(249,115,22,.4)}
.trg-btn-primary:disabled{background:#cbd5e1;cursor:not-allowed;transform:none;box-shadow:none}
.trg-btn-secondary{background:#f1f5f9;color:#475569;flex:0 0 auto;padding:16px 20px}
.trg-btn-secondary:hover{background:#e2e8f0}

/* Trust signals */
.trg-trust{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:16px;flex-wrap:wrap}
.trg-trust-item{display:flex;align-items:center;gap:6px;font-size:12px;color:#64748b;font-weight:500}
.trg-trust-item svg{width:14px;height:14px;color:#16a34a}

/* Compliance disclaimers */
.trg-disclaimer{font-size:11px;color:#64748b;line-height:1.6;background:#f8fafc;padding:14px;border-radius:10px;border-left:3px solid #1e3a8a;margin:16px 0}
.trg-disclaimer strong{color:#334155}
.trg-fcra-box{background:#fef3c7;border-left-color:#f59e0b}

/* Footer */
.trg-footer{text-align:center;padding:32px 20px;font-size:12px;color:#94a3b8;line-height:1.8}
.trg-footer a{color:#64748b;text-decoration:none;margin:0 8px}
.trg-footer a:hover{color:#1e3a8a;text-decoration:underline}

/* State blocked */
.trg-blocked{text-align:center;padding:40px 20px}
.trg-blocked-icon{font-size:48px;margin-bottom:16px}
.trg-blocked h2{font-size:24px;color:#dc2626;margin-bottom:12px}
.trg-blocked p{color:#64748b;font-size:15px;margin-bottom:20px}

/* Success state */
.trg-success{text-align:center;padding:20px 0}
.trg-success-icon{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#16a34a,#22c55e);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:#fff;font-size:40px;box-shadow:0 10px 30px rgba(22,163,74,.3)}
.trg-success h2{font-size:26px;color:#0f172a;margin-bottom:10px}
.trg-success p{color:#64748b;font-size:15px;margin-bottom:8px}
.trg-success .lead-id{display:inline-block;font-family:monospace;background:#f1f5f9;padding:6px 14px;border-radius:6px;font-size:13px;margin:10px 0}

/* Loading spinner */
.trg-spinner{display:inline-block;width:18px;height:18px;border:2.5px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.trg-btn.loading .trg-btn-text{display:none}

/* Responsive */
@media (max-width:480px){
  .trg-hero h1{font-size:24px}
  .trg-step-title{font-size:20px}
  .trg-card{padding:22px 18px;border-radius:14px}
  .trg-container{padding:16px 14px 40px}
}
