/* Public recruitment page. Authenticated operation keeps its compact layout. */
body:has(#app[data-screen="welcome"]){background:#f4f9ff}
#app[data-screen="welcome"]{background:linear-gradient(180deg,#eef6ff 0,#fff 900px)}
#app[data-screen="welcome"] .app-top{background:transparent;height:84px}
#welcome .phone-hero{padding:22px 0 64px;position:relative}
.phone-heading{text-align:center;margin:0 auto 34px}
#welcome .phone-heading h1{font-size:clamp(36px,4.3vw,64px);letter-spacing:-2.5px;line-height:1.06;margin:18px 0;color:#102f50}
#welcome .phone-heading h1 em{color:#087cf0}
.phone-heading>p{font-size:15px;line-height:1.75;color:#60758d}
.phone-stage{display:grid;grid-template-columns:1fr minmax(340px,410px) 1fr;gap:28px;align-items:center;max-width:1280px;margin:auto}
.phone-card{position:relative;z-index:2;background:#fff;padding:30px;border:1px solid #dfebf9;border-radius:28px;box-shadow:0 24px 70px #22588c17;text-align:left}
.phone-step{color:#3279ba;letter-spacing:1.8px;font-size:10px;font-weight:750}
#welcome .phone-card h2{font-size:29px;line-height:1.18;color:#143654;margin:16px 0 12px}
.phone-card>p{font-size:13px;color:#6b7e91;line-height:1.65}
.phone-card label{font-size:12px;color:#31516f;font-weight:650;display:block;margin:22px 0 9px}
.join-phone-wrap{display:flex;border:1px solid #cedff0;border-radius:12px;background:#f9fcff;align-items:center;overflow:hidden}
.join-phone-wrap>span{padding:0 15px;color:#5b7590;border-right:1px solid #dce8f4;font-size:14px}
#join-phone{border:0;outline:0;background:transparent;min-width:0;width:100%;height:54px;margin:0;font-size:17px;padding:12px}
.join-phone-wrap:focus-within{outline:3px solid #c4e4ff;border-color:#5ba9ec}
#welcome #show-signup{width:100%;display:flex;align-items:center;justify-content:center;gap:14px;border:0;background:#087cf0;color:#fff;min-height:52px;border-radius:12px;font-size:14px;font-weight:700;margin:18px 0 0;box-shadow:0 6px 14px #087cf024;transition:transform .2s,background .2s}
#welcome #show-signup:hover{background:#086bd0;transform:translateY(-2px)}
.phone-card .phone-note{font-size:11px;line-height:1.7;margin:13px 0 20px;color:#7d8c9c}
.phone-login{border-top:1px solid #e9eff6;padding-top:18px;text-align:center;color:#7c8da0;font-size:12px}
#show-login{display:block;border:0;background:transparent;color:#0875db;padding:8px;font-size:13px;font-weight:700;margin:4px auto 0;cursor:pointer}
.rider-scene{position:relative;transform:rotate(-3deg);animation:scene-drift 7s ease-in-out infinite}
.rider-scene>img{width:100%;height:370px;object-fit:cover;object-position:52%;border-radius:110px 32px 90px 32px;box-shadow:0 20px 50px #2b60971a}
.rider-scene>small{display:block;text-align:center;color:#8196aa;font-size:9px;margin-top:8px}
.scene-label{position:absolute;bottom:40px;left:10px;right:10px;background:#ffffffef;box-shadow:0 8px 30px #163b6b18;padding:14px 10px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:#2f658f;transform:rotate(3deg)}
.phone-side{text-align:left;padding:0 12px;position:relative}
.phone-side>img{width:100%;height:190px;object-fit:cover;border-radius:28px;transform:rotate(3deg);margin-bottom:24px;animation:scene-drift 8s ease-in-out infinite reverse}
.phone-side-tag{font-size:9px;color:#3682bd;font-weight:750;letter-spacing:1.5px}
.phone-side h3{font-size:27px;letter-spacing:-.8px;line-height:1.25;color:#254c6f;margin:12px 0}
.phone-side p{font-size:13px;line-height:1.8;color:#70879d;max-width:230px}
.phone-side a{font-size:12px;color:#0875db;font-weight:650;text-decoration:none}
#welcome .cl-modalities{padding-top:36px;border-top:1px solid #e4eef8}
#welcome .cl-benefits>div>span{background:#eaf4ff;color:#398dd0}
#welcome .cl-step-grid article{border:0;background:#f2f8ff}
#welcome .cl-bottom{background:linear-gradient(120deg,#e1f0ff,#f0f8ff);border:0}
#app[data-screen="auth"]{box-shadow:0 20px 70px #21477712;border-radius:24px}
#auth .auth-symbol{display:none}
#auth .eyebrow{display:block;margin-top:20px}
@keyframes scene-drift{0%,100%{translate:0 0}50%{translate:0 -9px}}
@media(min-width:1600px){.phone-stage{gap:44px}}
@media(max-width:1000px){.phone-stage{grid-template-columns:1fr minmax(320px,400px);gap:22px}.phone-side{display:none}.phone-heading{margin-bottom:28px}.rider-scene>img{height:390px}}
@media(max-width:620px){#welcome{padding:0 20px}#app[data-screen="welcome"] .app-top{height:72px;padding:18px 22px}#welcome .phone-hero{padding:10px 0 34px}#welcome .phone-heading h1{font-size:37px;letter-spacing:-1.7px;margin:14px 0}.phone-heading>p{font-size:12px;line-height:1.7}.phone-heading{margin-bottom:22px}.phone-stage{display:flex;flex-direction:column;gap:24px}.phone-card{width:100%;max-width:410px;padding:25px;border-radius:22px}.rider-scene{order:2;width:100%;max-width:410px;animation:none;transform:none}.rider-scene>img{height:235px;border-radius:24px;object-position:center 45%}.scene-label{left:20px;right:20px;bottom:32px;transform:none}#welcome .phone-card h2{font-size:26px}.phone-heading .cl-kicker{font-size:9px}.phone-side{display:none}#welcome .cl-modalities{padding-top:25px}}
@media(prefers-reduced-motion:reduce){.rider-scene,.phone-side>img{animation:none}#welcome #show-signup{transition:none}}
@media(max-width:620px){#welcome .cl-bottom{margin:0 -20px;padding:30px 20px}#welcome .cl-step-grid article{padding:18px;border-radius:16px}}

/* Recruitment refresh: clearer hierarchy, stronger blue and less empty space. */
#app[data-screen="welcome"]{background:radial-gradient(ellipse at 10% 16%,#dbeeff 0,transparent 30%),radial-gradient(ellipse at 90% 6%,#d7ecff 0,transparent 28%),linear-gradient(#f5faff,#fff 1100px)}
#welcome .phone-hero{padding-top:18px;padding-bottom:58px}
#welcome .phone-heading h1{font-size:clamp(40px,4.8vw,70px);font-weight:850;letter-spacing:-2.8px}
.phone-heading>p{color:#526f8c;max-width:650px;margin:20px auto 0}
.hero-highlights{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:22px 0 0}
.hero-highlights span{display:inline-flex;align-items:center;gap:7px;color:#447399;font-size:11px;font-weight:600}
.hero-highlights span:before{content:"";width:5px;height:5px;background:#238bed;border-radius:50%}
.phone-card{border-color:#cfe5fc;box-shadow:0 20px 60px #2262a320;border-top:4px solid #1585ef}
.phone-card .phone-step{background:#edf6ff;padding:6px 9px;border-radius:6px;display:inline-block;font-size:9px;letter-spacing:1.3px}
.rider-scene>img{height:390px;border-radius:80px 28px 80px 28px}
.scene-label{bottom:24px}
.phone-side>img{border:5px solid #fff;box-shadow:0 12px 30px #2e64971a}
#welcome .cl-modalities{padding:38px 0 24px;border-top:0}
#welcome .cl-modalities>h2{max-width:600px;font-size:clamp(27px,3vw,38px);color:#173d61}
#welcome .cl-modality-grid{margin-top:24px}
#welcome .cl-modality-grid article{background:linear-gradient(120deg,#e5f2ff,#f3f9ff);border-radius:28px;padding:26px;grid-template-columns:minmax(220px,38%) 1fr;gap:6px 36px;overflow:hidden}
#welcome .cl-modality-grid .cl-vehicle-photo{width:100%;margin:0;height:auto;max-height:300px;border-radius:20px;mix-blend-mode:multiply;object-fit:contain}
#welcome .cl-modality-grid h3{font-size:30px;line-height:1.2;letter-spacing:-.8px;margin:0;color:#173d61}
#welcome .cl-modality-grid p{font-size:14px;line-height:1.8;color:#597b97;max-width:550px;margin:10px 0}
#welcome .cl-modality-grid button{justify-self:start;width:auto;padding:13px 22px;background:#147dd7;border-radius:10px;margin-top:6px}
#welcome .cl-benefits{margin:12px 0 44px;padding:24px 0}
#welcome .cl-step-grid{gap:16px;margin:28px 0 46px}
#welcome .cl-step-grid article{padding:26px;border:1px solid #e1edfa;border-radius:20px;background:#fff;box-shadow:0 8px 25px #245a8910}
#welcome .cl-step-grid article>span{font-size:23px;color:#1981de;font-weight:750}
#welcome .cl-step-grid h3{font-size:17px;color:#234e73}
#welcome .cl-step-grid p{color:#6a8298;font-size:13px}
#welcome .cl-bottom{background:radial-gradient(ellipse at 90% 0,#268bed,transparent 65%),#095db1;color:#fff;padding-top:42px;padding-bottom:42px}
#welcome .cl-bottom h2{color:white;font-size:clamp(28px,3.2vw,42px);letter-spacing:-1px}
#welcome .cl-bottom .cl-kicker{color:#b9ddff}#welcome .cl-bottom p{color:#d0e7ff}
#welcome .cl-bottom .primary{background:#fff;color:#0968c4;box-shadow:0 8px 22px #03428033;border:0;font-weight:750}
#welcome .cl-faq{margin:48px auto}#welcome .cl-faq summary{color:#365d80;font-weight:600}#welcome .cl-faq p{color:#6b8297}
@media(max-width:620px){#welcome .phone-heading h1{font-size:43px;letter-spacing:-2px}.phone-heading>p{font-size:13px;margin-top:16px}.hero-highlights{gap:7px 12px;margin-top:16px}.hero-highlights span{font-size:9px}.rider-scene>img{height:260px;border-radius:24px}#welcome .cl-modality-grid article{display:block;padding:22px}#welcome .cl-modality-grid .cl-vehicle-photo{margin-bottom:22px;max-height:240px}#welcome .cl-modality-grid h3{font-size:27px}#welcome .cl-modality-grid p{font-size:13px}#welcome .cl-step-grid article{padding:20px}#welcome .cl-step-grid h3{font-size:15px}#welcome .phone-hero{padding-bottom:22px}#welcome .cl-benefits{margin-bottom:30px}}