/* ==========================================================================
   DevOps HQ — "control plane" design system
   Ported from devops-hq-conversion-prototype.html.
   Loaded ON TOP of Tailwind utilities in jobs/index.html and jobs/job-detail.html.
   Layout utilities (grid/flex/spacing/responsive) come from Tailwind; this file
   supplies the brand palette, typography, and component surfaces.
   ========================================================================== */

:root {
  --cloud:#f6f8fb;
  --surface:#ffffff;
  --navy:#132238;
  --slate:#5a6b7f;
  --blue:#2563eb;
  --blue-dark:#1d4ed8;
  --teal:#087f72;
  --teal-soft:#eaf8f5;
  --amber:#a15c00;
  --border:#dce3ec;
  --border-dark:#c8d2df;
  --soft-blue:#eef4ff;
  --red:#b42318;
  --shadow:0 18px 45px rgba(19,34,56,.10);
  --radius:10px;
  --max:1220px;
}

/* ----- base ----- */
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  color:var(--navy);
  background:var(--cloud);
  font-family:Inter, "Segoe UI", system-ui, sans-serif;
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:inherit; text-decoration:none; }
button { cursor:pointer; }
:focus-visible { outline:3px solid rgba(37,99,235,.28); outline-offset:2px; }
.mono { font-family:"JetBrains Mono", ui-monospace, monospace; }
h1,h2,h3,h4 { font-family:Sora, Inter, sans-serif; margin-top:0; }

/* Container helper (template also uses Tailwind's .container) */
.container.dhq-container,
.dhq-container { width:min(var(--max), calc(100% - 40px)); margin-inline:auto; }

/* ----- top announcement bar ----- */
.dhq-topbar {
  background:#0e1b2e; color:#d9e3ef;
  font-size:12px; letter-spacing:.01em;
}
.dhq-topbar .dhq-bar-inner { height:35px; display:flex; align-items:center; justify-content:center; gap:10px; }

