/* ── Velox Careers Public Styles ─── */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700;800&family=DM+Sans:wght@400;500;600&display=swap');

#velox-careers, .vc-apply-section, .vc-job-detail { font-family: 'DM Sans', sans-serif; }

/* HERO */
.vc-hero { background: linear-gradient(135deg, #0a1628 0%, #0d3a6e 60%, #1a0a3e 100%); color: white; padding: 80px 20px 60px; text-align: center; }
.vc-hero-inner { max-width: 760px; margin: 0 auto; }
.vc-hero-badge { display: inline-block; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); border-radius: 100px; padding: 5px 18px; font-size: 13px; font-weight: 600; margin-bottom: 20px; color: #a5c8ff; }
.vc-hero h1 { font-family: 'Sora', sans-serif; font-size: clamp(28px,5vw,48px); font-weight: 800; letter-spacing: -1.5px; margin-bottom: 14px; line-height: 1.15; }
.vc-hero h1 span { background: linear-gradient(90deg,#60a5fa,#a78bfa); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.vc-hero p { color: #94b8d4; font-size: 17px; margin-bottom: 32px; }
.vc-search-row { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.vc-search-box { display: flex; align-items: center; gap: 8px; background: white; border-radius: 10px; padding: 10px 16px; flex: 1; min-width: 220px; max-width: 380px; }
.vc-search-box input { border: none; outline: none; font-size: 14px; flex: 1; font-family: 'DM Sans', sans-serif; }
.vc-select { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); color: white; padding: 10px 14px; border-radius: 10px; font-size: 13px; cursor: pointer; font-family: 'DM Sans', sans-serif; }
.vc-select option { background: #1e3a5f; }

/* BODY */
.vc-body { max-width: 1100px; margin: 0 auto; padding: 40px 20px 60px; }
.vc-count { font-size: 14px; color: #64748b; margin-bottom: 20px; font-weight: 600; }
.vc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; }

/* JOB CARD */
.vc-job-card { background: white; border: 1px solid #e2e8f0; border-radius: 14px; padding: 24px; transition: all 0.25s; box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.vc-job-card:hover { border-color: #2563eb; box-shadow: 0 8px 30px rgba(37,99,235,.12); transform: translateY(-2px); }
.vc-job-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.vc-job-dept { font-size: 11px; font-weight: 700; color: #2563eb; text-transform: uppercase; letter-spacing: 1px; }
.vc-job-type { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 20px; }
.vc-type-full-time { background: #dbeafe; color: #1d4ed8; }
.vc-type-part-time { background: #d1fae5; color: #065f46; }
.vc-type-contract { background: #fef3c7; color: #92400e; }
.vc-type-internship { background: #ede9fe; color: #5b21b6; }
.vc-job-title { font-family: 'Sora', sans-serif; font-size: 18px; font-weight: 700; color: #0f172a; margin-bottom: 10px; }
.vc-job-meta { display: flex; gap: 12px; flex-wrap: wrap; font-size: 13px; color: #64748b; margin-bottom: 14px; }
.vc-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.vc-tag { font-size: 11px; background: #f1f5f9; color: #475569; border-radius: 6px; padding: 3px 9px; font-weight: 500; }
.vc-job-footer { border-top: 1px solid #f1f5f9; padding-top: 14px; }
.vc-apply-btn { display: inline-block; background: linear-gradient(135deg, #1d4ed8, #2563eb); color: white; padding: 10px 22px; border-radius: 8px; font-weight: 700; font-size: 14px; text-decoration: none; transition: all 0.2s; cursor: pointer; border: none; font-family: 'DM Sans', sans-serif; }
.vc-apply-btn:hover { background: linear-gradient(135deg, #1e40af, #1d4ed8); transform: translateY(-1px); box-shadow: 0 4px 14px rgba(37,99,235,.3); color: white; text-decoration: none; }
.vc-apply-btn-lg { display: block; text-align: center; padding: 15px 28px; font-size: 16px; margin-top: 24px; border-radius: 10px; }
.vc-empty { text-align: center; padding: 60px 20px; color: #64748b; }
.vc-empty-icon { font-size: 48px; margin-bottom: 16px; }

/* APPLY SECTION */
.vc-apply-section { max-width: 800px; margin: 0 auto; padding: 48px 20px; }
.vc-apply-job-header { background: linear-gradient(135deg, #f0f7ff, #f5f0ff); border: 1px solid #c7d7f9; border-radius: 14px; padding: 28px; margin-bottom: 28px; }
.vc-apply-job-badge { display: inline-block; background: #2563eb; color: white; font-size: 11px; font-weight: 700; padding: 3px 12px; border-radius: 20px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; }
.vc-apply-job-header h2 { font-family: 'Sora', sans-serif; font-size: 26px; font-weight: 800; color: #0f172a; margin-bottom: 6px; }
.vc-apply-job-header p { color: #64748b; font-size: 14px; }
.vc-job-description { margin-top: 14px; font-size: 14px; color: #374151; }
.vc-form-card { background: white; border: 1px solid #e2e8f0; border-radius: 16px; padding: 32px; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
.vc-form-card h3 { font-family: 'Sora', sans-serif; font-size: 20px; font-weight: 700; margin-bottom: 24px; color: #0f172a; }
.vcf-row { margin-bottom: 18px; }
.vcf-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.vcf-field label { display: block; font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 6px; }
.vcf-field label small { font-weight: 400; color: #9ca3af; }
.vcf-input { width: 100%; padding: 11px 14px; border: 1.5px solid #e2e8f0; border-radius: 9px; font-size: 14px; outline: none; font-family: 'DM Sans', sans-serif; transition: border-color .2s; box-sizing: border-box; }
.vcf-input:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.1); }
.vcf-upload-zone { border: 2px dashed #c7d7f9; border-radius: 12px; padding: 32px; text-align: center; cursor: pointer; transition: all .2s; background: #f8fbff; }
.vcf-upload-zone:hover, .vcf-upload-zone.has-file { border-color: #2563eb; background: #eff6ff; }
.vcf-upload-icon { font-size: 32px; margin-bottom: 8px; }
.vcf-upload-text { font-weight: 600; color: #1d4ed8; margin-bottom: 4px; }
.vcf-upload-sub { font-size: 12px; color: #9ca3af; }
.vcf-file-name { background: #d1fae5; color: #065f46; padding: 8px 14px; border-radius: 8px; font-size: 13px; font-weight: 600; margin-top: 8px; }
.vc-form-msg { padding: 12px 16px; border-radius: 9px; font-size: 14px; font-weight: 600; margin-bottom: 16px; }
.vc-msg-success { background: #d1fae5; color: #065f46; border: 1px solid #6ee7b7; }
.vc-msg-error   { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }

/* JOB DETAIL */
.vc-job-detail { max-width: 760px; margin: 0 auto; padding: 40px 20px; }
.vc-detail-header { margin-bottom: 32px; }
.vc-detail-header h1 { font-family: 'Sora', sans-serif; font-size: 36px; font-weight: 800; color: #0f172a; margin: 12px 0; }
.vc-detail-meta { display: flex; gap: 16px; flex-wrap: wrap; font-size: 14px; color: #64748b; }
.vc-detail-section { background: white; border: 1px solid #e2e8f0; border-radius: 12px; padding: 24px; margin-bottom: 20px; }
.vc-detail-section h3 { font-family: 'Sora', sans-serif; font-weight: 700; margin-bottom: 14px; color: #1e3a5f; }

@media(max-width:600px) {
  .vcf-2col, .vc-search-row { grid-template-columns:1fr; flex-direction:column; }
  .vc-hero { padding: 50px 16px 40px; }
}