/* Employer sections on the home page: tabs, live listings, email replica, job page, pricing, map. Muted theme matching the search box and featured job cards. 2026-10-14 */
body.faa{overflow-x:hidden}
.emp{background:#fff;width:100vw;position:relative;left:50%;margin-left:-50vw;padding:50px 24px 60px;box-sizing:border-box;font-family:'Metrophobic',Arial,Helvetica,sans-serif;font-weight:300;text-align:left;color:#333;line-height:1.5}
.emp.alt{background:#f7f7f7;border-top:1px solid #e5e5e5}
.emp *{box-sizing:border-box}
.emp-in{max-width:1160px;margin:0 auto}
.emp h2{margin:0;padding:0 0 12px;text-align:center;font:300 28px/1.3 'Metrophobic',Arial,Helvetica,sans-serif;color:#222;text-transform:lowercase;border-bottom:1px solid #e5e5e5}
.emp h2 .hl{color:#6286a1;font-weight:bold}
.emp .sub{text-align:center;color:#777;font-size:15px;line-height:1.6;margin:14px auto 0;max-width:640px}
.emp a{color:#6286a1;text-decoration:none}
.emp a:hover{color:#000;text-decoration:underline}
.emp-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 30px;border-bottom:1px solid #ccc;margin:30px 0 36px;overflow:visible}
.emp-tab{background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;padding:0 2px 10px;font:bold 13px/1 Arial,Helvetica,sans-serif;color:#6286a1;cursor:pointer;border-radius:0}
.emp-tab:hover{color:#000}
.emp-tab[aria-selected="true"]{border-bottom-color:#6286a1;color:#000}
.emp-panel[hidden]{display:none}
.emp-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.emp-grid.wide{grid-template-columns:1fr 1.4fr}
.emp-card{background:#fff;border:1px solid #ccc;border-radius:5px;padding:18px 20px}
.emp-card h3{margin:0 0 6px;font:bold 15px/1.4 Arial,Helvetica,sans-serif;color:#6286a1}
.emp-card>h3:first-child{margin:-18px -20px 14px;padding:8px 12px;background:#f3f3f3;border-bottom:1px solid #ccc;border-radius:5px 5px 0 0}
.emp-card .meta{color:#999;font-size:13px;margin:0 0 14px}
.emp-steps{list-style:none;margin:0;padding:0;counter-reset:s}
.emp-steps li{position:relative;padding:0 0 18px 54px;counter-increment:s;color:#4d4d4d;font-size:14px;min-height:42px}
.emp-steps li:before{content:counter(s);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;background:#6286a1;border:2px solid #fff;box-shadow:0 0 0 1px #6286a1;color:#fff;font:bold 18px/34px Arial,sans-serif;text-align:center}
.emp-steps li b{display:block;color:#222;font:bold 16px/1.3 Arial,Helvetica,sans-serif;margin:0 0 1px}
.emp-form label{display:block;font:bold 12px/1 Arial,sans-serif;color:#4d4d4d;margin:12px 0 5px}
.emp-form input,.emp-form select,.emp-form textarea{width:100%;border:1px solid #ccc;border-radius:3px;padding:8px 10px;font:14px/1.4 Arial,sans-serif;color:#333;background:#f1f1f1}
.emp-form input:focus,.emp-form select:focus,.emp-form textarea:focus{background:#fff;border-color:#a1b3c0;outline:none}
.emp-form textarea{min-height:96px;resize:vertical}
.emp-form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.emp-form .btn{margin-top:18px;width:100%;background:#1f6feb;color:#fff;border:0;border-radius:4px;padding:12px;font:bold 14px/1 Arial,sans-serif;cursor:pointer}
.emp-form .btn:hover{background:#1a5fd0}
.emp-form .note{color:#999;font-size:12px;margin:10px 0 0;text-align:center}
.emp-joblist{list-style:none;margin:0;padding:0}
.emp-joblist li{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px dotted #ccc}
.emp-joblist li:last-child{border-bottom:0}
.emp-joblist .lg{width:42px;height:42px;flex:none;border-radius:3px;border:1px solid #ccc;background:#fff;object-fit:contain;padding:3px}
.emp-joblist .ini{width:42px;height:42px;flex:none;border-radius:3px;background:#f3f3f3;border:1px solid #ccc;color:#6286a1;font:bold 14px/40px Arial,sans-serif;text-align:center}
.emp-joblist .t{flex:1;min-width:0}
.emp-joblist .t a{font:bold 13px/18px Arial,Helvetica,sans-serif;color:#6286a1;text-decoration:none;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.emp-joblist .t a:hover{color:#000;text-decoration:underline}
.emp-joblist .t span{display:block;color:#4d4d4d;font:normal 12px/18px Arial,Helvetica,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.emp-joblist .d{color:#999;font:bold 11px/1 Arial,sans-serif;white-space:nowrap}
.emp-joblist .tag{font:bold 9px/1 Arial,sans-serif;color:#2e70a2;background:#e6edf2;border:1px solid #cfdbe4;padding:4px 6px;border-radius:2px;letter-spacing:.5px;flex:none}
.emp-more{display:inline-block;margin-top:12px;font:bold 13px/18px Arial,Helvetica,sans-serif}
.emp-mail{background:#fff;border:1px solid #ccc;border-radius:5px;overflow:hidden;font-family:arial,sans-serif;max-width:600px;margin:0 auto}
.emp-mail .hd{background:#f3f3f3;padding:10px 16px;font-size:12px;color:#4d4d4d;border-bottom:1px solid #ccc;line-height:1.7}
.emp-mail .hd b{color:#222}
.emp-mail .bd{padding:14px 15px 6px}
.emp-mail .bd img.logo{height:36px;display:block;margin:4px 0 12px}
.emp-mail .intro{color:#333;font-size:14px;line-height:24px;margin:0 0 10px}
.emp-mail .intro span{color:#888}
.emp-mail .job{padding:15px;border-top:1px solid #eee}
.emp-mail .job.first{background:#fafafa;border-top:0}
.emp-mail .job a.tt{color:#1a67b2;text-decoration:underline;font-weight:700;font-size:14px}
.emp-mail .job .co{color:#333;font-size:13px;line-height:2em}
.emp-mail .job a.ap{color:#6dbe45;text-decoration:none;font-size:13px;font-weight:700}
.emp-mail .ft{padding:14px 15px;background:#ebf6f6;color:#666;font-size:12px;line-height:1.6}
.emp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 18px}
.emp-stat{background:#f3f3f3;border:1px solid #ccc;border-radius:5px;padding:12px;text-align:center}
.emp-stat b{display:block;font:300 24px/1.1 'Metrophobic',Arial,Helvetica,sans-serif;color:#6286a1}
.emp-stat span{display:block;color:#999;font:bold 11px/1.3 Arial,sans-serif;text-transform:uppercase;margin-top:5px}
.emp-jobpage .top{display:flex;gap:16px;align-items:flex-start}
.emp-jobpage .top img{width:64px;height:64px;object-fit:contain;border:1px solid #ccc;border-radius:3px;padding:4px;background:#fff;flex:none}
.emp-jobpage h3{font-size:18px}
.emp-jobpage .desc{color:#333;font-size:14px;line-height:1.7;margin:14px 0}
.emp-jobpage .apply{display:inline-block;background:#1f6feb;color:#fff;text-decoration:none;font:bold 14px/1 Arial,sans-serif;padding:12px 22px;border-radius:4px}
.emp-jobpage .apply:hover{background:#1a5fd0;color:#fff;text-decoration:none}
.emp-minimap{height:220px;border-radius:5px;border:1px solid #ccc;margin-top:16px;background:#f3f3f3}
.emp-pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.emp-plan{background:#fff;border:1px solid #ccc;border-radius:5px;padding:0 0 22px;text-align:center;position:relative}
.emp-plan.hot{border-color:#6286a1;box-shadow:0 0 0 1px #6286a1}
.emp-plan .badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:#6286a1;color:#fff;font:bold 10px/1 Arial,sans-serif;letter-spacing:.5px;text-transform:uppercase;padding:6px 10px;border-radius:10px}
.emp-plan h3{margin:0;padding:10px;background:#f3f3f3;border-bottom:1px solid #ccc;border-radius:5px 5px 0 0;font:bold 13px/1.4 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.5px;color:#6286a1}
.emp-plan.hot h3{background:#e6edf2;border-bottom-color:#6286a1;color:#2e70a2}
.emp-plan .price{font:300 40px/1.1 'Metrophobic',Arial,Helvetica,sans-serif;color:#222;margin:18px 0 2px}
.emp-plan .per{color:#999;font-size:12px;margin-bottom:14px}
.emp-plan ul{list-style:none;margin:0 20px 20px;padding:0;text-align:left}
.emp-plan li{padding:7px 0 7px 22px;border-top:1px dotted #ccc;color:#4d4d4d;font-size:14px;position:relative}
.emp-plan li:before{content:"";position:absolute;left:4px;top:13px;width:6px;height:10px;border:solid #6286a1;border-width:0 2px 2px 0;transform:rotate(45deg)}
.emp-plan .btn{display:block;margin:0 20px;background:#1f6feb;color:#fff;text-decoration:none;font:bold 14px/1 Arial,sans-serif;padding:12px;border-radius:4px}
.emp-plan .btn:hover{background:#1a5fd0;color:#fff;text-decoration:none}
.emp-plan .btn.g{color:#000;background:#e8eef0;background-image:linear-gradient(to bottom,#f1f4f5 0%,#c4d4d9 100%);border:1px solid #a1b3c0;box-shadow:0 1px 2px 0 rgba(0,0,0,.2);padding:11px}
.emp-plan .btn.g:hover{background:#c4d4d9;background-image:none;color:#000}
.emp-cta{text-align:center;margin-top:30px;color:#999;font-size:13px}
.emp-feature{display:grid;grid-template-columns:1fr 1.5fr;gap:48px;align-items:center}
.emp-feature h3{color:#6286a1;font:bold 13px/1 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.5px;margin:0 0 14px}
.emp-feature p{color:#4d4d4d;font-size:16px;line-height:1.7;margin:0 0 16px}
.emp-cities{list-style:none;margin:0;padding:0}
.emp-cities li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dotted #ccc;font-size:14px}
.emp-cities li a{font:bold 13px/18px Arial,Helvetica,sans-serif;text-decoration:none}
.emp-cities li span{color:#999;font:bold 11px/18px Arial,sans-serif}
.emp-frame{background:#dae3e9;border:1px solid #ccc;box-shadow:0 0 0 2px #fff inset,0 0 0 5px #f4f4f4 inset,0 0 5px rgba(0,0,0,.2);border-radius:5px;padding:24px;position:relative}
.emp-map{height:440px;border-radius:4px;border:1px solid #ccc;background:#eef1f4;position:relative;z-index:0}
.emp-map .leaflet-popup-content{font:13px/1.5 Arial,sans-serif;margin:12px 14px}
.emp-map .leaflet-popup-content b{display:block;margin-bottom:4px;color:#222}
.emp-map .leaflet-popup-content a{display:block;color:#6286a1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}
.emp-map .leaflet-popup-content a.all{margin-top:6px;font-weight:700}
.emp-note{position:absolute;z-index:2;background:#fff;border:1px solid #ccc;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.1);padding:10px 14px;font:bold 12px/1.3 Arial,Helvetica,sans-serif;color:#4d4d4d;display:flex;gap:10px;align-items:center;max-width:230px}
.emp-note i{width:14px;height:14px;border-radius:50%;background:#6286a1;border:2px solid #fff;box-shadow:0 0 0 1px #6286a1;display:block;flex:none}
.emp-note.l{left:-40px;top:24px}
.emp-note.r{right:-40px;bottom:54px}
.emp-empty{color:#999;font-size:14px;text-align:center;padding:30px 0}
@media (max-width:860px){
  .emp{padding:40px 18px 46px}
  .emp h2{font-size:24px}
  .emp-tabs{gap:4px 22px;margin:24px 0 28px}
  .emp-tab{padding:8px 2px 10px}
  .emp-grid,.emp-grid.wide,.emp-feature,.emp-pricing{grid-template-columns:1fr}
  .emp-stats{grid-template-columns:1fr 1fr 1fr;gap:8px}
  .emp-stat b{font-size:20px}
  .emp-note.l{left:8px;top:8px}
  .emp-note.r{right:8px;bottom:8px}
  .emp-frame{padding:14px}
  .emp-map{height:360px}
  .emp-form .two{grid-template-columns:1fr}
}
