/* JobsMeetTalent — Candidate registration v2
   Responsive reconstruction of the supplied 1536x1024 reference.
   IMPORTANT: this stylesheet does not stretch a flattened screenshot over the page.
   All visible UI is live HTML so tabs, wizard Back/Continue, zoom and mobile remain usable. */

:root{
  --rp-navy:#061a36;
  --rp-ink:#10233f;
  --rp-muted:#66748a;
  --rp-border:#dfe5ed;
  --rp-gold:#efad1d;
  --rp-gold-soft:#fff4dd;
  --rp-bg:#f5f9fe;
}

html,body{min-height:100%;}
body{margin:0;background:var(--rp-bg);}

.auth-split.auth-split-pixel{
  width:100%; min-height:100vh; display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(460px,.98fr);
  overflow-x:hidden; background:var(--rp-bg);
}

/* ------------------------- LEFT / CANDIDATE HERO ------------------------- */
.auth-split-pixel .auth-split-brand{
  min-width:0; min-height:100vh; padding:28px clamp(28px,4.6vw,72px) 26px !important;
  color:var(--rp-ink) !important; background:
    radial-gradient(620px 340px at 72% 50%,rgba(223,239,255,.95),transparent 70%),
    linear-gradient(140deg,#fffdf8 0%,#fff 55%,#f5f9ff 100%) !important;
  display:grid !important; grid-template-rows:auto auto minmax(240px,1fr) auto;
  gap:0; position:relative; overflow:hidden;
}
.auth-split-pixel .auth-split-logo{display:flex;align-items:center;gap:12px;color:#0a1c36;text-decoration:none;}
.auth-split-pixel .auth-split-logo strong{font-size:21px;font-weight:800;letter-spacing:-.35px;}
.auth-split-pixel .sidebar-logo{width:40px;height:40px;border-radius:10px;background:var(--rp-gold);color:#0b1d34;display:grid;place-items:center;font-weight:800;font-size:14px;}

.auth-split-pixel .auth-split-brand > div:nth-child(2){position:relative;z-index:3;max-width:720px;}
.auth-split-pixel .auth-badge-pill{
  margin-top:44px !important; display:inline-flex;align-items:center;gap:6px;
  color:#94620a;background:var(--rp-gold-soft);border:1px solid #f5dfae;
  border-radius:999px;padding:8px 14px;font-size:12px;font-weight:700;
}
.auth-split-pixel .auth-badge-pill svg{flex:0 0 auto;}
.auth-split-pixel .auth-split-brand h2{
  margin:22px 0 16px !important; max-width:690px !important;
  color:var(--rp-navy) !important; font-size:clamp(42px,3.85vw,58px) !important;
  line-height:1.015 !important; font-weight:800 !important; letter-spacing:-1.9px !important;
}
.auth-split-pixel .auth-split-brand h2 .accent{color:var(--rp-gold) !important;}
.auth-split-pixel .auth-split-brand .lede{
  margin:0 !important; max-width:640px !important; color:#55657e !important;
  font-size:16px !important; line-height:1.55 !important;
}
.auth-split-pixel .auth-split-features{margin:24px 0 0 !important;gap:11px !important;}
.auth-split-pixel .auth-split-features li{
  color:#1d3557 !important; font-size:14px !important; line-height:1.42 !important;
  align-items:center !important; gap:10px !important;
}
.auth-split-pixel .auth-split-features li .tick{
  width:25px;height:25px;margin-top:0;background:var(--rp-gold) !important;color:#fff !important;
  box-shadow:0 2px 7px rgba(239,173,29,.16);
}
.auth-split-pixel .auth-split-features li .tick svg{width:13px;height:13px;stroke-width:3;}

.auth-split-pixel .auth-hero-wrap{
  position:relative !important; min-height:290px !important; margin:0 !important; overflow:visible;
  align-self:end; z-index:2;
}
.auth-split-pixel .auth-hero-wrap::before{
  content:""; position:absolute; width:min(470px,72%); height:250px; right:7%; bottom:10px;
  border-radius:48% 52% 46% 54%/56% 46% 54% 44%;
  background:radial-gradient(circle at 50% 45%,#fff0ba 0 27%,#e6efff 28% 66%,transparent 67%);
  opacity:.9; z-index:0;
}
.auth-split-pixel .auth-hero-photo{
  position:absolute !important; z-index:2; left:5%;right:8%;top:0;bottom:-4px;
  background-repeat:no-repeat !important; background-position:center bottom !important;
  background-size:contain !important;
}
.auth-split-pixel .auth-float-card{
  position:absolute; z-index:4; display:flex;align-items:center;gap:10px;
  padding:12px 14px !important; background:#fff !important; color:#132540 !important;
  border:1px solid rgba(223,229,237,.7); border-radius:15px !important;
  box-shadow:0 13px 30px rgba(18,45,78,.12) !important; max-width:230px !important;
}
.auth-split-pixel .auth-float-card .fc-icon{width:42px;height:42px;border-radius:12px;flex:0 0 auto;}
.auth-split-pixel .auth-float-card > div{min-width:0;}
.auth-split-pixel .auth-float-card b{font-size:13px !important;line-height:1.28 !important;}
.auth-split-pixel .auth-float-card span{font-size:11px !important;color:#687892 !important;line-height:1.35 !important;}
.auth-split-pixel .auth-float-card:nth-of-type(2){top:5% !important;right:3% !important;}
.auth-split-pixel .auth-float-card:nth-of-type(3){top:40% !important;right:-1% !important;}
.auth-split-pixel .auth-float-card:nth-of-type(4){top:70% !important;right:4% !important;}

.auth-split-pixel .auth-split-stats{
  position:relative; z-index:5; margin:8px 0 0 !important; padding:16px 0 0 !important;
  border-top:1px solid #dce4ee !important; display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px !important;
}
.auth-split-pixel .auth-split-stats .stat-v2{padding:0 !important;border:0 !important;display:flex;align-items:center;gap:10px;min-width:0;}
.auth-split-pixel .auth-split-stats .stat-v2-icon{width:42px;height:42px;border-radius:50%;}
.auth-split-pixel .auth-split-stats .stat-v2 strong{color:var(--rp-navy) !important;font-size:20px !important;line-height:1.1;}
.auth-split-pixel .auth-split-stats .stat-v2 span{color:#6b7890 !important;font-size:11px !important;line-height:1.35;}

/* ------------------------- RIGHT / FORM ------------------------- */
.auth-split-pixel .auth-split-form-side{
  min-width:0; min-height:100vh; padding:28px clamp(20px,4vw,72px) !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:linear-gradient(135deg,#f8fbff 0%,#eef5fc 100%) !important; overflow:visible !important;
}
.auth-split-pixel .auth-split-form-side .auth-box{width:100%;max-width:590px;margin:0 !important;}
.auth-split-pixel .auth-card{
  width:100%;background:#fff !important;border:1px solid #e1e7ef !important;
  border-radius:18px !important;padding:26px 28px 22px !important;
  box-shadow:0 18px 55px rgba(27,55,88,.10) !important; position:relative; overflow:visible !important;
}
.auth-split-pixel .auth-card::before{
  display:none !important;
}

.auth-split-pixel .auth-tabs{
  display:grid !important;grid-template-columns:1fr 1fr;gap:3px;
  background:#f6f4ef !important;border:1px solid #e5e0d6 !important;
  border-radius:12px !important;padding:3px !important;margin:0 0 20px !important;
}
.auth-split-pixel .auth-tabs a{
  text-decoration:none;padding:11px 12px !important;text-align:center;border-radius:9px !important;
  color:#64728a !important;font-size:13px !important;font-weight:700 !important;
}
.auth-split-pixel .auth-tabs a.active{background:#fff;color:var(--rp-ink) !important;box-shadow:0 2px 8px rgba(25,44,69,.07);}

.auth-split-pixel .reg-stepper{display:flex !important;align-items:flex-start;margin:0 4px 22px !important;}
.auth-split-pixel .reg-stepper-node{flex:0 0 84px;min-width:72px;display:flex;flex-direction:column;align-items:center;gap:7px;}
.auth-split-pixel .reg-stepper-circle{
  width:34px;height:34px;border-radius:50%;border:0;background:#edf0f3;color:#66748a;
  display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;
}
.auth-split-pixel .reg-stepper-node.active .reg-stepper-circle{background:var(--rp-gold);border-color:var(--rp-gold);color:#fff;}
.auth-split-pixel .reg-stepper-node.done .reg-stepper-circle{background:var(--rp-navy);border-color:var(--rp-navy);color:#fff;}
.auth-split-pixel .reg-stepper-text{font-size:11px;font-weight:700;color:#7a8799;text-align:center;line-height:1.25;}
.auth-split-pixel .reg-stepper-node.active .reg-stepper-text{color:#223752;}
.auth-split-pixel .reg-stepper-line{flex:1;height:2px;background:#dfe4ea;margin-top:16px;min-width:20px;}
.auth-split-pixel .reg-stepper-line.done{background:#233b5c;}

.auth-split-pixel .auth-card > h1{
  display:block !important;margin:0 !important;font-size:25px !important;line-height:1.18 !important;
  letter-spacing:-.55px;color:var(--rp-navy);font-weight:800 !important;
}
.auth-split-pixel .auth-card > h1 + p{
  display:block !important;color:#66758d !important;margin:7px 0 18px !important;
  font-size:14px !important;line-height:1.5 !important;
}
.auth-split-pixel .field{margin-bottom:15px !important;}
.auth-split-pixel .field label{display:block;font-size:12px;font-weight:600;color:#203753;margin-bottom:7px;}
.auth-split-pixel input,.auth-split-pixel select,.auth-split-pixel textarea{
  width:100%;height:49px;border:1px solid #d8e0e9 !important;border-radius:9px !important;
  background:#fff !important;color:#1a2d47 !important;font-family:inherit;font-size:14px !important;
  box-shadow:none !important;outline:none;transition:border-color .15s,box-shadow .15s;
}
.auth-split-pixel input:focus,.auth-split-pixel select:focus,.auth-split-pixel textarea:focus{
  border-color:#6aa2e8 !important;box-shadow:0 0 0 3px rgba(76,143,221,.10) !important;
}
.auth-split-pixel input::placeholder{color:#9aa7b7;opacity:1;}
.auth-split-pixel .field-icon-wrap>svg{left:14px !important;color:#9aa7b7 !important;}
.auth-split-pixel .field-icon-wrap input{padding-left:41px !important;}
.auth-split-pixel .phone-input-group{display:grid !important;grid-template-columns:92px 1fr;width:100%;}
.auth-split-pixel .phone-input-group .phone-prefix{height:49px;padding:0 12px;border:1px solid #d8e0e9;border-right:0;border-radius:9px 0 0 9px;background:#fff;color:#223752;font-size:13px;display:flex;align-items:center;justify-content:center;gap:4px;}
.auth-split-pixel .phone-input-group input{border-radius:0 9px 9px 0 !important;}
.auth-split-pixel .checkbox-row{display:flex !important;align-items:flex-start;gap:8px;font-size:12px !important;line-height:1.45;}
.auth-split-pixel .checkbox-row input{width:15px;height:15px;flex:0 0 15px;margin-top:2px;}
.auth-split-pixel .reg-step-actions{display:flex;gap:10px;margin-top:18px !important;}
.auth-split-pixel .reg-step-actions .btn{height:50px !important;border-radius:10px !important;font-size:14px !important;font-weight:700 !important;flex:1;}
.auth-split-pixel .reg-step-actions .btn-secondary{background:#fff !important;color:#163050 !important;border:1px solid #d5dde6 !important;box-shadow:none !important;}
.auth-split-pixel .reg-step-actions .btn-primary{background:var(--rp-navy) !important;color:#fff !important;border:0 !important;}
.auth-split-pixel .auth-legal{margin-top:12px !important;color:#728096 !important;font-size:10.5px !important;line-height:1.7 !important;}
.auth-split-pixel .auth-legal a{color:#728096;}

/* Candidate Step 1 */
.auth-split-candidate .mode-choice-v2{display:flex;flex-direction:column;gap:10px;width:100%;}
.auth-split-candidate .mode-choice-v2-option{
  display:grid !important;grid-template-columns:20px 44px minmax(0,1fr);column-gap:11px;align-items:center;
  width:100%;min-height:94px;padding:12px 14px;border:1.5px solid #dce3ec;border-radius:12px;
  background:#fff;cursor:pointer;transition:.16s ease;position:relative;
}
.auth-split-candidate .mode-choice-v2-option:hover{border-color:#c6d1df;}
.auth-split-candidate .mode-choice-v2-option:has(input:checked){border-color:#1670e8;background:#f3f8ff;box-shadow:0 0 0 1px #1670e8 inset;}
.auth-split-candidate .mode-choice-v2-option input[type=radio]{width:17px;height:17px;margin:0;accent-color:#1670e8;}
.auth-split-candidate .mcv2-icon{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.auth-split-candidate .mcv2-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.auth-split-candidate .mcv2-top b{font-size:15px;line-height:1.2;color:#0e2542;}
.auth-split-candidate .mcv2-badge{font-size:10px;padding:5px 9px;border-radius:999px;font-weight:700;white-space:nowrap;}
.auth-split-candidate .mcv2-desc{font-size:12.5px;line-height:1.45;margin-top:5px;color:#63738a;}
.auth-split-candidate .auth-tip-box{display:flex;align-items:flex-start;gap:10px;width:100%;margin-top:13px;padding:14px 15px;border:0;border-radius:11px;background:#edf5ff;color:#586b86;font-size:12px;line-height:1.5;}
.auth-split-candidate .auth-tip-box svg{flex:0 0 auto;color:#e9a918;margin-top:1px;}

/* Keep all wizard steps in the normal flow. Base stylesheet supplies .has-js hiding. */
.auth-split-pixel .reg-step{position:relative !important;left:auto !important;right:auto !important;top:auto !important;width:auto !important;height:auto !important;margin:0 !important;padding:0 !important;background:transparent !important;}
.auth-split-pixel .reg-step::before{display:none !important;}
.auth-split-pixel .reg-step-actions .js-only{display:flex;}

/* ------------------------------- BREAKPOINTS ---------------------------- */
@media (max-width:1180px) and (min-width:901px){
  .auth-split.auth-split-pixel{grid-template-columns:minmax(0,1fr) minmax(430px,.96fr);}
  .auth-split-pixel .auth-split-brand{padding-left:34px !important;padding-right:30px !important;}
  .auth-split-pixel .auth-split-brand h2{font-size:45px !important;}
  .auth-split-pixel .auth-float-card{transform:scale(.92);transform-origin:right center;}
}

@media (max-width:900px){
  .auth-split.auth-split-pixel{display:block !important;min-height:0;}
  .auth-split-pixel .auth-split-brand{min-height:0 !important;padding:24px 24px 28px !important;display:block !important;}
  .auth-split-pixel .auth-badge-pill{margin-top:28px !important;}
  .auth-split-pixel .auth-split-brand h2{font-size:40px !important;max-width:760px !important;}
  .auth-split-pixel .auth-split-brand .lede{max-width:720px !important;}
  .auth-split-pixel .auth-hero-wrap{min-height:310px !important;margin-top:10px !important;}
  .auth-split-pixel .auth-split-stats{margin-top:14px !important;}
  .auth-split-pixel .auth-split-form-side{min-height:auto;padding:24px !important;}
  .auth-split-pixel .auth-split-form-side .auth-box{max-width:680px;}
}

@media (max-width:640px){
  .auth-split-pixel .auth-split-brand{padding:20px 18px 24px !important;}
  .auth-split-pixel .auth-split-logo strong{font-size:18px;}
  .auth-split-pixel .sidebar-logo{width:36px;height:36px;}
  .auth-split-pixel .auth-badge-pill{margin-top:24px !important;font-size:11px;padding:7px 12px;}
  .auth-split-pixel .auth-split-brand h2{font-size:32px !important;letter-spacing:-1px !important;margin-top:18px !important;}
  .auth-split-pixel .auth-split-brand .lede{font-size:14px !important;}
  .auth-split-pixel .auth-split-features{margin-top:20px !important;gap:9px !important;}
  .auth-split-pixel .auth-split-features li{font-size:12.5px !important;}
  .auth-split-pixel .auth-split-features li .tick{width:22px;height:22px;}
  .auth-split-pixel .auth-hero-wrap{min-height:260px !important;}
  .auth-split-pixel .auth-float-card{padding:9px 10px !important;max-width:185px !important;transform:scale(.88);}
  .auth-split-pixel .auth-float-card .fc-icon{width:34px;height:34px;border-radius:10px;}
  .auth-split-pixel .auth-float-card b{font-size:11px !important;}
  .auth-split-pixel .auth-float-card span{font-size:9.5px !important;}
  .auth-split-pixel .auth-float-card:nth-of-type(2){top:1% !important;right:0 !important;}
  .auth-split-pixel .auth-float-card:nth-of-type(3){top:38% !important;right:-3% !important;}
  .auth-split-pixel .auth-float-card:nth-of-type(4){top:70% !important;right:0 !important;}
  .auth-split-pixel .auth-split-stats{grid-template-columns:1fr;gap:10px !important;padding-top:14px !important;}
  .auth-split-pixel .auth-split-stats .stat-v2{justify-content:flex-start;}
  .auth-split-pixel .auth-split-form-side{padding:14px 14px 24px !important;}
  .auth-split-pixel .auth-card{padding:18px 16px !important;border-radius:15px !important;}
  .auth-split-pixel .auth-tabs{margin-bottom:16px !important;}
  .auth-split-pixel .reg-stepper{margin:0 0 18px !important;}
  .auth-split-pixel .reg-stepper-node{flex-basis:70px;min-width:50px;}
  .auth-split-pixel .reg-stepper-circle{width:30px;height:30px;font-size:12px;}
  .auth-split-pixel .reg-stepper-line{margin-top:14px;min-width:8px;}
  .auth-split-pixel .reg-stepper-text{font-size:9px;}
  .auth-split-pixel .auth-card > h1{font-size:21px !important;}
  .auth-split-candidate .mode-choice-v2-option{min-height:86px;grid-template-columns:18px 40px minmax(0,1fr);padding:10px 11px;column-gap:9px;}
  .auth-split-candidate .mcv2-icon{width:40px;height:40px;}
  .auth-split-candidate .mcv2-top b{font-size:14px;}
  .auth-split-candidate .mcv2-desc{font-size:11.5px;}
  .auth-split-candidate .mcv2-badge{font-size:9px;padding:4px 7px;}
  .auth-split-candidate .auth-tip-box{font-size:11.5px;padding:12px;}
  .auth-split-pixel .reg-step-actions{gap:8px;}
  .auth-split-pixel .reg-step-actions .btn{height:47px !important;font-size:13px !important;}
}

/* ---------------------------------------------------------------------
   Side-by-side hero (2026-10): on tablet/desktop, put the copy block and
   the hero photo next to each other instead of stacking the photo below
   the checklist — keeps the brand panel from running taller than the
   form panel. Mobile (<=900px) is untouched; it already stacks via the
   existing display:block override below.
   --------------------------------------------------------------------- */
@media (min-width:901px){
  .auth-split-pixel .auth-split-brand{
    display:grid !important;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;
    grid-template-rows:auto auto auto !important;
    align-content:center;
    grid-template-areas:
      "logo logo"
      "content photo"
      "stats stats" !important;
    column-gap:28px;
    row-gap:0;
  }
  .auth-split-pixel .auth-split-logo{ grid-area:logo; }
  .auth-split-pixel .auth-split-brand > div:nth-child(2){
    grid-area:content; max-width:none !important; align-self:center;
  }
  .auth-split-pixel .auth-badge-pill{ margin-top:0 !important; }
  .auth-split-pixel .auth-split-brand h2{
    font-size:clamp(26px,2.4vw,36px) !important; line-height:1.1 !important;
    letter-spacing:-.9px !important; margin:16px 0 12px !important; max-width:none !important;
  }
  .auth-split-pixel .auth-split-brand .lede{
    font-size:13.5px !important; line-height:1.55 !important; max-width:none !important;
  }
  .auth-split-pixel .auth-split-features{ margin-top:16px !important; gap:8px !important; }
  .auth-split-pixel .auth-split-features li{ font-size:12.5px !important; }
  .auth-split-pixel .auth-split-features li .tick{ width:20px; height:20px; }

  .auth-split-pixel .auth-hero-wrap{
    grid-area:photo; align-self:center; min-height:260px !important; margin:0 !important;
  }
  .auth-split-pixel .auth-float-card{ transform:scale(.82); max-width:185px !important; padding:10px 12px !important; }
  .auth-split-pixel .auth-float-card:nth-of-type(2){ top:3% !important; right:14% !important; }
  .auth-split-pixel .auth-float-card:nth-of-type(3){ top:40% !important; right:9% !important; }
  .auth-split-pixel .auth-float-card:nth-of-type(4){ top:72% !important; right:15% !important; }

  .auth-split-pixel .auth-split-stats{ grid-area:stats; margin-top:18px !important; }
}

@media (min-width:1280px){
  .auth-split-pixel .auth-split-brand h2{ font-size:clamp(30px,2vw,40px) !important; }
  .auth-split-pixel .auth-hero-wrap{ min-height:300px !important; }
  .auth-split-pixel .auth-float-card{ transform:scale(.9); max-width:200px !important; }
  .auth-split-pixel .auth-float-card:nth-of-type(2){ right:12% !important; }
  .auth-split-pixel .auth-float-card:nth-of-type(3){ right:7% !important; }
  .auth-split-pixel .auth-float-card:nth-of-type(4){ right:13% !important; }
}
