/*
Theme Name: Metley Careers
Theme URI: https://metley.in/
Author: Metley Human Capital Solutions
Description: A premium recruitment and careers theme designed around Metley Careers Platform. Includes polished job-board styling, employer/candidate journeys, responsive navigation and conversion-focused career pages.
Version: 6.0.0
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: metley-careers
*/

:root {
  --m-blue: #0a4fb5;
  --m-blue-2: #073b89;
  --m-sky: #45aef5;
  --m-ink: #10243e;
  --m-text: #34465e;
  --m-muted: #6c788a;
  --m-soft: #f4f7fb;
  --m-line: #e2e8f0;
  --m-white: #ffffff;
  --m-success: #0e8d6a;
  --m-radius: 18px;
  --m-shadow: 0 18px 50px rgba(16,36,62,.10);
  --m-container: 1200px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--m-text); background:#fff; font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:var(--m-blue); text-decoration:none; }
a:hover { color:var(--m-blue-2); }
img { max-width:100%; height:auto; }
button,input,select,textarea { font:inherit; }
.m-container { width:min(calc(100% - 40px), var(--m-container)); margin-inline:auto; }
.m-narrow { width:min(calc(100% - 40px), 820px); margin-inline:auto; }
.screen-reader-text { position:absolute!important; width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }

