/* teqniq Mission Control — Jobs board styles.
   Generated from the signed-off jobs.html: every rule the page uses that
   style.css does not already provide, plus page numbers for the live
   list. Loaded only on the Jobs template. */
.mc-nav a, .mc-btn, .mc-section-label, .jb-title, .jb-h2, .jb-role{
  font-family:"Barlow Condensed","Oswald",Impact,sans-serif;
  text-transform:uppercase; font-weight:400;
}
.mc-nav a:hover, .mc-nav a[aria-current="page"]{ opacity:1; }
.mc-nav a[aria-current="page"]::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px; background:var(--signal);
}
.jb-head{
  position:relative; overflow:hidden;
  padding:calc(clamp(3.5rem,10vh,6rem) + 62px) var(--gut) clamp(2rem,5vh,3rem);
  border-bottom:var(--rule);
}
.jb-head::before{
  content:""; position:absolute; inset:0; z-index:-2;
  background:
    radial-gradient(85% 120% at 50% -10%, rgba(255,255,255,0.075) 0%, transparent 62%),
    linear-gradient(180deg,#0A0B0C 0%,#050607 100%);
}
.jb-head::after{
  content:""; position:absolute; inset:auto 0 0 0; height:72%; z-index:-2;
  background-image:
    linear-gradient(to right, var(--hair-soft) 1px, transparent 1px),
    linear-gradient(to bottom, var(--hair-soft) 1px, transparent 1px);
  background-size:88px 88px;
  mask-image:linear-gradient(to top,#000,transparent);
  -webkit-mask-image:linear-gradient(to top,#000,transparent);
}
.jb-wrap{ max-width:1440px; margin-inline:auto; }
.jb-title{
  font-size:clamp(2.3rem,6vw,5rem); line-height:0.9; font-weight:300;
  margin:1.1rem 0 1.2rem; max-width:15ch; text-wrap:balance;
}
.jb-title strong{ font-weight:600; }
.jb-lead{ color:var(--slate); font-weight:300; max-width:52ch; margin:0; font-size:1.04rem; }
.jb-filters{
  position:sticky; top:62px; z-index:60;
  background:rgba(11,12,14,0.94); backdrop-filter:blur(8px);
  border-bottom:var(--rule);
  padding:0.9rem var(--gut);
}
.jb-filter-row{
  max-width:1440px; margin-inline:auto;
  display:grid; gap:0.7rem; grid-template-columns:1fr;
}
@media (min-width:760px){ .jb-filter-row{ grid-template-columns:1.6fr 1fr 1fr 1fr auto; align-items:center; } }
.jb-search{ position:relative; display:flex; align-items:center; }
.jb-search svg{ position:absolute; left:0.85rem; width:15px; height:15px; color:var(--dim); pointer-events:none; }
.jb-filters input[type=search], .jb-filters select{
  font-family:"Archivo",sans-serif; font-size:0.92rem; color:var(--ice);
  background:var(--void); border:1px solid var(--hair); border-radius:0;
  padding:0.62rem 0.85rem; width:100%;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.jb-filters input[type=search]{ padding-left:2.4rem; }
.jb-filters input[type=search]::-webkit-search-cancel-button{ filter:invert(1) opacity(.4); }
.jb-filters select{
  appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--slate) 50%),linear-gradient(135deg,var(--slate) 50%,transparent 50%);
  background-position:calc(100% - 17px) 50%, calc(100% - 12px) 50%;
  background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:2.2rem;
}
.jb-filters input:focus, .jb-filters select:focus{
  outline:none; border-color:var(--live); box-shadow:0 0 0 3px var(--live-dim);
}
.jb-filters select[data-set="1"], .jb-filters input[data-set="1"]{ border-color:var(--live); color:var(--ice); }
.jb-clear{
  appearance:none; background:transparent; border:1px solid var(--hair); color:var(--slate);
  font-family:"Barlow Condensed",sans-serif; text-transform:uppercase;
  font-size:0.78rem; letter-spacing:0.16em; padding:0.62rem 1rem; cursor:pointer;
  transition:border-color .2s ease, color .2s ease;
}
.jb-clear:hover{ border-color:var(--ice); color:var(--ice); }
.jb-count{
  max-width:1440px; margin:0.75rem auto 0;
  font-family:"IBM Plex Mono",monospace; font-size:0.63rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--dim);
  display:flex; align-items:center; gap:0.55rem;
}
.jb-count b{
  color:var(--live); font-weight:500; font-variant-numeric:tabular-nums;
  display:inline-flex; align-items:center; gap:0.5rem;
  animation:blip 2.6s ease-in-out infinite;
}
.jb-count b::before{
  content:""; flex:none;
  width:6px; height:6px; border-radius:50%;
  background:var(--live); box-shadow:0 0 0 3px var(--live-dim);
}
/* New roles: logo white, not a second accent — blue stays the only "live" colour.
   The pulse runs half a beat behind the blue one so the two alternate. */
.jb-count-sep{ width:1px; height:0.9rem; background:var(--hair); flex:none; }
.jb-count b.jb-count-new{ color:var(--signal); animation-delay:1.3s; }
.jb-count b.jb-count-new::before{ background:var(--signal); box-shadow:0 0 0 3px rgba(255,255,255,0.18); }
.jb-new-flag{
  font-size:0.58rem; letter-spacing:0.16em; line-height:1.4;
  color:var(--void); background:var(--signal); border:1px solid var(--signal);
  padding:0.05rem 0.4rem;
  animation:jb-flash 1.1s steps(1,end) infinite;
}
@keyframes jb-flash{ 0%{opacity:1} 50%{opacity:0} }
.jb-list-wrap{ padding:clamp(1.5rem,4vh,2.5rem) var(--gut) clamp(3.5rem,9vh,6rem); }
.jb-list{ max-width:1440px; margin-inline:auto; border-top:var(--rule); }
.jb-job{
  display:grid; gap:0.35rem 1.5rem;
  grid-template-columns:1fr;
  padding:1.35rem 0.2rem;
  border-bottom:var(--rule);
  position:relative;
  transition:background .22s ease, padding-left .28s var(--ease);
}
@media (min-width:900px){
  .jb-job{ grid-template-columns:minmax(0,1.55fr) minmax(0,1fr) auto; align-items:center; }
}
.jb-job:hover{ background:var(--steel); padding-left:0.9rem; }
.jb-role{
  font-size:1.42rem; letter-spacing:0.04em; line-height:1.05; color:var(--ice);
  font-weight:500; margin:0; display:flex; align-items:baseline; gap:0.7rem; flex-wrap:wrap;
}
.jb-new{
  font-family:"IBM Plex Mono",monospace; font-size:0.55rem; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--live);
  border:1px solid var(--live-dim); background:var(--live-dim);
  padding:0.1rem 0.4rem; flex:none;  animation:blip 2.6s ease-in-out infinite;
  animation-delay:1.3s;   
}
.jb-meta{
  font-family:"IBM Plex Mono",monospace; font-size:0.63rem; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--dim); margin:0;
  display:flex; gap:0.55rem; flex-wrap:wrap;
}
.jb-meta span::after{ content:"·"; margin-left:0.55rem; color:var(--grey); opacity:.6; }
.jb-meta span:last-child::after{ content:""; }
.jb-where{
  font-family:"Barlow Condensed",sans-serif; text-transform:uppercase;
  letter-spacing:0.1em; font-size:1rem; color:var(--slate); margin:0;
}
.jb-rate{
  font-family:"Barlow Condensed",sans-serif; text-transform:uppercase;
  letter-spacing:0.06em; font-size:1rem; color:var(--ice);
  font-variant-numeric:tabular-nums; margin:0; white-space:nowrap;
}
.jb-go{
  justify-self:start; align-self:center;
  display:inline-flex; align-items:center; gap:0.5rem;
  font-family:"Barlow Condensed",sans-serif; text-transform:uppercase;
  font-size:0.8rem; letter-spacing:0.18em; color:var(--slate);
  border:1px solid var(--hair); padding:0.45rem 0.9rem;
  transition:border-color .2s ease, color .2s ease, background .2s ease;
}
@media (min-width:900px){ .jb-go{ justify-self:end; } }
.jb-job:hover .jb-go{ border-color:var(--live); color:var(--live); }
.jb-empty{
  border:1px dashed rgba(237,237,238,0.22);
  padding:clamp(2rem,6vw,3.4rem);
  text-align:center; margin-top:1.6rem;
}
.jb-empty svg{ width:64px; height:auto; color:var(--grey); opacity:.5; margin-bottom:1.1rem; }
.jb-empty h3{
  font-family:"Barlow Condensed",sans-serif; text-transform:uppercase; font-weight:400;
  font-size:1.7rem; letter-spacing:0.05em; margin:0 0 0.6rem;
}
.jb-empty p{ color:var(--slate); font-weight:300; max-width:44ch; margin:0 auto 1.6rem; font-size:0.95rem; }
.jb-close{ position:relative; overflow:hidden; text-align:center; padding:clamp(3.5rem,9vh,6rem) var(--gut); }
.jb-close::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(70% 90% at 50% 118%, rgba(255,255,255,0.10) 0%, transparent 62%),
    linear-gradient(180deg,#050607 0%,#090A0B 100%);
}
.jb-close .mc-section-label{ justify-content:center; }
.jb-close .rv, .jb-close .rv-wipe{ transform-origin:center; }
.jb-close h2{
  font-family:"Barlow Condensed",sans-serif; text-transform:uppercase; font-weight:300;
  font-size:clamp(2rem,5.2vw,4.2rem); line-height:0.9; margin:1.3rem 0 1.2rem; text-wrap:balance;
}
.jb-close h2 strong{ font-weight:600; }
.jb-close p{ color:var(--slate); max-width:46ch; margin:0 auto 2.2rem; font-weight:300; }
.jb-cta-row{ display:flex; flex-wrap:wrap; gap:0.9rem; justify-content:center; }
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; transition-delay:0s !important; }
  .tq-trace .tail, .tq-trace .head{ animation:none; stroke-dasharray:none; opacity:1; }
  .tq-trace .tail{ display:none; } .tq-trace .head{ stroke-width:7; } .tq-trace .track{ display:none; }
  [data-rv] .rv, [data-rv] .rv-wipe{ opacity:1; transform:none !important; clip-path:none; }
  .jb-count b, .jb-new, .jb-new-flag{ animation:none; opacity:1; }
}
/* ---------- WordPress additions ----------
   The design filtered in the browser; the board filters on the server, so
   Clear is a link and the list gains page numbers once it passes 20 roles. */
.jb-filter-row a.jb-clear{ display:inline-flex; align-items:center; justify-content:center; }

.jb-pages{
  max-width:1440px; margin:2rem auto 0;
  display:flex; flex-wrap:wrap; gap:0.5rem; justify-content:center;
}
.jb-pages .page-numbers{
  font-family:"Barlow Condensed",sans-serif; text-transform:uppercase;
  font-size:0.8rem; letter-spacing:0.18em; color:var(--slate);
  border:1px solid var(--hair); padding:0.45rem 0.9rem; min-width:2.6rem; text-align:center;
  font-variant-numeric:tabular-nums;
  transition:border-color .2s ease, color .2s ease;
}
.jb-pages a.page-numbers:hover{ border-color:var(--live); color:var(--live); }
.jb-pages .page-numbers.current{ border-color:var(--ice); color:var(--ice); }
.jb-pages .page-numbers.dots{ border-color:transparent; }