/* ----- header / nav ----- */
.dhq-header {
  position:sticky; top:0; z-index:30;
  background:rgba(255,255,255,.92);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.dhq-nav { height:72px; display:flex; align-items:center; gap:34px; }
.dhq-brand { display:flex; align-items:center; gap:11px; margin-right:10px; font-weight:700; }
.dhq-brand-mark {
  width:35px; height:35px; border-radius:8px; background:var(--navy); color:white;
  display:grid; place-items:center; position:relative; overflow:hidden; flex-shrink:0;
}
.dhq-brand-mark:before { content:""; position:absolute; width:18px; height:18px; border:2px solid #60a5fa; transform:rotate(45deg); }
.dhq-brand-mark:after { content:""; position:absolute; width:6px; height:6px; background:#2dd4bf; border-radius:50%; }
.dhq-brand-name { font-family:Sora,sans-serif; font-weight:700; font-size:16px; letter-spacing:-.02em; color:var(--navy); }
.dhq-brand-name span { color:var(--blue); }
.dhq-nav-links { display:flex; gap:26px; align-items:center; flex:1; }
.dhq-nav-links a { font-size:14px; font-weight:600; color:#40536a; }
.dhq-nav-links a:hover { color:var(--blue); }
.dhq-nav-actions { display:flex; gap:10px; align-items:center; }
.dhq-menu-btn { display:none; border:0; background:transparent; padding:8px; }

/* ----- buttons ----- */
.btn,
.dhq-btn {
  min-height:42px; padding:0 17px; border:1px solid transparent; border-radius:8px;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:14px; font-weight:700; transition:.18s ease; line-height:1.1;
}
.btn-primary, .dhq-btn-primary { background:var(--blue); color:#fff; box-shadow:0 6px 14px rgba(37,99,235,.18); }
.btn-primary:hover, .dhq-btn-primary:hover { background:var(--blue-dark); transform:translateY(-1px); }
.btn-secondary, .dhq-btn-secondary { background:#fff; border-color:var(--border-dark); color:var(--navy); }
.btn-secondary:hover, .dhq-btn-secondary:hover { border-color:#9cacc0; background:#fafcff; }
.btn-quiet, .dhq-btn-quiet { background:transparent; color:#40536a; padding-inline:8px; }
.btn-quiet:hover, .dhq-btn-quiet:hover { color:var(--blue); }

/* legacy Tailwind button hooks used widely in the templates */
.bg-cyan-600.text-white,
.bg-cyan-600 { /* overridden below only when paired */ }

/* ----- hero ----- */
.dhq-hero {
  position:relative; overflow:hidden;
  padding:64px 0 44px;
  background:
    linear-gradient(90deg, rgba(220,227,236,.38) 1px, transparent 1px),
    linear-gradient(rgba(220,227,236,.38) 1px, transparent 1px),
    radial-gradient(circle at 82% 20%, rgba(37,99,235,.10), transparent 29%),
    var(--surface);
  background-size:40px 40px,40px 40px,auto,auto;
  border-bottom:1px solid var(--border);
}
/* Consistent centered content width across all main sections (not full 1220px) */
.dhq-section > .dhq-container { max-width:960px; }
/* Premium section: keep the filter panel + job cards in a tighter centered column */
#premium-jobs-section .dhq-card,
#premium-jobs-section #premium-filtered-results,
#premium-jobs-section #premium-jobs-grid,
#premium-jobs-section .dhq-premium-benefits { max-width:820px; margin-inline:auto; }
#premium-jobs-section .premium-card { width:100%; }
.dhq-hero:after {
  content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:linear-gradient(90deg,var(--teal) 0 18%,var(--blue) 18% 66%,#7c3aed 66% 100%);
}
.dhq-h1 { max-width:920px; font-family:Sora,sans-serif; font-size:clamp(34px,5vw,60px); line-height:1.06; letter-spacing:-.04em; margin:0 0 18px; color:var(--navy); }
.dhq-hero-copy { max-width:760px; color:var(--slate); font-size:18px; line-height:1.65; margin:0 0 26px; }
.dhq-hero-copy strong { color:var(--navy); }

/* ----- eyebrow / section heads ----- */
.dhq-eyebrow { display:flex; align-items:center; gap:8px; color:var(--teal); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.11em; margin-bottom:17px; }
.dhq-eyebrow:before { content:""; width:24px; height:2px; background:currentColor; }
.dhq-section { padding:70px 0; }
.dhq-section-white { background:#fff; }
.dhq-section-head { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:25px; }
.dhq-section-head h2 { font-size:30px; letter-spacing:-.035em; margin-bottom:8px; color:var(--navy); }
.dhq-section-head p { color:var(--slate); margin:0; font-size:14px; }
.dhq-status-note { display:flex; align-items:center; gap:8px; color:var(--teal); font-size:12px; font-weight:700; white-space:nowrap; }

/* ----- live dot ----- */
.live-dot { position:relative; display:inline-flex; height:8px; width:8px; }
.live-dot .dot-core { position:relative; display:inline-flex; border-radius:9999px; height:8px; width:8px; background:var(--teal); }
.live-dot .live-ping {
  position:absolute; display:inline-flex; height:100%; width:100%; border-radius:9999px;
  background:var(--teal); opacity:.75;
  animation:livepulse 1.4s cubic-bezier(0,0,.2,1) infinite;
}
@keyframes livepulse {
  0%   { transform:scale(1); opacity:.75; }
  70%  { transform:scale(2.2); opacity:0; }
  100% { transform:scale(2.2); opacity:0; }
}

/* ----- proof strip (stats) ----- */
.dhq-proof-strip { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--border); border-radius:10px; background:rgba(255,255,255,.75); overflow:hidden; }
.dhq-proof { padding:19px 22px; border-right:1px solid var(--border); }
.dhq-proof:last-child { border:0; }
.dhq-proof-value { display:block; font-family:Sora,sans-serif; font-size:20px; font-weight:700; margin-bottom:5px; color:var(--navy); }
.dhq-proof-label { color:var(--slate); font-size:12px; }

/* ----- search console / chips ----- */
.dhq-search-console {
  padding:14px; background:#fff; border:1px solid var(--border-dark); border-radius:12px;
  display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:9px; box-shadow:0 16px 46px rgba(19,34,56,.11);
}
.dhq-field { min-height:58px; border:1px solid var(--border); background:#fbfcfe; border-radius:8px; padding:9px 13px; display:flex; align-items:center; gap:11px; }
.dhq-field i { color:#75879b; width:18px; }
.dhq-field-content { min-width:0; flex:1; }
.dhq-field-label { display:block; font-size:10px; font-weight:800; color:#75879b; text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px; }
.dhq-field input,.dhq-field select { width:100%; border:0; outline:0; background:transparent; color:var(--navy); font-size:14px; font-weight:600; padding:0; }
.dhq-search-console .btn, .dhq-search-console .dhq-btn { min-height:58px; padding-inline:23px; }

/* Refine-premium-jobs row — visually part of the hero search console (one search surface) */
.dhq-search-refine {
  margin-top:10px; padding:10px;
  background:#fff; border:1px solid var(--border-dark); border-radius:12px;
  display:flex; flex-wrap:wrap; align-items:center; gap:9px;
  box-shadow:0 12px 30px rgba(19,34,56,.06);
}
.dhq-refine-label {
  display:flex; align-items:center; gap:7px;
  font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em;
  color:var(--teal); white-space:nowrap; padding-right:4px;
}
.dhq-refine-label:before { content:""; width:16px; height:2px; background:currentColor; border-radius:2px; }
/* Field tiles — reuse the .dhq-field look: label above, input below */
.dhq-refine-field {
  position:relative; min-width:150px; flex:1 1 150px;
  min-height:52px; border:1px solid var(--border); background:#fbfcfe; border-radius:8px;
  padding:8px 12px; display:flex; flex-direction:column; justify-content:center; gap:3px;
}
.dhq-refine-field > span { font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:#75879b; }
.dhq-refine-field select {
  width:100%; border:0; outline:0; background:transparent;
  color:var(--navy); font-size:14px; font-weight:600; padding:0; cursor:pointer;
}
.dhq-refine-field:focus-within { border-color:var(--blue); background:#fff; box-shadow:0 0 0 3px rgba(37,99,235,.10); }
/* Checkbox chips */
.dhq-refine-check {
  display:inline-flex; align-items:center; gap:7px;
  height:52px; padding:0 14px; border:1px solid var(--border); border-radius:8px;
  background:#fbfcfe; font-size:13px; font-weight:700; color:#43566d; cursor:pointer; white-space:nowrap;
  transition:.15s;
}
.dhq-refine-check:hover { border-color:#8fb0ee; color:var(--blue); background:var(--soft-blue); }
.dhq-refine-check input { width:16px; height:16px; accent-color:var(--blue); cursor:pointer; }
@media (max-width:680px) {
  .dhq-search-refine { flex-direction:column; align-items:stretch; }
  .dhq-refine-field { width:100%; flex-basis:auto; }
  .dhq-refine-check { width:100%; justify-content:flex-start; }
}
.dhq-quick-filters { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:17px; }
.dhq-quick-label { color:var(--slate); font-size:12px; font-weight:600; margin-right:3px; }
.dhq-chip { padding:7px 10px; border:1px solid var(--border); border-radius:7px; background:#fff; font-size:12px; font-weight:650; color:#43566d; transition:.15s; }
.dhq-chip:hover,.dhq-chip.active { border-color:#8fb0ee; color:var(--blue); background:var(--soft-blue); }

/* ----- job cards (signature surface) ----- */
.dhq-jobs-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:24px; align-items:start; }
.dhq-job-list { display:grid; gap:12px; }
.dhq-job-card {
  position:relative; background:#fff; border:1px solid var(--border); border-radius:10px; padding:22px;
  display:grid; grid-template-columns:46px minmax(0,1fr) auto; gap:16px; transition:.18s ease;
}
.dhq-job-card:hover { border-color:#aebdd0; box-shadow:0 10px 28px rgba(19,34,56,.07); transform:translateY(-1px); }
.dhq-logo { width:46px; height:46px; border-radius:9px; border:1px solid var(--border); display:grid; place-items:center; font-family:Sora,sans-serif; font-weight:700; background:#f8fafc; color:#31445d; overflow:hidden; }
.dhq-logo img { width:100%; height:100%; object-fit:cover; }
.dhq-job-heading { display:flex; align-items:start; justify-content:space-between; gap:12px; }
.dhq-job-title { font-family:Sora,sans-serif; font-size:17px; font-weight:700; letter-spacing:-.02em; margin:0 0 6px; color:var(--navy); }
.dhq-job-title a { color:inherit; }
.dhq-company { color:var(--slate); font-size:13px; }
.dhq-new-label { color:var(--teal); background:var(--teal-soft); font-size:10px; font-weight:800; padding:4px 7px; border-radius:5px; text-transform:uppercase; letter-spacing:.06em; }
.dhq-badge { font-size:10px; font-weight:800; padding:4px 7px; border-radius:5px; text-transform:uppercase; letter-spacing:.06em; }
.dhq-badge.new { color:var(--teal); background:var(--teal-soft); }
.dhq-badge.featured { color:#6d28d9; background:#f3e8ff; }
.dhq-badge.premium { color:#a15c00; background:#fff3e0; }

/* telemetry strip — the signature motif */
.dhq-telemetry { display:flex; flex-wrap:wrap; align-items:center; gap:6px 15px; margin:15px 0 12px; padding:10px 12px; border:1px solid #e2e8f0; background:#f8fafc; border-radius:7px; }
.dhq-signal { display:flex; align-items:center; gap:6px; color:#43566d; font-size:11px; font-family:"JetBrains Mono",monospace; }
.dhq-signal i { width:13px; height:13px; color:#6e8095; }
.dhq-signal.positive { color:var(--teal); }
.dhq-signal.salary { font-weight:700; color:#0f5132; }
.dhq-tags { display:flex; flex-wrap:wrap; gap:6px; }
.dhq-tag { font-family:"JetBrains Mono",monospace; color:#40536a; font-size:10px; padding:5px 7px; background:#eff3f7; border-radius:5px; }
.dhq-job-actions { display:flex; align-items:center; gap:8px; align-self:center; }
.dhq-icon-btn { width:40px; height:40px; border:1px solid var(--border); background:#fff; border-radius:8px; display:grid; place-items:center; color:#5f7186; }
.dhq-icon-btn:hover { color:var(--blue); border-color:#94b4ef; }
.dhq-icon-btn i { width:17px; }

/* ----- filter rail ----- */
.dhq-filters { background:#15253a; color:#fff; border-radius:10px; padding:22px; position:sticky; top:94px; }
.dhq-filters h3 { font-size:15px; margin-bottom:7px; }
.dhq-filters > p { color:#aebdce; font-size:12px; line-height:1.5; margin:0 0 20px; }
.dhq-filter-row { padding:15px 0; border-top:1px solid rgba(255,255,255,.10); }
.dhq-filter-row label { display:block; color:#b8c5d5; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; margin-bottom:9px; }
.dhq-filter-row select { width:100%; border:1px solid rgba(255,255,255,.16); background:#1c3048; color:#fff; border-radius:7px; padding:10px; font-size:12px; }
.dhq-filters .btn, .dhq-filters .dhq-btn { width:100%; margin-top:17px; background:#2dd4bf; color:#082f2b; }
.dhq-filters .btn:hover, .dhq-filters .dhq-btn:hover { background:#5eead4; }

/* ----- inline alert (contextual newsletter) ----- */
.dhq-inline-alert {
  background:linear-gradient(110deg,#132238,#183552); color:#fff; border-radius:10px; padding:27px;
  display:grid; grid-template-columns:1fr auto; align-items:center; gap:24px; overflow:hidden; position:relative;
}
.dhq-inline-alert:after { content:""; position:absolute; right:-45px; top:-70px; width:190px; height:190px; border:35px solid rgba(45,212,191,.08); border-radius:50%; }
.dhq-inline-alert h3 { margin-bottom:8px; font-size:19px; }
.dhq-inline-alert p { margin:0; color:#b9c8da; font-size:12px; }
.dhq-alert-form { display:flex; gap:8px; position:relative; z-index:1; }
.dhq-alert-form input { width:240px; min-height:44px; border:1px solid rgba(255,255,255,.18); border-radius:7px; color:#fff; background:rgba(255,255,255,.08); padding:0 13px; outline:0; }
.dhq-alert-form input::placeholder { color:#aebdce; }

/* ----- features ----- */
.dhq-features { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.dhq-feature { padding:26px; border:1px solid var(--border); background:#fff; border-radius:10px; }
.dhq-feature-index { font-family:"JetBrains Mono",monospace; font-size:11px; color:var(--teal); margin-bottom:14px; }
.dhq-feature h3 { font-size:17px; margin-bottom:10px; }
.dhq-feature p { color:var(--slate); font-size:13px; line-height:1.7; margin:0; }
.dhq-feature-h { font-family:Sora,sans-serif; font-size:16px; font-weight:600; color:var(--navy); margin-bottom:8px; }
.dhq-feature-p { color:var(--slate); font-size:13px; line-height:1.7; margin:0; }

/* ----- alert builder ----- */
.dhq-alert-builder { background:#eaf0f8; }
.dhq-builder-shell { background:#fff; border:1px solid var(--border-dark); border-radius:13px; box-shadow:0 20px 55px rgba(19,34,56,.10); overflow:hidden; }
.dhq-builder-top { padding:30px 34px 22px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.dhq-builder-top h2 { font-size:26px; margin-bottom:7px; }
.dhq-builder-top p { color:var(--slate); font-size:13px; margin:0; }
.dhq-step-pill { padding:7px 10px; border-radius:6px; background:var(--teal-soft); color:var(--teal); font-size:11px; font-weight:800; }
.dhq-builder-body { padding:30px 34px; }
.dhq-builder-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }
.dhq-builder-field label { display:block; font-size:11px; font-weight:800; margin-bottom:8px; }
.dhq-builder-field select,.dhq-builder-field input { width:100%; height:46px; border:1px solid var(--border-dark); border-radius:7px; background:#fff; padding:0 12px; color:var(--navy); }
.dhq-builder-preview { margin-top:22px; padding:17px; display:flex; align-items:center; justify-content:space-between; gap:20px; background:#f7f9fc; border:1px solid var(--border); border-radius:8px; }
.dhq-preview-label { font-size:10px; font-weight:800; color:var(--slate); text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px; }
.dhq-preview-text { font-size:13px; font-weight:700; }

/* ==========================================================================
   JOB DETAIL surfaces
   ========================================================================== */
.dhq-breadcrumbs { font-size:12px; color:#74869b; margin-bottom:26px; }
.dhq-breadcrumbs a:hover { color:var(--blue); }
.dhq-job-hero-card { background:#fff; border:1px solid var(--border); border-radius:12px; padding:30px; }
.dhq-job-hero-top { display:grid; grid-template-columns:64px 1fr auto; gap:18px; align-items:start; }
.dhq-job-hero-card .dhq-logo { width:64px; height:64px; font-size:20px; }
.dhq-job-hero-card h1 { font-size:33px; margin:0 0 8px; letter-spacing:-.04em; max-width:none; color:var(--navy); }
.dhq-job-subtitle { color:var(--slate); font-size:14px; }
.dhq-job-hero-actions { display:flex; gap:8px; }
.dhq-job-telemetry { display:grid; grid-template-columns:repeat(5,1fr); border:1px solid var(--border); border-radius:8px; margin-top:26px; overflow:hidden; }
.dhq-telemetry-cell { padding:15px; border-right:1px solid var(--border); }
.dhq-telemetry-cell:last-child { border:0; }
.dhq-telemetry-label { display:block; color:#7a8ca0; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; margin-bottom:7px; }
.dhq-telemetry-value { font-size:12px; font-weight:700; color:var(--navy); }
.dhq-job-body { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:28px; margin-top:28px; align-items:start; }
.dhq-job-content { background:#fff; border:1px solid var(--border); border-radius:10px; padding:34px; }
.dhq-job-content h2 { font-size:21px; letter-spacing:-.02em; margin:35px 0 13px; }
.dhq-job-content h2:first-of-type { margin-top:0; }
.dhq-job-content p,.dhq-job-content li { color:#4f6176; font-size:14px; line-height:1.8; }
.dhq-job-content li { margin-bottom:9px; }
.dhq-job-content ul { padding-left:20px; }
.dhq-fit-summary { display:grid; grid-template-columns:repeat(2,1fr); border:1px solid var(--border); border-radius:8px; overflow:hidden; margin-bottom:34px; }
.dhq-fit-item { padding:15px; border-bottom:1px solid var(--border); }
.dhq-fit-item:nth-child(odd) { border-right:1px solid var(--border); }
.dhq-fit-item:nth-last-child(-n+2) { border-bottom:0; }
.dhq-decision { position:sticky; top:94px; background:#fff; border:1px solid var(--border-dark); border-radius:10px; padding:22px; box-shadow:0 12px 30px rgba(19,34,56,.08); }
.dhq-decision-status { display:flex; gap:8px; align-items:center; color:var(--teal); font-size:11px; font-weight:800; margin-bottom:17px; }
.dhq-decision h3 { font-size:18px; margin-bottom:18px; }
.dhq-decision-data { display:grid; gap:13px; margin-bottom:20px; }
.dhq-decision-row { display:flex; justify-content:space-between; gap:10px; font-size:12px; border-bottom:1px solid #edf1f5; padding-bottom:12px; }
.dhq-decision-row span:first-child { color:#74869b; }
.dhq-decision-row strong { text-align:right; color:var(--navy); }
.dhq-decision .btn, .dhq-decision .dhq-btn { width:100%; margin-top:8px; }
.dhq-source-note { margin-top:17px; font-size:10px; line-height:1.6; color:#7a8ca0; text-align:center; }

/* company info block (kept from current detail page, restyled) */
.dhq-company-block { background:#f9fafb; border:1px solid var(--border); border-radius:12px; padding:20px; margin-bottom:24px; }
.dhq-company-block .dhq-cmp-top { display:flex; align-items:flex-start; gap:16px; }
.dhq-company-block h3 { font-size:16px; font-weight:600; color:var(--navy); margin:0; }
.dhq-company-block .dhq-cmp-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.dhq-company-block .dhq-cmp-pill { padding:2px 10px; font-size:11px; font-weight:500; border-radius:9999px; }
.dhq-company-block .dhq-cmp-desc { font-size:13px; color:var(--slate); margin-top:10px; line-height:1.5; }

/* salary + tag pills on detail */
.dhq-salary-pill { display:inline-flex; align-items:center; gap:6px; padding:6px 14px; background:#ecfdf5; color:#065f46; font-size:14px; font-weight:600; border-radius:9999px; border:1px solid #a7f3d0; }
.dhq-tag-pill { padding:4px 12px; background:#eef4ff; color:#1e3a8a; font-size:12px; font-weight:500; border-radius:9999px; border:1px solid #c7d2fe; }

/* ==========================================================================
   COMPAT LAYER — restyle existing template hooks WITHOUT changing behavior.
   The templates use these classes; we make them look on-brand while
   preserving the premium-blur / overlay / map / pricing logic.
   ========================================================================== */

/* Existing .job-card used in index search results */
.job-card.dhq-styled {
  background:#fff; border:1px solid var(--border); border-radius:10px; padding:18px;
  box-shadow:0 6px 14px rgba(19,34,56,.05) !important; margin:8px 0 !important;
}
.job-card.dhq-styled:hover { border-color:#aebdd0; }

/* Generic panel/card used by the premium-jobs filter menu */
.dhq-card {
  background:#fff; border:1px solid var(--border); border-radius:12px;
  padding:24px; box-shadow:0 6px 14px rgba(19,34,56,.05);
}
.dhq-card label { color:var(--navy); font-weight:600; font-size:13px; }
.dhq-card select,
.dhq-card input[type="text"] {
  width:100%; height:42px; padding:0 12px;
  border:1px solid var(--border-dark); border-radius:8px; background:#fbfcfe;
  color:var(--navy); font-size:14px; font-weight:500; transition:.15s;
}
.dhq-card select:focus,
.dhq-card input[type="text"]:focus {
  outline:0; border-color:var(--blue); background:#fff;
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.dhq-card input[type="checkbox"] { width:16px; height:16px; accent-color:var(--blue); }

/* ==========================================================================
   FOOTER (SEO link grid) — control-plane dark
   ========================================================================== */
.dhq-footer {
  background:#15253a; color:#aebdce; padding:54px 0 28px;
}
.dhq-footer a { color:#8aa0b8; transition:color .15s; }
.dhq-footer a:hover { color:#fff; }
.dhq-footer h4 {
  font-family:Sora,sans-serif; color:#dbe4ee; font-size:12px; font-weight:700;
  text-transform:uppercase; letter-spacing:.09em; margin:0 0 14px;
}
.dhq-footer h5 { color:#c2d0e0; font-size:12px; font-weight:600; margin:0 0 8px; }
.dhq-footer ul { list-style:none; padding:0; margin:0; }
.dhq-footer ul li { margin:0 0 7px; }
.dhq-footer ul li a { font-size:13px; }
.dhq-footer .dhq-footer-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:36px; max-width:1220px;
  margin-inline:auto; padding-inline:24px;
}
.dhq-footer .dhq-footer-extended {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:16px;
  max-width:1220px; margin:36px auto 0; padding:30px 24px 0;
  border-top:1px solid rgba(255,255,255,.08);
}
.dhq-footer .dhq-footer-extended h5 { font-size:11px; }
.dhq-footer .dhq-footer-extended ul li { margin:0 0 5px; }
.dhq-footer .dhq-footer-extended ul li a { font-size:12px; }
.dhq-footer .dhq-copyright {
  max-width:1220px; margin:34px auto 0; padding:22px 24px 0;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  color:#6c819a; font-size:12px;
}
@media (max-width:960px) {
  .dhq-footer .dhq-footer-grid { grid-template-columns:repeat(2,1fr); gap:26px; }
  .dhq-footer .dhq-footer-extended { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:680px) {
  .dhq-footer .dhq-footer-grid { grid-template-columns:1fr 1fr; }
  .dhq-footer .dhq-footer-extended { grid-template-columns:1fr 1fr; }
  .dhq-footer .dhq-copyright { flex-direction:column; }
}

/* Premium blur — keep the exact behavior, retune look */
.premium-blur { filter:blur(4px); transition:filter .3s ease-in-out; }
.premium-blur:hover { filter:blur(6px); }
.premium-glow { box-shadow:0 0 20px rgba(8,127,114,.18); transition:box-shadow .3s ease-in-out; }
.premium-glow:hover { box-shadow:0 0 30px rgba(8,127,114,.30); }
.backdrop-blur-sm { backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); }

/* Premium job overlay hover effect (behavior identical, color retuned) */
.premium-job-overlay {
  position:absolute !important; inset:0 !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  opacity:0 !important; transition:opacity .3s ease !important;
  border-radius:10px;
}
.group:hover .premium-job-overlay { opacity:1 !important; }
.premium-card { transition:all .3s ease-in-out; }
.premium-card:hover { transform:translateY(-2px); }

/* World map panel — keep glow logic, retune palette to control-plane */
.job-map-panel {
  position:relative; background:radial-gradient(ellipse at center,#0e1b2e 0%,#020617 100%);
  border-radius:16px; overflow:hidden; border:1px solid #1e293b;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.5);
}
.job-map-world { width:100%; height:100%; display:block; }
#job-map-panel { aspect-ratio:2 / 1; }
.job-map-world path { fill:#1e293b; stroke:#334155; stroke-width:.5; transition:fill .3s; }
.job-dot { position:absolute; transform:translate(-50%,-50%); border-radius:50%; cursor:pointer; z-index:5; }
.job-dot-core { position:absolute; inset:0; border-radius:50%; background:radial-gradient(circle,#67e8f9 0%,#06b6d4 60%,#0891b2 100%); }
.job-dot-glow { position:absolute; inset:0; border-radius:50%; background:#22d3ee; opacity:.55; animation:jobdotpulse 2.4s cubic-bezier(0,0,.2,1) infinite; }
@keyframes jobdotpulse {
  0%   { transform:scale(1); opacity:.55; }
  70%  { transform:scale(2.6); opacity:0; }
  100% { transform:scale(2.6); opacity:0; }
}
.job-dot-tip {
  position:absolute; bottom:140%; left:50%; transform:translateX(-50%);
  background:#0e1b2e; border:1px solid #334155; color:#e2e8f0;
  font-size:12px; font-weight:600; padding:5px 10px; border-radius:8px; white-space:nowrap;
  opacity:0; pointer-events:none; transition:opacity .2s; z-index:10;
}
.job-dot:hover .job-dot-tip { opacity:1; }
.job-dot:hover .job-dot-core { background:radial-gradient(circle,#a5f3fc 0%,#22d3ee 60%,#06b6d4 100%); }

/* Pricing cards (premium-upgrade section) — on-brand */
.premium-upgrade-section {
  background:linear-gradient(135deg,#f6f8fb 0%,#eef4ff 100%);
  padding:40px 30px; border-radius:16px; box-shadow:0 4px 6px rgba(19,34,56,.06);
}
.pricing-cards-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; margin:30px 0; }
.pricing-card {
  background:#fff; border-radius:12px; padding:30px 25px; box-shadow:0 2px 4px rgba(19,34,56,.06);
  transition:all .3s ease; position:relative; border:2px solid var(--border); display:flex; flex-direction:column;
}
.pricing-card:hover { transform:translateY(-5px); box-shadow:0 8px 16px rgba(19,34,56,.12); }
.pricing-card.featured { border-color:var(--blue); transform:scale(1.05); z-index:10; }
.pricing-card.featured:hover { transform:scale(1.05) translateY(-5px); }
.pricing-card.best-value { border-color:var(--teal); }
.pricing-card .price { font-size:42px; font-weight:700; color:var(--navy); margin:15px 0; line-height:1; font-family:Sora,sans-serif; }
.pricing-card .price span { font-size:16px; color:var(--slate); font-weight:400; }
.pricing-card .badge { position:absolute; top:-12px; right:20px; padding:6px 14px; border-radius:20px; font-size:12px; font-weight:700; color:#fff; }
.badge.popular { background:linear-gradient(135deg,var(--blue) 0%,var(--blue-dark) 100%); }
.badge.value { background:linear-gradient(135deg,#0d9488 0%,var(--teal) 100%); }
.features-list { list-style:none; padding:0; margin:15px 0 20px 0; flex-grow:1; }
.features-list li { padding:6px 0; color:#475569; font-size:14px; }
.pricing-button {
  display:block; width:100%; padding:12px 20px; background:#f1f5f9; color:var(--navy);
  border:2px solid var(--border); border-radius:8px; text-decoration:none; font-weight:600;
  text-align:center; transition:all .3s ease; font-size:14px;
}
.pricing-button:hover { background:#e2e8f0; border-color:#cbd5e1; }
.pricing-button.featured-button { background:linear-gradient(135deg,var(--blue) 0%,var(--blue-dark) 100%); color:#fff; border:none; }
.pricing-button.featured-button:hover { background:linear-gradient(135deg,var(--blue-dark) 0%,#1e40af 100%); box-shadow:0 4px 12px rgba(37,99,235,.3); }
.upgrade-button {
  display:inline-block; padding:14px 32px; background:linear-gradient(135deg,var(--blue) 0%,var(--blue-dark) 100%);
  color:#fff !important; border-radius:8px; text-decoration:none !important; font-weight:700; transition:all .3s ease; font-size:16px;
}
.upgrade-button:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(37,99,235,.3); }

/* Similar-job cards (detail page) — calm control-plane variant of the rainbow */
.similar-job-card { background:#fff; border:1px solid var(--border); border-radius:10px; overflow:hidden; }
.similar-job-card:hover { box-shadow:0 10px 24px rgba(19,34,56,.08); transform:translateY(-2px); }
.similar-job-card .rel { position:relative; }
.similar-job-card .stripe { height:4px; }
.gradient-bg-1 { background:linear-gradient(90deg,#2563eb,#60a5fa); }
.gradient-bg-2 { background:linear-gradient(90deg,#087f72,#2dd4bf); }
.gradient-bg-3 { background:linear-gradient(90deg,#1d4ed8,#7c3aed); }
.gradient-bg-4 { background:linear-gradient(90deg,#a15c00,#f59e0b); }
.similar-job-card h3 a { color:var(--navy); }
.similar-job-card h3 a:hover { color:var(--blue); }
.similar-job-btn-1 { background:var(--blue) !important; }
.similar-job-btn-2 { background:var(--teal) !important; }
.similar-job-btn-3 { background:#7c3aed !important; }
.similar-job-btn-4 { background:var(--amber) !important; }

/* Country greeting banner — retune to control-plane gradient */
#country-greeting-banner {
  background:linear-gradient(to right,#132238,#1d4ed8 55%,#087f72) !important;
}

/* Auth modal (job detail apply) — fixed scrim + centered card */
.dhq-auth-modal {
  position:fixed; inset:0; z-index:9000;
  display:flex; align-items:center; justify-content:center; padding:20px;
  background:rgba(19,34,56,.55);
  backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
}
.dhq-auth-modal:not(.hidden) { animation:dhq-fade .16s ease; }
@keyframes dhq-fade { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
.dhq-auth-card {
  position:relative; width:min(340px,100%);
  background:var(--surface); border:1px solid var(--border); border-radius:12px;
  box-shadow:0 18px 40px rgba(19,34,56,.22); overflow:hidden;
}
/* navy header band = control-plane accent */
.dhq-auth-card::before {
  content:""; display:block; height:4px;
  background:linear-gradient(90deg,var(--teal) 0 18%,var(--blue) 18% 66%,#7c3aed 66% 100%);
}
.dhq-auth-icon {
  width:40px; height:40px; margin:22px auto 12px; border-radius:10px;
  background:var(--soft-blue); color:var(--blue); display:grid; place-items:center;
}
.dhq-auth-icon i { width:20px; height:20px; }
.dhq-auth-modal h2 {
  font-family:Sora,sans-serif; font-size:18px; font-weight:700; color:var(--navy);
  margin:0 0 6px; text-align:center; letter-spacing:-.02em;
}
.dhq-auth-modal p {
  color:var(--slate); font-size:13px; line-height:1.55; text-align:center;
  margin:0 auto 18px; max-width:260px; padding:0 6px;
}
.dhq-auth-actions { display:flex; gap:8px; justify-content:center; padding:0 24px 22px; }
.dhq-auth-actions .btn { flex:1; min-height:38px; padding:0 12px; font-size:13px; }
/* Force white text/icon on the primary (login) action — links lose color to :visited/Tailwind reset */
.dhq-auth-actions .btn-primary,
.dhq-auth-actions .btn-primary:visited { color:#fff !important; }
.dhq-auth-actions .btn-primary i,
.dhq-auth-actions .btn-primary svg { color:#fff; }
.dhq-auth-close {
  position:absolute; top:10px; right:10px; z-index:2;
  width:26px; height:26px; border:0; background:transparent; color:#9aa7b8;
  font-size:20px; line-height:1; border-radius:6px; cursor:pointer; transition:.15s;
}
.dhq-auth-close:hover { background:#eef2f7; color:var(--navy); }
.dhq-auth-modal.hidden { display:none; }
@media (max-width:480px) {
  .dhq-auth-actions { flex-direction:column; }
  .dhq-auth-actions .btn { width:100%; }
}

/* FAQ accordion */
.dhq-faq details { background:#fff; border:1px solid var(--border); border-radius:10px; padding:16px 18px; }
.dhq-faq details + details { margin-top:10px; }
.dhq-faq summary { font-weight:600; cursor:pointer; color:var(--navy); }
.dhq-faq summary + p { margin-top:10px; color:var(--slate); font-size:14px; line-height:1.7; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:960px) {
  .dhq-nav-links { display:none; }
  .dhq-nav-actions .dhq-btn-quiet, .dhq-nav-actions .btn-quiet { display:none; }
  .dhq-menu-btn { display:block; }
  .dhq-search-console { grid-template-columns:1fr 1fr; }
  .dhq-search-console .btn, .dhq-search-console .dhq-btn { grid-column:2; }
  .dhq-jobs-layout,.dhq-job-body { grid-template-columns:1fr; }
  .dhq-filters { position:static; display:none; }
  .dhq-builder-grid { grid-template-columns:1fr 1fr; }
  .dhq-footer-grid { grid-template-columns:1.5fr 1fr 1fr; }
  .dhq-job-telemetry { grid-template-columns:repeat(3,1fr); }
  .dhq-telemetry-cell:nth-child(3) { border-right:0; }
  .dhq-telemetry-cell:nth-child(-n+3) { border-bottom:1px solid var(--border); }
  .dhq-decision { position:static; }
}
@media (max-width:680px) {
  .dhq-container { width:min(100% - 24px,var(--max)); }
  .dhq-topbar .dhq-bar-inner { font-size:10px; }
  .dhq-nav { height:62px; gap:10px; }
  .dhq-brand-name { font-size:14px; }
  .dhq-nav-actions .dhq-btn-secondary, .dhq-nav-actions .btn-secondary { display:none; }
  .dhq-nav-actions { margin-left:auto; }
  .dhq-nav-actions .dhq-btn-primary, .dhq-nav-actions .btn-primary { min-height:38px; padding:0 11px; font-size:12px; }
  .dhq-proof-strip { grid-template-columns:1fr 1fr; }
  .dhq-proof:nth-child(2) { border-right:0; }
  .dhq-proof:nth-child(-n+2) { border-bottom:1px solid var(--border); }
  .dhq-section { padding:50px 0; }
  .dhq-section-head { align-items:start; flex-direction:column; gap:10px; }
  .dhq-job-card { grid-template-columns:40px 1fr; padding:17px; }
  .dhq-job-card .dhq-logo { width:40px; height:40px; }
  .dhq-job-actions { grid-column:2; justify-content:flex-start; }
  .dhq-inline-alert { grid-template-columns:1fr; }
  .dhq-alert-form { flex-direction:column; }
  .dhq-alert-form input { width:100%; }
  .dhq-features { grid-template-columns:1fr; }
  .dhq-builder-top { padding:24px; align-items:flex-start; }
  .dhq-builder-grid { grid-template-columns:1fr; }
  .dhq-builder-body { padding:24px; }
  .dhq-builder-preview { align-items:stretch; flex-direction:column; }
  .dhq-footer-grid { grid-template-columns:1fr 1fr; }
  .dhq-footer-grid > div:first-child { grid-column:1/-1; }
  .dhq-job-page { padding-top:25px; }
  .dhq-job-hero-card { padding:20px; }
  .dhq-job-hero-top { grid-template-columns:52px 1fr; }
  .dhq-job-hero-card .dhq-logo { width:52px; height:52px; }
  .dhq-job-hero-card h1 { font-size:25px; }
  .dhq-job-hero-actions { grid-column:1/-1; }
  .dhq-job-telemetry { grid-template-columns:1fr 1fr; }
  .dhq-telemetry-cell { border-bottom:1px solid var(--border); }
  .dhq-telemetry-cell:nth-child(odd) { border-right:1px solid var(--border); }
  .dhq-telemetry-cell:nth-child(even) { border-right:0; }
  .dhq-telemetry-cell:last-child { grid-column:1/-1; border-bottom:0; }
  .dhq-job-content { padding:23px; }
  .dhq-fit-summary { grid-template-columns:1fr; }
  .dhq-fit-item,.dhq-fit-item:nth-child(odd) { border-right:0; border-bottom:1px solid var(--border); }
  .dhq-fit-item:last-child { border-bottom:0; }
}
@media (prefers-reduced-motion:reduce) {
  * { scroll-behavior:auto !important; transition:none !important; }
  .live-dot .live-ping, .job-dot-glow { animation:none !important; }
}