/* Header */
.m-site-header { position:sticky; top:0; z-index:1000; background:rgba(255,255,255,.95); backdrop-filter:blur(14px); border-bottom:1px solid rgba(226,232,240,.92); }
.m-header-row { min-height:78px; display:flex; align-items:center; gap:28px; }
.m-brand { display:flex; align-items:center; flex:0 0 auto; }
.m-brand img { width:148px; height:auto; display:block; }
.m-nav { margin-left:auto; min-width:0; }
.m-nav ul { list-style:none; display:flex; flex-wrap:nowrap; align-items:center; gap:4px; margin:0; padding:0; white-space:nowrap; }
.m-nav a { display:block; padding:10px 12px; color:#263a53; border-radius:8px; font-size:14px; font-weight:650; }
.m-nav a:hover,.m-nav .current-menu-item>a { color:var(--m-blue); background:#f2f7fd; }
.m-header-actions { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.m-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding:11px 18px; border:1px solid transparent; border-radius:10px; font-weight:750; line-height:1.1; cursor:pointer; transition:.2s ease; }
.m-btn:hover { transform:translateY(-1px); }
.m-btn-primary { color:#fff; background:var(--m-blue); box-shadow:0 9px 22px rgba(10,79,181,.18); }
.m-btn-primary:hover { color:#fff; background:var(--m-blue-2); box-shadow:0 12px 28px rgba(10,79,181,.24); }
.m-btn-secondary { color:var(--m-blue); background:#fff; border-color:#cfd9e5; }
.m-btn-secondary:hover { color:var(--m-blue-2); border-color:#b5c4d6; background:#f8fbff; }
.m-menu-toggle { display:none; width:44px;height:44px;padding:0;border:1px solid var(--m-line);background:#fff;border-radius:10px; }
.m-menu-toggle span,.m-menu-toggle:before,.m-menu-toggle:after { content:""; display:block; width:20px; height:2px; background:var(--m-ink); margin:4px auto; transition:.2s; }

/* Hero */
.m-hero { position:relative; overflow:hidden; padding:84px 0 72px; background:radial-gradient(circle at 85% 20%, rgba(69,174,245,.20), transparent 32%), linear-gradient(135deg,#f8fbff 0%,#eef6ff 55%,#f7fbff 100%); border-bottom:1px solid #e6edf6; }
.m-hero:after { content:""; position:absolute; width:430px;height:430px;border:80px solid rgba(10,79,181,.035);border-radius:50%;right:-170px;bottom:-260px; }
.m-hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr); align-items:center; gap:64px; }
.m-eyebrow { display:inline-flex; align-items:center; gap:8px; margin-bottom:16px; color:var(--m-blue); font-size:12px; font-weight:850; text-transform:uppercase; letter-spacing:.11em; }
.m-eyebrow:before { content:""; width:26px;height:2px;background:var(--m-sky); }
.m-hero h1 { margin:0 0 20px; color:var(--m-ink); font-size:clamp(42px,5.3vw,70px); line-height:1.03; letter-spacing:-.052em; max-width:820px; }
.m-hero-copy { max-width:690px; margin:0 0 30px; color:#52647a; font-size:19px; line-height:1.65; }
.m-search-card { padding:18px; background:#fff; border:1px solid #dce7f3; border-radius:16px; box-shadow:var(--m-shadow); }
.m-search-form { display:grid; grid-template-columns:1fr .78fr auto; gap:10px; }
.m-search-field { position:relative; }
.m-search-field label { display:block; margin:0 0 6px; color:#617085; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.m-search-field input { width:100%; height:50px; padding:0 14px; border:1px solid #d7e0ea; border-radius:9px; outline:none; color:var(--m-ink); }
.m-search-field input:focus { border-color:var(--m-sky); box-shadow:0 0 0 4px rgba(69,174,245,.12); }
.m-search-form .m-btn { align-self:end; height:50px; }
.m-proof { display:flex; flex-wrap:wrap; gap:18px 28px; margin-top:24px; color:#66768a; font-size:13px; font-weight:650; }
.m-proof span { display:flex; align-items:center; gap:7px; }
.m-proof span:before { content:"✓"; display:grid; place-items:center; width:18px;height:18px;border-radius:50%;background:#e6f7f1;color:var(--m-success);font-size:11px;font-weight:900; }
.m-hero-panel { padding:28px; background:linear-gradient(160deg,#0d2748 0%,#0a4fb5 100%); color:#fff; border-radius:26px; box-shadow:0 24px 60px rgba(7,59,137,.20); }
.m-hero-panel-top { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:30px; }
.m-hero-panel .m-kicker { color:#a7d6ff; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.m-hero-panel h2 { margin:7px 0 0; color:#fff; font-size:26px; line-height:1.2; letter-spacing:-.03em; }
.m-mini-logo { width:92px; padding:10px; background:#fff; border-radius:12px; }
.m-role-card { margin-top:12px; padding:17px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.13); border-radius:15px; }
.m-role-card strong { display:block; color:#fff; font-size:16px; }
.m-role-meta { display:flex; gap:12px; margin-top:7px; color:#c9ddf5; font-size:12px; }
.m-panel-footer { margin-top:22px; padding-top:20px; border-top:1px solid rgba(255,255,255,.13); color:#d8e8fb; font-size:13px; }

/* Sections */
.m-section { padding:78px 0; }
.m-section-soft { background:var(--m-soft); }
.m-section-head { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:34px; }
.m-section-head h2,.m-content h1 { margin:0; color:var(--m-ink); font-size:clamp(31px,3.5vw,46px); line-height:1.12; letter-spacing:-.04em; }
.m-section-head p { max-width:550px; margin:0; color:var(--m-muted); }
.m-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.m-card { background:#fff; border:1px solid var(--m-line); border-radius:var(--m-radius); padding:28px; box-shadow:0 7px 28px rgba(16,36,62,.045); }
.m-card-icon { display:grid; place-items:center; width:46px;height:46px;margin-bottom:22px;border-radius:12px;background:#ebf5ff;color:var(--m-blue);font-weight:900; }
.m-card h3 { margin:0 0 10px;color:var(--m-ink);font-size:20px;letter-spacing:-.02em; }
.m-card p { margin:0;color:#68778a;font-size:14px; }
.m-card-link { display:inline-flex; margin-top:18px; font-size:13px; font-weight:800; }
.m-job-shell { padding:26px; background:#fff; border:1px solid var(--m-line); border-radius:22px; box-shadow:0 9px 34px rgba(16,36,62,.055); }
.m-cta { position:relative; overflow:hidden; padding:52px; background:linear-gradient(135deg,#10243e,#0a4fb5); border-radius:26px; color:#fff; }
.m-cta:after { content:"";position:absolute;right:-80px;top:-100px;width:300px;height:300px;border:55px solid rgba(255,255,255,.05);border-radius:50%; }
.m-cta-grid { position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:40px; }
.m-cta h2 { margin:0 0 10px;color:#fff;font-size:36px;letter-spacing:-.04em; }
.m-cta p { margin:0;color:#d5e3f4;max-width:660px; }
.m-cta .m-btn { background:#fff;color:var(--m-blue);box-shadow:none; }
.m-cta .m-btn:hover { color:var(--m-blue-2); }

/* Content pages */
.m-page-hero { padding:58px 0 42px; background:linear-gradient(180deg,#f7faff,#fff); border-bottom:1px solid #edf1f6; }
.m-page-hero h1 { margin:0;color:var(--m-ink);font-size:46px;letter-spacing:-.045em;line-height:1.1; }
.m-page-hero p { margin:12px 0 0;color:var(--m-muted);font-size:17px;max-width:700px; }
.m-content { padding:54px 0 80px; }
.m-content article { font-size:16px; }
.m-content h2,.m-content h3 { color:var(--m-ink);letter-spacing:-.025em; }
.m-content input:not([type=submit]),.m-content textarea,.m-content select { max-width:100%; }
.entry-content > *:first-child { margin-top:0; }
.entry-content > *:last-child { margin-bottom:0; }

/* Footer */
.m-footer { background:#0c1e35;color:#aebbd0;padding:56px 0 24px; }
.m-footer-grid { display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:44px;margin-bottom:44px; }
.m-footer-logo { width:132px;filter:brightness(0) invert(1);opacity:.95; }
.m-footer p { max-width:350px;font-size:13px;color:#9fb0c8; }
.m-footer h4 { margin:0 0 15px;color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.07em; }
.m-footer ul { list-style:none;margin:0;padding:0; }
.m-footer li { margin:8px 0; }
.m-footer a { color:#b9c6d8;font-size:13px; }
.m-footer a:hover { color:#fff; }
.m-footer-bottom { display:flex;justify-content:space-between;gap:20px;padding-top:22px;border-top:1px solid rgba(255,255,255,.09);font-size:12px;color:#8191a8; }

/* WPJobBoard integration wrapper */
.m-jobboard-page .wpjb { max-width:none; }
.m-jobboard-page .wpjb-page-index { margin-top:0; }

@media (max-width: 1050px) {
  .m-nav a { padding-inline:8px;font-size:13px; }
  .m-header-actions .m-btn-secondary { display:none; }
  .m-hero-grid { grid-template-columns:1fr .75fr;gap:40px; }
}
@media (max-width: 860px) {
  .m-menu-toggle { display:block; margin-left:auto; }
  .m-nav { display:none; position:absolute; top:78px; left:0;right:0; margin:0; padding:14px 20px 20px;background:#fff;border-bottom:1px solid var(--m-line);box-shadow:0 18px 30px rgba(16,36,62,.08); }
  .m-nav.is-open { display:block; }
  .m-nav ul { display:block;white-space:normal; }
  .m-nav a { padding:11px 10px;font-size:14px; }
  .m-header-actions { margin-left:0; }
  .m-header-actions .m-btn { display:none; }
  .m-hero { padding:60px 0; }
  .m-hero-grid { grid-template-columns:1fr; }
  .m-hero-panel { max-width:620px; }
  .m-search-form { grid-template-columns:1fr; }
  .m-cards { grid-template-columns:1fr; }
  .m-section-head { align-items:start;flex-direction:column; }
  .m-cta-grid { align-items:flex-start;flex-direction:column; }
  .m-footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 560px) {
  .m-container,.m-narrow { width:min(calc(100% - 28px), var(--m-container)); }
  .m-header-row { min-height:68px;gap:12px; }
  .m-brand img { width:128px; }
  .m-nav { top:68px; }
  .m-hero h1 { font-size:40px; }
  .m-hero-copy { font-size:17px; }
  .m-hero-panel { padding:21px;border-radius:20px; }
  .m-section { padding:58px 0; }
  .m-job-shell { padding:15px;border-radius:17px; }
  .m-cta { padding:34px 24px; }
  .m-cta h2 { font-size:30px; }
  .m-footer-grid { grid-template-columns:1fr;gap:26px; }
  .m-footer-bottom { flex-direction:column; }
}

/* =============================================================
   Phase 2 — Metley Careers Experience 2.0
   ============================================================= */
:root { --m-panel:#ffffff; --m-green:#0b8b67; --m-danger:#c74a4a; --m-radius-lg:24px; --m-shadow-soft:0 12px 34px rgba(16,36,62,.07); }
.m-page-hero { position:relative; overflow:hidden; padding:64px 0 52px; background:radial-gradient(circle at 82% 10%,rgba(69,174,245,.20),transparent 27%),linear-gradient(135deg,#f8fbff,#eef6ff); border-bottom:1px solid #e3ebf4; }
.m-page-hero:after { content:""; position:absolute; width:300px;height:300px;border-radius:50%;border:60px solid rgba(10,79,181,.035);right:-100px;top:-180px; }
.m-page-hero .m-container { position:relative; z-index:1; }
.m-page-hero h1 { max-width:800px; margin:0 0 12px; color:var(--m-ink); font-size:clamp(36px,5vw,56px); line-height:1.05; letter-spacing:-.045em; }
.m-page-hero p { max-width:720px; margin:0; color:#5c6d82; font-size:18px; }
.m-content { padding:52px 0 76px; background:#f8fafc; }
.m-job-shell { border:1px solid var(--m-line); border-radius:22px; background:#fff; padding:26px; box-shadow:var(--m-shadow-soft); }

/* Portal experience */
.m-portal-layout { display:grid; grid-template-columns:250px minmax(0,1fr); gap:24px; align-items:start; }
.m-portal-sidebar { position:sticky; top:102px; padding:18px; border:1px solid var(--m-line); border-radius:20px; background:#fff; box-shadow:0 8px 24px rgba(16,36,62,.05); }
.m-portal-sidebar-head { padding:4px 6px 15px; margin-bottom:8px; border-bottom:1px solid var(--m-line); }
.m-portal-sidebar-head strong { display:block; color:var(--m-ink); font-size:14px; }
.m-portal-sidebar-head span { display:block; margin-top:3px; color:var(--m-muted); font-size:12px; }
.m-portal-nav { display:grid; gap:6px; }
.m-portal-nav a { display:flex; align-items:center; gap:10px; padding:11px 10px; border-radius:11px; color:#40536b; font-size:13px; font-weight:720; }
.m-portal-nav a:hover { background:#f0f6fd; color:var(--m-blue); }
.m-portal-nav-icon { width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#eef6ff;color:var(--m-blue);font-size:15px;font-weight:850; }
.m-portal-main { min-width:0; }
.m-portal-intro { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:center; margin-bottom:20px; padding:21px 23px; border:1px solid #d8e6f5; border-radius:18px; background:linear-gradient(135deg,#fff,#f7fbff); }
.m-portal-intro h2 { margin:0 0 4px; color:var(--m-ink); font-size:22px; letter-spacing:-.025em; }
.m-portal-intro p { margin:0; color:#6b7b90; font-size:14px; }
.m-portal-chip { padding:8px 11px; border-radius:999px; background:#eaf6ff; color:#116bb3; font-size:11px; font-weight:850; text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }

/* Jobs discovery page */
.m-jobs-topline { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:20px; }
.m-jobs-topline h2 { margin:0; color:var(--m-ink); font-size:24px; letter-spacing:-.025em; }
.m-jobs-topline p { margin:4px 0 0; color:var(--m-muted); font-size:13px; }
.m-jobs-benefits { display:flex; flex-wrap:wrap; gap:8px; }
.m-jobs-benefits span { padding:7px 10px; border:1px solid #dbe6f1; border-radius:999px; background:#fff; color:#607087; font-size:11px; font-weight:720; }

/* Home phase 2 */
.m-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:28px; }
.m-metric { padding:16px 18px; border:1px solid rgba(255,255,255,.16); border-radius:14px; background:rgba(255,255,255,.08); }
.m-metric strong { display:block; color:#fff; font-size:22px; line-height:1; letter-spacing:-.03em; }
.m-metric span { display:block; margin-top:7px; color:rgba(255,255,255,.72); font-size:11px; }
.m-process { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; counter-reset:steps; }
.m-process article { position:relative; padding:22px; border:1px solid var(--m-line); border-radius:18px; background:#fff; }
.m-process article:before { counter-increment:steps; content:"0" counter(steps); display:inline-flex; margin-bottom:20px; color:var(--m-sky); font-size:12px; font-weight:900; letter-spacing:.08em; }
.m-process h3 { margin:0 0 8px; color:var(--m-ink); font-size:18px; }
.m-process p { margin:0; color:#66778b; font-size:14px; }

/* Plugin harmonisation inside Metley shell */
.m-job-shell .wpjb { font-family:inherit; }
.m-job-shell .wpjb-page-index #wpjb-top-search { margin-top:0!important; }
.m-job-shell .wpjb a.wpjb-job_title { text-decoration:none; }
.m-job-shell .wpjb fieldset { background:#fff; }
.m-job-shell .wpjb .wpjb-boxes { margin-bottom:0; }

@media (max-width:960px) {
  .m-portal-layout { grid-template-columns:1fr; }
  .m-portal-sidebar { position:static; }
  .m-portal-nav { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .m-process,.m-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px) {
  .m-page-hero { padding:46px 0 38px; }
  .m-content { padding:30px 0 52px; }
  .m-job-shell { padding:14px; border-radius:17px; }
  .m-portal-nav { grid-template-columns:1fr; }
  .m-portal-intro,.m-jobs-topline { grid-template-columns:1fr; display:grid; align-items:start; }
  .m-portal-chip { justify-self:start; }
  .m-process,.m-metrics { grid-template-columns:1fr; }
}


/* =============================================================
   Phase 3 — Metley Talent Intelligence
   ============================================================= */
.m-intelligence-band{position:relative;overflow:hidden;background:linear-gradient(135deg,#0d3155,#105d91);color:#fff}.m-intelligence-band:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;border:85px solid rgba(255,255,255,.035);right:-130px;top:-230px}.m-intel-layout{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;align-items:center}.m-intelligence-band .m-eyebrow{color:#82c9fb}.m-intelligence-band h2{color:#fff;font-size:clamp(32px,4vw,48px);line-height:1.08;letter-spacing:-.04em;margin:8px 0 16px}.m-intelligence-band p{color:rgba(255,255,255,.75);max-width:610px}.m-intel-points{display:grid;gap:12px;margin-top:24px}.m-intel-points div{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start}.m-intel-points b{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:rgba(255,255,255,.1);color:#84d0ff}.m-intel-points strong{display:block;color:#fff;font-size:14px}.m-intel-points span{display:block;color:rgba(255,255,255,.64);font-size:13px;margin-top:2px}.m-intel-demo{background:#fff;color:var(--m-text);border-radius:24px;padding:22px;box-shadow:0 25px 70px rgba(0,0,0,.22)}.m-intel-demo-head{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--m-line)}.m-intel-demo-head span{font-size:11px;text-transform:uppercase;letter-spacing:.11em;font-weight:850;color:var(--m-blue)}.m-intel-demo-head strong{display:block;color:var(--m-ink);font-size:18px;margin-top:3px}.m-intel-score{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:#e9f7f1;color:#14704f;font-size:23px;font-weight:900}.m-intel-signals{display:grid;gap:10px;margin-top:16px}.m-intel-signal{padding:13px 14px;border:1px solid var(--m-line);border-radius:13px}.m-intel-signal div{display:flex;justify-content:space-between;gap:10px;font-size:12px}.m-intel-signal strong{color:var(--m-ink)}.m-intel-signal span{color:var(--m-muted)}.m-intel-signal i{display:block;height:6px;margin-top:8px;border-radius:10px;background:#eef2f6;overflow:hidden}.m-intel-signal i:after{content:"";display:block;height:100%;width:var(--pct);border-radius:inherit;background:linear-gradient(90deg,var(--m-blue),var(--m-sky))}.m-intel-foot{margin-top:14px;font-size:11px;color:#7a8795}.m-portal-main>.mjb-recommend{margin-top:20px}.m-intel-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:#e9f6ff;color:#1268a7;font-size:11px;font-weight:800}.m-intel-chip:before{content:"✦"}.m-page-hero .m-intel-chip{margin-top:18px}@media(max-width:900px){.m-intel-layout{grid-template-columns:1fr}.m-intel-demo{max-width:680px}}
