/* Portrait and compact live job card within the approved blue app hero. */
.hero .hero-copy{position:relative;z-index:1}
.hero .hero-stage{position:relative;isolation:isolate;width:100%;height:520px;min-height:0;padding:0;margin:0}
.hero .hero-stage:before{inset:55px -45px 5px;background:radial-gradient(ellipse at 70% 44%,#1465ed24,transparent 68%);z-index:0}

/* Fade the actual image bounds to alpha instead of painting over their edges. */
.hero-portrait{position:absolute;inset:-35px -30px 0 -20px;display:block;z-index:0;pointer-events:none;overflow:visible}
.hero-portrait img{position:absolute;right:0;top:0;display:block;width:auto;height:100%;max-width:none;aspect-ratio:4/5;object-fit:cover;--portrait-mask-x:linear-gradient(90deg,transparent,#000 14%,#000 80%,transparent);--portrait-mask-y:linear-gradient(180deg,transparent,#000 6%,#000 52%,transparent 88%,transparent);-webkit-mask-image:var(--portrait-mask-x),var(--portrait-mask-y);mask-image:var(--portrait-mask-x),var(--portrait-mask-y);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:source-in;mask-composite:intersect}
.hero-portrait:after{content:none}

/* Fixed two-row search: full-width keyword, then location and action. */
.hero .search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:0;background:none;border:0;box-shadow:none;align-items:center}
.hero .search label{box-sizing:border-box;min-width:0;min-height:60px;padding:8px 11px;border:1px solid #dce4f0;border-radius:7px;background:#f7f9fc;color:#526077;font-size:9px;line-height:1.45;transition:border-color .18s,box-shadow .18s}
.hero .search label:first-child{grid-column:1/-1;grid-row:1}
.hero .search label:nth-child(2){grid-column:1;grid-row:2;border:1px solid #dce4f0}
.hero .search label:focus-within{border-color:#6c9bef;box-shadow:0 0 0 3px #3a82ff28}
.hero .search input{width:100%;min-width:0;margin:4px 0 0;padding:0;background:transparent;border:0;color:#172338;font-size:14px;line-height:24px;font-weight:500}
.hero .search input::placeholder{color:#67758b;opacity:1}
.hero .search input:focus-visible{outline:0}
.hero .search .button{grid-column:2;grid-row:2;justify-self:stretch;align-self:stretch;min-width:124px;min-height:60px;height:auto;margin:0;padding:10px 17px;font-size:13px;line-height:1.3;border-radius:7px}

/* Company, title and action stay visible; secondary facts share the action row. */
.hero-stage .hero-floating-card{position:absolute;z-index:2;left:-12px;bottom:10px;width:390px;max-width:calc(100% - 38px);border-color:#3b5987;background:linear-gradient(145deg,#16233a,#0e1423 78%);box-shadow:0 22px 60px #0007}
.hero-stage .app-window-bar{padding:6px 13px;font-size:8px;letter-spacing:.08em}
.hero-stage .window-brand img{width:17px;height:17px}
.hero-stage .hero-job{padding:14px 16px 15px;min-height:0}
.hero-stage .hero-job-heading{justify-content:flex-start;margin-bottom:10px;gap:12px}
.hero-company-meta{min-width:0;flex:1}
.hero-stage .hero-employer{font-size:11px;line-height:1.45;margin:0;overflow-wrap:anywhere}
.hero-stage .hero-demo{display:inline-block;margin-top:5px;font-size:8px;padding:3px 5px;white-space:normal}
.hero-stage .hero-job h2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.5em;font-size:19px;line-height:1.25;margin:0;letter-spacing:-.03em}
.hero-stage .hero-job-bottom{margin-top:12px;gap:10px}
.hero-stage .hero-job-bottom .button{font-size:12px;padding:9px 14px;min-height:40px}
.hero-job-aside{display:grid;gap:4px;max-width:58%;text-align:right}
.hero-job-facts{font-size:10px;line-height:1.4;color:#a8bbd7;overflow-wrap:anywhere}
.hero-stage .hero-job-index{font-size:8px;line-height:1.2}
.hero-stage .employer-switcher{padding:5px;gap:3px}
.hero-stage .employer-switcher button{font-size:10px;line-height:1.3;padding:6px 4px;min-height:42px}

@media(max-width:1050px){
 .hero .hero-stage{height:520px}
 .hero-portrait{inset:-32px -26px 0 -20px}
 .hero-stage .hero-floating-card{left:-10px;max-width:calc(100% - 12px)}
}
@media(max-width:850px){
 .hero .hero-stage{height:515px}
 .hero-portrait{top:-25px;right:-20px;left:-30px}
 .hero-stage .hero-floating-card{left:-8px;max-width:100%}
 .hero-stage .hero-job{padding:13px}
 .hero-stage .hero-job-heading{gap:9px}
 .hero-stage .hero-employer{font-size:10px}
 .hero-stage .hero-job h2{font-size:18px}
 .hero-stage .employer-switcher button{font-size:9px}
}
@media(max-width:650px){
 .hero .hero-stage{display:block;width:100%;max-width:430px;height:350px;margin:12px auto 0;padding:0}
 .hero-portrait{inset:-22px -15px auto 18px;height:300px}
 .hero .availability{margin-bottom:18px}
 .hero h1{margin-bottom:14px}
 .hero .intro{margin-bottom:16px}
 .hero .search label{min-height:60px;padding:8px 11px}
 .hero .search input{font-size:16px;line-height:24px}
 .hero .search .button{min-width:124px;min-height:60px;font-size:13px;padding:10px 14px}
 .hero-stage .hero-floating-card{left:0;bottom:4px;width:calc(100% - 12px);max-width:none}
 .hero-stage .app-window-bar{display:none}
 .hero-stage .hero-job{padding:12px}
 .hero-stage .hero-job-heading{gap:10px;margin-bottom:8px}
 .hero-stage .hero-job h2{font-size:17px;line-height:1.3;min-height:2.6em}
 .hero-stage .hero-job-bottom{margin-top:10px;gap:8px}
 .hero-stage .hero-job-bottom .button{min-height:40px;font-size:11px;padding:9px 12px}
 .hero-stage .hero-employer{font-size:10px}
 .hero-job-facts{font-size:9px}
 .hero-stage .employer-switcher button{font-size:9px;min-height:42px}
}
@media(max-width:360px){
 .hero .hero-stage{height:345px}
 .hero-portrait{left:0;right:-15px;height:300px}
 .hero .search .button{min-width:110px;padding:10px;font-size:12px}
 .hero-stage .hero-floating-card{width:calc(100% - 6px)}
 .hero-stage .hero-job-heading{gap:8px}
 .hero-stage .hero-job h2{font-size:16px}
 .hero-stage .hero-job-bottom .button{font-size:10px;padding:9px 10px}
 .hero-stage .employer-switcher button{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.hero .search label{transition:none}}
