/* Javna forma za zagon kampanje (input.jobbit.si). Jobbit brand, mobile-first.
   Samostojna od portala; deli le pisave/logo iz /assets. */
:root{
  --dark:#0D1F1A; --green:#1D9E75; --neon:#BEED0A;
  --paper:#F4F7F5; --card:#fff; --line:#e0e6e2; --muted:#63837c; --ink:#0D241E; --body:#33433f;
  --danger:#C2564B; --ok:#1D9E75;
  --r:14px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Aeonik',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  background:var(--paper); color:var(--ink); -webkit-font-smoothing:antialiased;
  font-size:15px; line-height:1.5;
}
@font-face{font-family:'Aeonik';src:url('/assets/AeonikPro-Regular.otf') format('opentype');font-weight:400;font-display:swap;}
@font-face{font-family:'Aeonik';src:url('/assets/AeonikPro-Medium.otf') format('opentype');font-weight:500;font-display:swap;}

/* ---- Header / banner ---- */
.ihead{
  background:linear-gradient(150deg,#0D1F1A 0%,#123a2c 60%,#1D9E75 135%);
  color:#fff; padding:26px 20px 30px;
}
.iheadIn{max-width:720px;margin:0 auto;}
.ibrand{display:flex;align-items:center;gap:9px;margin-bottom:20px;}
.ibrand img{height:22px;display:block;}
.ibrand b{font-weight:500;font-size:17px;letter-spacing:-.01em;}
.iready{
  display:inline-block;font-size:12px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;
  background:var(--neon);color:var(--dark);padding:5px 12px;border-radius:999px;margin-bottom:14px;
}
.ihead h1{font-size:23px;font-weight:500;margin:0 0 8px;letter-spacing:-.01em;}
.ihead p{font-size:14px;color:rgba(255,255,255,.85);margin:0;max-width:60ch;}

/* ---- Layout ---- */
.iwrap{max-width:720px;margin:0 auto;padding:22px 20px 90px;}
.updated{background:#eef9f2;border:1px solid #cdeeda;color:#0a7d5f;border-radius:11px;padding:10px 14px;font-size:13px;margin-bottom:18px;}

.sect{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px 18px;margin-bottom:16px;box-shadow:0 1px 2px rgba(13,36,30,.04);}
.sect > h2{font-size:16px;font-weight:500;margin:0 0 4px;color:var(--ink);}
.sect > .subtitle{font-size:13px;color:var(--muted);margin:0 0 14px;}
.sect > h2 + .field, .sect > h2 + .subtitle + .field{margin-top:14px;}

/* ---- Fields ---- */
.field{margin-bottom:16px;}
.field:last-child{margin-bottom:0;}
.field label.lab{display:block;font-size:13.5px;font-weight:500;color:var(--ink);margin-bottom:2px;}
.field .req{color:var(--green);}
.field .hint{display:block;font-size:12.5px;color:var(--muted);margin:0 0 8px;line-height:1.45;}
.field input,.field textarea{
  width:100%;padding:11px 13px;border:1.5px solid var(--line);border-radius:11px;
  font-family:inherit;font-size:15px;color:var(--ink);background:#fff;outline:none;
}
.field textarea{min-height:96px;resize:vertical;line-height:1.5;}
.field input:focus,.field textarea:focus{border-color:var(--green);}
.field.invalid input,.field.invalid textarea{border-color:var(--danger);background:#fdf6f5;}
.field .fieldErr{color:var(--danger);font-size:12.5px;margin-top:6px;display:none;}
.field.invalid .fieldErr{display:block;}

/* ---- Files ---- */
.filebox{border:1.5px dashed var(--line);border-radius:12px;padding:16px;text-align:center;background:#fafcfb;transition:.15s;}
.filebox.drag{border-color:var(--green);background:#f0f9f4;}
.filebox .pick{display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-weight:500;font-size:14px;color:var(--green);}
.filebox .pick input{display:none;}
.filebox .dropnote{font-size:12.5px;color:var(--muted);margin-left:6px;}
.filelist{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;}
.filelist li{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 11px;font-size:13px;}
.filelist li .fn{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.filelist li .sz{color:var(--muted);font-size:12px;flex:none;}
.filelist li .st{font-size:12px;color:var(--green);flex:none;}
.filelist li.err{border-color:rgba(194,86,75,.4);background:#fdf6f5;}
.filelist li .rm{border:none;background:#f0eceb;color:var(--danger);width:24px;height:24px;border-radius:7px;cursor:pointer;font-size:14px;line-height:1;flex:none;}
.filenote{font-size:12px;color:var(--muted);margin-top:9px;}
.uploadWarn{background:#fff7ed;border:1px solid #f4d9a8;color:#9a6a12;border-radius:10px;padding:10px 13px;font-size:12.5px;margin-top:10px;}

/* honeypot (skrito) */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* ---- Submit bar ---- */
.submitBar{max-width:720px;margin:0 auto;padding:4px 0 0;}
.formErr{color:var(--danger);font-size:13.5px;margin:0 0 12px;display:none;}
.formErr.show{display:block;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 22px;border:none;border-radius:12px;background:var(--green);color:#fff;
  font-family:inherit;font-size:15px;font-weight:500;cursor:pointer;width:100%;
}
.btn:hover{filter:brightness(.96);}
.btn:disabled{opacity:.55;cursor:default;}
.btn.neon{background:var(--neon);color:var(--dark);}
.btn.ghost{background:#fff;border:1.5px solid var(--line);color:var(--body);}

/* ---- Center states (loading / invalid / thanks) ---- */
.center{max-width:520px;margin:0 auto;padding:70px 22px;text-align:center;}
.center .ico{font-size:40px;line-height:1;margin-bottom:14px;}
.center h1{font-size:22px;font-weight:500;margin:0 0 8px;}
.center p{font-size:14.5px;color:var(--body);margin:0 auto 20px;max-width:44ch;}
.center .btn{max-width:280px;margin:0 auto;}
.spin{width:30px;height:30px;border:3px solid var(--line);border-top-color:var(--green);border-radius:50%;margin:0 auto;animation:sp .8s linear infinite;}
@keyframes sp{to{transform:rotate(360deg);}}

/* ---- Modal (logo confirm) ---- */
.mbg{position:fixed;inset:0;background:rgba(13,31,26,.5);z-index:60;display:flex;align-items:center;justify-content:center;padding:20px;}
.mbox{background:#fff;border-radius:16px;max-width:440px;width:100%;padding:24px;box-shadow:0 30px 70px rgba(13,36,30,.4);}
.mbox h3{margin:0 0 8px;font-size:18px;font-weight:500;}
.mbox p{margin:0 0 20px;font-size:14px;color:var(--body);}
.mact{display:flex;gap:10px;}
.mact .btn{width:auto;flex:1;}

@media(min-width:640px){
  .field.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
}