:root{--jo-navy:#071126;--jo-ink:#12223b;--jo-blue:#2563eb;--jo-teal:#14b8a6;--jo-muted:#64748b}
html,body{max-width:100%;overflow-x:clip}
.jo-wrap{width:min(1180px,calc(100% - 64px));margin-inline:auto}
.jo-eyebrow{font:800 10px Manrope,sans-serif;letter-spacing:2px;color:#3e72ca;text-transform:uppercase}
.jo-hero{background:radial-gradient(circle at 74% 42%,#183764 0,#0b1d3b 37%,#071126 76%);color:#fff;position:relative;overflow:hidden}
.jo-hero:after{content:"";position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,#2563eb,#14b8a6)}
.jo-hero-grid{min-height:665px;padding-block:66px 78px;display:grid;grid-template-columns:1.05fr .95fr;gap:7%;align-items:center}
.jo-back{display:inline-flex;color:#aabbd6;font-size:12px;font-weight:700;gap:8px;margin-bottom:42px}
.jo-back:hover{color:#fff}
.jo-hero .jo-eyebrow{color:#92b6fa;margin-bottom:18px}
.jo-name{display:flex;align-items:center;gap:13px;margin-bottom:22px;font:800 19px Manrope,sans-serif;letter-spacing:-.5px}
.jo-name img{width:54px;height:54px;object-fit:contain}
.jo-hero h1{font-size:clamp(44px,4.3vw,65px);letter-spacing:-3.7px;line-height:1.12;margin:0 0 26px;max-width:620px}
.jo-hero h1 em{font-style:normal;background:linear-gradient(95deg,#3a9bff,#2ed4c6);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.jo-lead{font-size:17px;line-height:1.78;color:#bbc9dd;max-width:580px;margin:0}
.jo-actions{display:flex;align-items:center;gap:27px;flex-wrap:wrap;margin-top:34px}
.jo-button{display:inline-flex;align-items:center;justify-content:center;gap:30px;min-height:55px;padding:0 20px;font-size:13px;font-weight:800;white-space:nowrap;transition:transform .2s,filter .2s}
.jo-button:hover{transform:translateY(-3px);filter:brightness(1.07)}
.jo-button-primary{color:#fff;background:linear-gradient(105deg,#2563eb,#139bbd)}
.jo-text-link{display:inline-flex;align-items:center;gap:12px;color:#ecf5ff;font-size:13px;font-weight:800}
.jo-text-link:hover{text-decoration:underline;text-underline-offset:5px}
.jo-text-link span{font-size:19px}
.jo-map{height:500px;position:relative;overflow:hidden;border:1px solid #5a7bb15c;border-radius:24px;background:radial-gradient(circle at 50% 48%,#1d538679,#0c244d 43%,#0a1a35 80%);box-shadow:0 30px 70px #0005}
.jo-map:before,.jo-map:after{content:"";position:absolute;border:1px solid #83b6ff23;border-radius:50%;width:620px;height:620px;left:50%;top:50%;transform:translate(-50%,-50%)}
.jo-map:after{width:410px;height:410px;border-color:#83b6ff36}
.jo-map-line{position:absolute;height:1px;background:linear-gradient(90deg,#6797db2b,#86daec90);transform-origin:left center;z-index:1}
.jo-map-line-one{width:160px;left:36%;top:43%;transform:rotate(207deg)}
.jo-map-line-two{width:160px;left:62%;top:43%;transform:rotate(-27deg)}
.jo-map-line-three{width:115px;left:50%;top:55%;transform:rotate(90deg)}
.jo-map-center,.jo-map-item{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center}
.jo-map-center{width:205px;left:50%;top:48%;transform:translate(-50%,-50%);padding:22px 15px;background:#f8fbff;border:1px solid #bdd9ff;border-radius:18px;box-shadow:0 20px 55px #0007;color:#142a4c}
.jo-map-center img{width:64px;height:64px;margin-bottom:6px}
.jo-map-center strong{font:800 21px Manrope,sans-serif;letter-spacing:-1px}
.jo-map-center span{font-size:11px;color:#56739b;margin-top:3px}
.jo-map-item{width:150px;padding:14px 12px;background:#18355b;border:1px solid #5e92c287;border-radius:12px;box-shadow:0 14px 30px #0003}
.jo-map-item strong{font-size:12px;margin:5px 0 3px}
.jo-map-item small{font-size:10px;color:#afc8e2;line-height:1.4}
.jo-map-number{font:800 9px Manrope,sans-serif;letter-spacing:1px;color:#53c8d9}
.jo-map-candidate{left:28px;top:61px}.jo-map-employer{right:28px;top:61px}.jo-map-city{left:50%;bottom:30px;transform:translateX(-50%)}
.jo-section{padding-block:112px 120px}
.jo-section-heading{max-width:760px;margin-bottom:47px}
.jo-section-heading h2,.jo-journey h2,.jo-cta h2{font-size:clamp(37px,3.7vw,56px);line-height:1.16;letter-spacing:-2.8px;margin:18px 0 18px;color:var(--jo-ink)}
.jo-section-heading>p:last-child{font-size:17px;line-height:1.75;color:#5b6e86;max-width:700px}
.jo-audience-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}
.jo-audience-card{min-height:277px;padding:31px 29px 35px;background:#fff;border:1px solid #dbe7f6;box-shadow:0 16px 35px #172f5010;position:relative;overflow:hidden}
.jo-card-num{font:800 10px Manrope,sans-serif;letter-spacing:1.4px;color:#3976d5}
.jo-audience-card h3{font-size:23px;letter-spacing:-1px;margin:31px 0 11px}
.jo-audience-card p{font-size:14px;line-height:1.75;color:#607086;margin:0}
.jo-card-accent{position:absolute;left:29px;bottom:0;width:74px;height:4px;background:linear-gradient(90deg,#2563eb,#14b8a6)}
.jo-features{background:#f1f6fc}
.jo-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#d5e3f3;border:1px solid #d5e3f3}
.jo-feature{background:#f8fbff;min-height:246px;padding:28px 27px}
.jo-feature span{font:800 10px Manrope,sans-serif;color:#3176d9;letter-spacing:1px}
.jo-feature h3{font-size:19px;letter-spacing:-.7px;line-height:1.3;margin:34px 0 10px}
.jo-feature p{font-size:13px;line-height:1.72;color:#607086;margin:0}
.jo-journey-grid{display:grid;grid-template-columns:1fr .85fr;gap:12%;align-items:center}
.jo-journey h2{max-width:575px}
.jo-journey-grid>div>p:not(.jo-eyebrow){max-width:575px;color:#5d7087;font-size:16px;line-height:1.8}
.jo-link-dark{color:#245fbd;margin-top:15px}
.jo-steps{list-style:none;padding:0;margin:0;border-top:1px solid #d9e3f0}
.jo-steps li{display:grid;grid-template-columns:54px 1fr;gap:15px;padding:24px 0;border-bottom:1px solid #d9e3f0}
.jo-steps li>span{display:grid;place-items:center;width:39px;height:39px;border-radius:50%;background:#e6f2ff;color:#2265c3;font:800 10px Manrope,sans-serif}
.jo-steps h3{font-size:17px;letter-spacing:-.5px;margin:0 0 5px}
.jo-steps p{font-size:13px;color:#64768d;line-height:1.5;margin:0}
.jo-cta{background:linear-gradient(110deg,#164fcd,#137aaf 52%,#0fa69e);color:#fff;padding-block:83px}
.jo-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:50px}
.jo-cta .jo-eyebrow{color:#c0eaff}.jo-cta h2{color:#fff;max-width:610px;margin:14px 0}
.jo-cta p:last-child{color:#e1f4ff;font-size:15px;line-height:1.6;margin:0}
.jo-cta-actions{display:flex;flex-direction:column;gap:20px;align-items:flex-start;flex:none}
.jo-button-light{background:#fff;color:#0e4078}
.site-footer{background:#020000}
.footer-logo{display:block;width:148px;flex:none;margin-right:auto}.footer-logo img{display:block;width:100%;height:auto}
@media(max-width:960px){.jo-hero-grid{grid-template-columns:1fr .9fr;gap:4%}.jo-hero h1{font-size:47px}.jo-map{height:450px}.jo-map-item{width:132px}.jo-map-candidate{left:15px}.jo-map-employer{right:15px}.jo-audience-card{padding:27px 22px}.jo-feature{padding:26px 21px}}
@media(max-width:760px){.jo-wrap{width:min(100% - 40px,620px)}.jo-hero-grid{display:block;padding-block:51px 75px}.jo-back{margin-bottom:32px}.jo-hero h1{font-size:clamp(42px,8vw,58px)}.jo-map{margin-top:48px}.jo-section{padding-block:78px 88px}.jo-audience-grid{grid-template-columns:1fr}.jo-audience-card{min-height:0}.jo-audience-card h3{margin-top:20px}.jo-feature-grid{grid-template-columns:repeat(2,1fr)}.jo-journey-grid{grid-template-columns:1fr;gap:35px}.jo-cta-inner{display:block}.jo-cta-actions{margin-top:28px}.site-footer .footer-logo{grid-column:1/-1;width:136px;margin:0}}
@media(max-width:500px){.jo-hero h1{font-size:41px;letter-spacing:-2.6px}.jo-lead{font-size:15px}.jo-actions{align-items:flex-start;flex-direction:column;gap:22px}.jo-map{height:410px}.jo-map-center{width:165px;padding:14px 8px}.jo-map-center img{width:52px;height:52px}.jo-map-center strong{font-size:17px}.jo-map-item{width:118px;padding:11px 7px}.jo-map-candidate{left:8px;top:45px}.jo-map-employer{right:8px;top:45px}.jo-map-city{bottom:20px}.jo-map-line{display:none}.jo-section-heading h2,.jo-journey h2,.jo-cta h2{font-size:37px;letter-spacing:-2px}.jo-feature-grid{grid-template-columns:1fr}.jo-feature{min-height:0;padding:25px}.jo-feature h3{margin-top:20px}}

/* Light travels along the three existing connections in the JobOffice map. */
.jo-map-line{height:2px;overflow:hidden;background:#83b6ff31}
.jo-map-line::after{content:"";position:absolute;inset:0 auto 0 0;width:38%;background:linear-gradient(90deg,transparent,#6ddcf3,#b6faff);box-shadow:0 0 10px #56d9f0;animation:jo-connection-travel 4.8s ease-in-out infinite}
.jo-map-line-two::after{animation-delay:1.6s}
.jo-map-line-three::after{animation-delay:3.2s}
.jo-map-item{animation:jo-node-highlight 4.8s ease-in-out infinite}
.jo-map-employer{animation-delay:1.6s}
.jo-map-city{animation-delay:3.2s}
@keyframes jo-connection-travel{0%,8%{transform:translateX(-120%);opacity:0}16%{opacity:1}45%{transform:translateX(275%);opacity:1}55%,100%{transform:translateX(275%);opacity:0}}
@keyframes jo-node-highlight{0%,29%,75%,100%{border-color:#5e92c287;box-shadow:0 14px 30px #0003}43%{border-color:#6de4f4;box-shadow:0 14px 30px #0003,0 0 22px #32a8e255}}
@media(prefers-reduced-motion:reduce){.jo-map-line::after,.jo-map-item{animation:none}}