/* ============================================================
   Ledige stillinger i Lister - listeside /jobb
   Portet fra designpakke (design_handoff_jobb_listeside).
   ALT scopet under .jpage for å unngå kollisjon med global CSS.
   ============================================================ */
/* ============================================================
   Ledige stillinger i Lister — listeside /jobb (delt stil)
   Brukes av begge retninger; resultatvisning styres av
   body.mode-grid / body.mode-list.
   ============================================================ */
.jpage{
  /* Alias til husets trinn. Skriften defineres kun i styles.css. */
  --bg:var(--color-cream); --paper:var(--color-warm-white); --sand:var(--color-sand-lys);
  --border:var(--color-sand);
  --ink:#1f2421; --muted:var(--tekst-dempet);
  --accent:var(--color-pine); --accent-deep:#2f4a3f;
  --gold:var(--aksent-tekst); --midnight:var(--color-midnight); --aurora:var(--color-aurora);
  --sec-offentlig:#6f93a3; --sec-privat:var(--color-gold);
}
.jpage *{box-sizing:border-box;}
.jpage, .jpage{margin:0;}

/* Global "html/body { overflow-x:hidden }" gjør <html> til scroll-container,
   som bryter position:sticky. Nøytraliser det på jobb-siden (ingen horisontal
   overflow her), så hero + filter faktisk kan klistre mot viewport. */
html:has(.jobb-page), body.jobb-page{overflow-x:visible;overflow-x:clip;}
.jpage{background:var(--bg);font-family:var(--font-body);color:var(--ink);-webkit-font-smoothing:antialiased;}
.jpage a{color:inherit;}
.jpage{--jkant:clamp(1.25rem,4vw,3.25rem);}
.jpage .wrap{max-width:1280px;margin:0 auto;padding:0 var(--jkant);}

/* ---------- topp / hero (full bredde, statisk — scroller bort) ---------- */
/* TOPPLUFTEN MAA KLARERE DEN FASTE HEADEREN.
 * .jpage starter paa dokumentets topp, og siden stripa ble fast (Header 2B)
 * laa de foerste 73 pikslene BAK den. Eyebrowen — «Ledige stillinger» paa
 * /jobb/, «Partnerbedrifter» paa /lister/partnere/ — stod paa y=42 og var
 * dermed usynlig paa begge, ogsaa i engelsk utgave. Seks sider deler denne
 * regelen, saa den rettes her.
 * Verdien er stripas hoeyde PLUSS ekte luft, ikke bare klaring: en tittel
 * som saavidt slipper under headeren leser fortsatt som om den henger i
 * den. */
.jpage .jhead{padding:calc(var(--nav-height) + clamp(2rem, 4vw, 3.4rem)) 0 clamp(1.3rem,2.2vw,1.9rem);background:var(--bg);}
.jpage .jhead__eyebrow{display:block;font-size: var(--etikett-liten);letter-spacing: var(--sperring-lg);text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:.85rem;}
.jpage .jhead__title{font-family:var(--font-display);font-weight: 400;font-size:clamp(2.3rem, 1.8423rem + 1.9531vw, 3.6rem);line-height: var(--linje-tett);letter-spacing: var(--sperring-tett);margin:0;color:var(--ink);}
.jpage .jhead__title em{font-style:italic;color:var(--accent);}
.jpage .jhead__lede{margin:1rem 0 0;max-width:60ch;line-height: var(--linje-brod-tett);color:var(--muted);font-size: var(--brod-liten);}
.jpage .jhead__intro{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(1.5rem,4vw,3.5rem);margin-top:1rem;flex-wrap:wrap;}
.jpage .jhead__intro .jhead__lede{margin-top:0;flex:1 1 32ch;max-width:54ch;}
.jpage .jhead__intro .jhead__cta{margin-top:0;flex:0 0 auto;}
.jpage .jhead__lede a{color:var(--accent);font-weight:700;text-decoration:none;}
.jpage .jhead__lede a:hover{text-decoration:underline;}
/* Lett, bordet kontakt-kort i sidens egne farger (ikke det tunge midnight-kortet) */
.jpage .jhead__cta{display:flex;width:fit-content;max-width:100%;align-items:center;gap:1.1rem;margin-top:1.7rem;padding:.8rem 1rem .8rem 1.3rem;background:var(--paper);border:1px solid var(--border);border-radius:14px;text-decoration:none;
  transition:border-color .25s ease,box-shadow .25s ease;}
.jpage .jhead__cta:hover{border-color:var(--accent);box-shadow:0 10px 26px -20px rgba(10,22,40,.4);}
.jpage .jhead__cta__mark{flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(61,90,78,.14);}
.jpage .jhead__cta__body{display:flex;flex-direction:column;gap:.18rem;}
.jpage .jhead__cta__eyebrow{font-size: var(--etikett-liten);letter-spacing: var(--sperring-lg);text-transform:uppercase;font-weight:700;color:var(--accent);}
.jpage .jhead__cta__text{font-family:var(--font-display);font-size: var(--text-base);line-height: var(--linje-tittel);color:var(--ink);}
.jpage .jhead__cta__btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;background:var(--accent);color:var(--color-text-inverse);font-family:var(--font-body);font-size: var(--etikett);font-weight:700;letter-spacing: var(--sperring-2xs);padding:.62rem 1.15rem;border-radius:999px;transition:gap .25s ease,filter .25s ease;}
.jpage .jhead__cta:hover .jhead__cta__btn{gap:.7rem;filter:brightness(1.08);}
@media(max-width:560px){.jpage .jhead__cta{flex-wrap:wrap;gap:.8rem 1.1rem;}.jpage .jhead__cta__btn{width:100%;justify-content:center;}}

/* Kommunenes stillingssider: brødsmuler i eyebrowens sted, saa veien
   tilbake til kommunen staar der eyebrowen ellers ville staatt. */
.jpage .jhead__smuler{font-size: var(--etikett);color:var(--muted);margin-bottom:.85rem;}
.jpage .jhead__smuler a{color:inherit;text-decoration:none;}
.jpage .jhead__smuler a:hover{text-decoration:underline;}

/* Uten skript: en enkel lenkeliste, saa stillingene kan naas likevel.
   jobb-listeside.js erstatter den med den filtrerbare lista. */
.jpage .jreserve{list-style:none;margin:0;padding:0;border-top:1px solid var(--border);}
.jpage .jreserve li{padding:1rem 0;border-bottom:1px solid var(--border);font-size: var(--etikett-stor);color:var(--muted);}
.jpage .jreserve a{display:block;font-family:var(--font-display);font-size: var(--text-lg);line-height: var(--linje-tittel);color:var(--ink);}

/* Tittel og antall paa én linje. Antallet i toppen vises bare under 681 px,
   der verktoeylinja med telleren er borte (mobilgjennomgang, okt 2026). */
.jpage .jhead__linje{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem 1rem;}
.jpage .jhead__antall{display:none;margin:0;font-size: var(--etikett-stor);color:var(--muted);}
.jpage .jhead__antall b{font-weight:700;color:var(--ink);}

/* Kontaktkortet staar i lista etter fjerde treff, paa alle bredder. Foer
   laa det i toppen og skjoev lista ned under foerste skjerm paa telefon. */
.jpage .jlos{padding:.4rem 0;}
.jpage .jlos .jhead__cta{margin-top:0;}
.jpage .results.mode-grid .jlos{grid-column:1/-1;}
.jpage .results.mode-list .jlos{padding:1.2rem 0;border-bottom:1px solid var(--border);}

/* variant-bytter (kun for sammenligning i prototypen) */
.jpage .variant-switch{display:inline-flex;gap:.4rem;margin-top:1.6rem;padding:.3rem;background:var(--paper);border:1px solid var(--border);border-radius:999px;}
.jpage .variant-switch a{white-space:nowrap;font-size: var(--etikett);font-weight:700;text-decoration:none;color:var(--muted);padding:.45rem 1rem;border-radius:999px;transition:background .2s,color .2s;}
.jpage .variant-switch a.is-active{background:var(--accent);color:var(--color-text-inverse);}
.jpage .variant-switch a:not(.is-active):hover{color:var(--accent);}

/* ---------- slank verktøylinje (condense-on-scroll, sticky topp) ---------- */
.jpage{--jbar-h:60px;}
.jpage .jbar{background:var(--bg);border-top:1px solid var(--border);}
.jpage .jbar__inner{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.5rem;padding-top:.85rem;padding-bottom:.85rem;}
.jpage .jbar .rcount{margin:0;}
.jpage .jbar .modeswitch{margin-left:auto;margin-top:0;}
@media(min-width:881px){
  .jpage .jbar{position:sticky;top:0;z-index:30;}
  .jpage .jbar.is-stuck{border-bottom:1px solid var(--border);box-shadow:0 10px 20px -18px rgba(10,22,40,.55);}
}

/* ---------- layout ---------- */
.jpage .jlayout{display:grid;grid-template-columns:300px 1fr;gap:clamp(1.8rem,3.5vw,3.5rem);align-items:start;padding:clamp(1.3rem,2.5vw,2rem) 0 6rem;}
@media(max-width:880px){ .jpage .jlayout{grid-template-columns:1fr;gap:0;} }

/* ---------- soek over lista (alle bredder) ---------- */
.jpage .jsok{position:relative;margin-bottom:1rem;}
.jpage .jsok input{width:100%;height:48px;font:inherit;font-size: var(--text-base);padding:0 1rem 0 2.6rem;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--paper);color:var(--ink);}
.jpage .jsok input::placeholder{color:var(--muted);opacity:1;}
.jpage .jsok input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent);}
.jpage .jsok svg{position:absolute;left:.95rem;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted);pointer-events:none;}

/* ---------- sticky filterkolonne; fester seg rett under den slanke baren ---------- */
@media(min-width:881px){
  .jpage .filters{position:sticky;top:calc(var(--jbar-h) + 1.3rem);align-self:start;
    max-height:calc(100vh - var(--jbar-h) - 2.5rem);overflow-y:auto;overflow-x:hidden;padding-right:.4rem;scrollbar-width:thin;}
}

/* ---------- sidefelt / filtre ---------- */
.jpage .filterbtn{display:none;}
.jpage .filters__head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:1.1rem;}
.jpage .filters__title{font-family:var(--font-display);font-size: clamp(1.25rem, 1.162rem + 0.3756vw, 1.5rem);font-weight: 700;margin:0;color:var(--ink);}
.jpage .filters__reset{font-size: var(--etikett);font-weight:700;color:var(--accent);background:none;border:0;cursor:pointer;font-family:inherit;padding:0;}
.jpage .filters__reset:hover{text-decoration:underline;}
.jpage .filters__reset[hidden]{display:none;}


.jpage .fgroup{border-top:1px solid var(--border);padding:1.05rem 0;}
.jpage .fgroup__legend{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:0;cursor:pointer;font-family:inherit;padding:0;
  font-size: var(--etikett-liten);letter-spacing: var(--sperring-md);text-transform:uppercase;font-weight:700;color:var(--ink);}
.jpage .fgroup__chev{transition:transform .25s ease;color:var(--muted);}
.jpage .fgroup.is-collapsed .fgroup__chev{transform:rotate(-90deg);}
.jpage .fgroup__body{display:grid;grid-template-rows:1fr;transition:grid-template-rows .34s cubic-bezier(.22,1,.36,1);}
.jpage .fgroup.is-collapsed .fgroup__body{grid-template-rows:0fr;}
.jpage .fgroup__inner{min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:.1rem;padding-top:.85rem;}
.jpage .fgroup__inner--scroll{max-height:240px;overflow-y:auto;padding-right:.3rem;scrollbar-width:thin;}
/* Skjul scrollbar(-piler) når gruppa er kollapset (0fr-raden gir 0 høyde). */
.jpage .fgroup.is-collapsed .fgroup__inner{overflow:hidden;}
.jpage .fgroup__mini{width:100%;font:inherit;font-size: var(--etikett);padding:.45rem .6rem;border:1px solid var(--border);border-radius:9px;background:var(--paper);margin-bottom:.5rem;}
.jpage .fgroup__mini:focus{outline:1.5px solid var(--accent);outline-offset:1px;}

.jpage .opt{display:flex;align-items:center;gap:.6rem;padding:.4rem .35rem;border-radius:8px;cursor:pointer;font-size: var(--etikett-stor);color:var(--ink);transition:background .15s;}
.jpage .opt:hover{background:var(--paper);}
.jpage .opt input{position:absolute;opacity:0;width:0;height:0;}
.jpage .opt__box{flex:0 0 auto;width:17px;height:17px;border:1.5px solid var(--border);border-radius:5px;background:var(--paper);display:grid;place-items:center;transition:background .15s,border-color .15s;}
.jpage .opt__box svg{width:11px;height:11px;color:var(--color-text-inverse);opacity:0;transform:scale(.6);transition:opacity .15s,transform .15s;}
.jpage .opt input:checked + .opt__box{background:var(--accent);border-color:var(--accent);}
.jpage .opt input:checked + .opt__box svg{opacity:1;transform:scale(1);}
.jpage .opt input:focus-visible + .opt__box{outline:2px solid var(--accent);outline-offset:2px;}
.jpage .opt__label{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:.45rem;}
.jpage .opt__dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto;}
.jpage .dot--off{background:var(--sec-offentlig);} .jpage .dot--priv{background:var(--sec-privat);}
.jpage .opt__n{color:var(--muted);font-size: var(--etikett);font-variant-numeric:tabular-nums;}
.jpage .opt__txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* ---------- resultat-topp: teller + sortering + aktive chips ---------- */
.jpage .rtop{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.5rem;margin-top:1.3rem;padding-top:1.2rem;border-top:1px solid var(--border);}
.jpage .rcount{font-size: var(--text-sm);color:var(--ink);}
.jpage .rcount b{font-weight:700;}
.jpage .rcount .sub{color:var(--muted);font-size: var(--etikett-stor);margin-left:.5rem;}
.jpage .rsort{display:flex;align-items:center;gap:.5rem;font-size: var(--etikett);color:var(--muted);}
.jpage .rsort select{font:inherit;font-size: var(--etikett);padding:.4rem 1.8rem .4rem .6rem;border:1px solid var(--border);border-radius:9px;background:var(--paper) ;color:var(--ink);cursor:pointer;
  -webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7' fill='none' stroke='%235a635c' stroke-width='1.6'%3E%3Cpath d='M1 1.5L5 5.5L9 1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .6rem center;}

.jpage .chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;}
.jpage .chip{white-space:nowrap;}
.jpage .chips:empty{display:none;}
/* .legend og .lg-dot er fjernet 25. aug sammen med tegnforklaringen: den
   forklarte fargevasken paa kortene, og den vasken finnes ikke lenger. */
.jpage .chip{display:inline-flex;align-items:center;gap:.45rem;font-size: var(--etikett);font-weight: 700;color:var(--accent);background:var(--paper);border:1px solid var(--border);border-radius:999px;padding:.4rem .5rem .4rem .85rem;cursor:pointer;transition:border-color .2s,background .2s;}
.jpage .chip:hover{border-color:var(--accent);background:var(--color-cream);}
.jpage .chip__x{display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:rgba(61,90,78,.12);}
.jpage .chip__x svg{width:8px;height:8px;}
.jpage .chip--clear{color:var(--muted);background:none;border-color:transparent;font-weight:700;}
.jpage .chip--clear:hover{color:var(--accent);background:none;}

/* ---------- kommune-seksjoner (redaksjonell rytme) ---------- */
.jpage .jgroup{margin-bottom:clamp(2.4rem,4vw,3.6rem);}
.jpage .jgroup__more{margin-top:1.4rem;font:inherit;font-weight:700;font-size: var(--etikett);color:var(--accent);background:var(--paper);border:1px solid var(--border);border-radius:999px;padding:.7rem 1.5rem;cursor:pointer;transition:border-color .2s;}
.jpage .jgroup__more:hover{border-color:var(--accent);}
.jpage .jgroup .results.mode-list{border-top:0;}

/* ---------- kommune-kapittelband (kinematisk) ---------- */
.jpage .jband{position:relative;overflow:hidden;border-radius:16px;min-height:clamp(150px,19vw,212px);display:flex;align-items:flex-end;margin-bottom:1.3rem;background:var(--midnight);isolation:isolate;}
.jpage .jband__media{position:absolute;inset:0;z-index:-2;}
.jpage .jband__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.92) contrast(1.02);transition:transform 1.6s cubic-bezier(.22,1,.36,1);}
.jpage .jgroup:hover .jband__media img{transform:scale(1.04);}
.jpage .jband__veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(8deg,rgba(8,18,32,.95) 0%,rgba(8,18,32,.72) 40%,rgba(8,18,32,.2) 76%,rgba(8,18,32,.3) 100%);}
.jpage .jband__text{padding:clamp(1.3rem,2.4vw,2rem) clamp(1.5rem,3vw,2.4rem);color:var(--color-text-inverse);}
.jpage .jband__pin{display:block;width:8px;height:8px;border-radius:50%;background:var(--aurora);box-shadow:0 0 0 4px rgba(125,211,192,.22);margin-bottom:.75rem;}
.jpage .jband__name{font-family:var(--font-display);font-weight: 400;font-size:clamp(2.2rem, 1.7423rem + 1.9531vw, 3.5rem);line-height: var(--linje-tett);letter-spacing: var(--sperring-tett);margin:0;color:var(--surface-card-light);}
.jpage .jband__count{display:block;font-size: var(--etikett-liten);letter-spacing: var(--sperring-lg);text-transform:uppercase;font-weight:700;color:color-mix(in srgb, var(--aurora), var(--color-warm-white) 60%);margin-top:.55rem;}
.jpage .jband__link{display:inline-flex;align-items:center;gap:.4rem;width:fit-content;margin-top:1rem;font-family:var(--font-body);font-size: var(--etikett);font-weight:700;color:var(--surface-card-light);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:2px;transition:color .2s ease,border-color .2s ease,gap .2s ease;}
.jpage .jband__link:hover{color:var(--aurora);border-color:var(--aurora);gap:.6rem;}

/* ---------- resultater: GRID (rolige kort) ----------
 *
 * OMSKREVET 25. aug. Foer farget heltid/deltid HELE kortet — krem mot
 * blaagraa — og hover snudde flata til massiv leire eller skifer.
 * Tre ting fulgte av det:
 *   · det sterkeste visuelle signalet paa sida laa paa den svakeste
 *     opplysningen, og rutenettet leste som et statustavle der noen kort
 *     var «valgt» eller «deaktivert»
 *   · fargen var opptatt, saa naere frister hadde ingenting igjen aa
 *     skille seg ut med
 *   · yrkeskoden stod i 700 versaler og overdoevet stillingstittelen
 *
 * Naa: én rolig flate for alle kort, omfanget som liten chip, og hover som
 * loefter framfor aa snu. Fargen er frigjort til fristen.
 */
.jpage .results.mode-grid{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));}

.jpage .jcard{position:relative;overflow:hidden;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--sand);border-radius:16px;padding:1.7rem 1.6rem 1.55rem;text-decoration:none;color:inherit;
  transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease,border-color .3s ease;}

/* Yrkeskoden er METADATA fra NAV, ikke et merkenavn. Normal vekt og dempet
   farge, saa tittelen under faar vaere det man leser foerst. Sperringen
   foelger husets versaletikett (--sperring-lg). */
.jpage .jcard__kicker{display:block;font-size: var(--etikett-liten);letter-spacing: var(--sperring-lg);text-transform:uppercase;font-weight:400;color:var(--muted);margin-bottom:.85rem;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;}

.jpage .jcard__title{font-family:var(--font-display);font-weight: 700;font-size: clamp(1.2312rem, 1.1506rem + 0.3437vw, 1.46rem);line-height: var(--linje-tittel);letter-spacing: var(--sperring-tett);margin:0 0 .45rem;color:var(--ink);text-wrap:pretty;overflow-wrap:break-word;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
  /* Understreken tegnes paa hover — se under. Plassen holdes av her, saa
     tittelen ikke rykker naar den kommer. */
  text-decoration:underline;text-decoration-color:transparent;text-underline-offset:.18em;text-decoration-thickness:1px;
  transition:text-decoration-color .25s ease;}

.jpage .jcard__employer{margin:0;font-size: var(--etikett-stor);line-height: var(--linje-etikett);color:var(--muted);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;}

.jpage .jcard__foot{margin-top:auto;padding-top:1.5rem;display:flex;flex-direction:column;gap:.5rem;}
.jpage .jcard__omfangsrad{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;}
.jpage .jcard__meta{font-size: var(--etikett);color:var(--muted);}

/* Chipen baerer heltid/deltid. Prikken gjentar fargen i tegnforklaringen
   over lista, saa de to leser som samme system. */
.jpage .jcard__chip{display:inline-flex;align-items:center;gap:.4rem;font-size: var(--etikett-liten);letter-spacing: var(--sperring-xs);text-transform:uppercase;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:.18rem .55rem;white-space:nowrap;}
.jpage .jcard__chip::before{content:"";width:6px;height:6px;border-radius:50%;flex:none;}
.jpage .jcard--heltid .jcard__chip::before{background:#875a48;}
.jpage .jcard--deltid .jcard__chip::before{background:#3e6a79;}

.jpage .jcard__due{font-size: var(--etikett);font-weight:700;color:var(--ink);}
.jpage .jcard__due .muted{font-weight:400;color:var(--muted);}
/* Naa som flata er rolig, er dette det ENESTE fargede paa kortet — og det
   er riktig sted: en frist som naermer seg. */
.jpage .jcard__due .soon{color:var(--gold);}

/* Pila kommer inn fra hoeyre paa hover. Den erstatter fargeflippen: samme
   «dette er klikkbart»-signal, uten aa male om kortet. */
.jpage .jcard::after{content:"→";position:absolute;top:1.55rem;right:1.6rem;font-size: var(--etikett-stor);line-height:1;color:var(--accent);opacity:0;transform:translateX(-6px);transition:opacity .25s ease,transform .25s cubic-bezier(.22,1,.36,1);}

.jpage .jcard:hover,
.jpage .jcard:focus-visible{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 18px 36px -22px rgba(10,22,40,.42);outline:none;}
.jpage .jcard:hover .jcard__title,
.jpage .jcard:focus-visible .jcard__title{text-decoration-color:var(--accent);}
.jpage .jcard:hover::after,
.jpage .jcard:focus-visible::after{opacity:1;transform:translateX(0);}
.jpage .jcard:focus-visible{box-shadow:0 0 0 2px var(--accent),0 18px 36px -22px rgba(10,22,40,.42);}

@media (prefers-reduced-motion: reduce){
  .jpage .jcard,
  .jpage .jcard::after,
  .jpage .jcard__title{transition:none;}
  .jpage .jcard:hover,
  .jpage .jcard:focus-visible{transform:none;}
}

/* ---------- resultater: LISTE (rader) ---------- */
.jpage .results.mode-list{border-top:1px solid var(--ink);}
.jpage .jrow{display:grid;grid-template-columns:12rem 1fr 11rem 9rem;gap:1.4rem;align-items:center;padding:1.4rem .85rem;border-bottom:1px solid var(--border);text-decoration:none;color:inherit;position:relative;transition:background .2s ease;}
.jpage .jrow::after{content:"";position:absolute;left:0;top:-1px;height:calc(100% + 1px);width:2px;background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform .25s cubic-bezier(.22,1,.36,1);}
.jpage .jrow:hover{background:var(--paper);}
.jpage .jrow:hover::after{transform:scaleY(1);}
.jpage .jrow__cat{display:flex;align-items:flex-start;gap:.5rem;font-size: var(--etikett-liten);letter-spacing: var(--sperring-sm);text-transform:uppercase;font-weight:700;color:var(--muted);line-height: var(--linje-etikett);}
.jpage .jrow__cat .opt__dot{margin-top:.3rem;box-shadow:0 0 0 3px rgba(0,0,0,.03);}
.jpage .jrow__main{min-width:0;}
.jpage .jrow__title{font-family:var(--font-display);font-weight: 400;font-size: clamp(1.25rem, 1.162rem + 0.3756vw, 1.5rem);line-height: var(--linje-display);letter-spacing: var(--sperring-tett);color:var(--ink);margin:0 0 .2rem;text-wrap:pretty;overflow-wrap:break-word;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.jpage .jrow:hover .jrow__title{color:var(--accent);}
.jpage .jrow__employer{font-size: var(--etikett);color:var(--muted);margin:0;}
.jpage .jrow__place{font-size: var(--etikett-stor);line-height: var(--linje-etikett);}
.jpage .jrow__place strong{font-weight:700;color:var(--ink);display:block;}
.jpage .jrow__place span{color:var(--muted);font-size: var(--etikett);}
.jpage .jrow__due{text-align:right;font-size: var(--etikett-stor);}
.jpage .jrow__due .d{font-weight:700;color:var(--ink);display:block;}
.jpage .jrow__due .dl{color:var(--muted);font-size: var(--etikett-liten);}
.jpage .jrow__arrow{display:inline-block;margin-top:.3rem;color:var(--accent);font-weight:700;opacity:0;transform:translateX(-4px);transition:opacity .22s,transform .22s;}
.jpage .jrow:hover .jrow__arrow{opacity:1;transform:translateX(0);}
@media(max-width:680px){
  .jpage .jrow{grid-template-columns:1fr;gap:.5rem;padding:1.3rem .4rem;}
  .jpage .jrow__due{text-align:left;}
}

/* frist snart (delt) */
.jpage .soon{display:inline-flex;align-items:center;gap:.4rem;color:var(--gold);font-weight:700;}
.jpage .soon::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(180,121,107,.16);}
.jpage .jrow__due .soon{justify-content:flex-end;}
@media(max-width:680px){ .jpage .jrow__due .soon{justify-content:flex-start;} }

/* sentinel / tom */
.jpage .empty{padding:3.5rem 1.5rem;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:16px;}
.jpage .empty strong{display:block;font-family:var(--font-display);font-size: clamp(1.2rem, 1.1296rem + 0.3005vw, 1.4rem);color:var(--ink);margin-bottom:.4rem;font-weight: 700;}
.jpage .empty button{margin-top:1rem;font:inherit;font-weight:700;color:var(--accent);background:none;border:0;cursor:pointer;text-decoration:underline;}

/* kilde-footer */
.jpage .jfoot{border-top:1px solid var(--border);padding:1.6rem 0 4rem;font-size: var(--etikett);color:var(--muted);}
.jpage .jfoot a{color:inherit;}

/* ---------- mobil: filterknapp i brikkeraden, filtre i ark ----------
 * Knappen er foerste brikke i raden med de valgte filtrene, og raden
 * scroller sidelengs. Arket er en modal dialog naar det er aapent
 * (jobb-listeside.js); lukket er det inert og usynlig, saa Tab aldri gaar
 * inn i et ark utenfor skjermen. Foten med «Vis {n} stillinger» staar fast
 * nederst, og bare kroppen scroller. */
@media(max-width:880px){
  .jpage .jrad{display:flex;align-items:center;gap:.5rem;overflow-x:auto;scrollbar-width:none;
    margin:0 calc(-1 * var(--jkant)) 1.1rem;padding:4px var(--jkant);}
  .jpage .jrad::-webkit-scrollbar{display:none;}
  .jpage .jrad .chips,
  .jpage .jrad .chips:empty{display:contents;}
  .jpage .jrad .chip{flex:none;min-height:44px;}
  .jpage .filterbtn{display:inline-flex;flex:none;align-items:center;gap:.5rem;min-height:44px;font:inherit;font-weight:700;font-size: var(--etikett-stor);color:var(--ink);background:var(--paper);border:1px solid var(--border);border-radius:var(--radius-full);padding:0 1.1rem;cursor:pointer;}
  .jpage .filterbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .jpage .filterbtn .n{background:var(--accent);color:var(--color-text-inverse);border-radius:999px;font-size: var(--etikett-liten);padding:.05rem .45rem;}
  .jpage .filters{position:fixed;inset:0;top:auto;z-index:50;background:var(--bg);border-top-left-radius:18px;border-top-right-radius:18px;
    display:flex;flex-direction:column;max-height:85vh;max-height:85dvh;overflow:hidden;padding:0;box-shadow:0 -20px 60px -20px rgba(10,22,40,.4);
    visibility:hidden;transform:translateY(100%);transition:transform .35s cubic-bezier(.22,1,.36,1),visibility 0s linear .35s;}
  .jpage .filters.is-open{visibility:visible;transform:translateY(0);transition-delay:0s;}
  /* Dragehaandtaket er pynt: det sier «ark», men arket lukkes med foten,
     Escape eller et trykk utenfor. */
  .jpage .filters__head{flex:none;margin:0;padding:1.6rem var(--jkant) .9rem;position:relative;}
  .jpage .filters__head::before{content:"";position:absolute;top:.6rem;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:999px;background:var(--border);}
  .jpage .filters__kropp{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 var(--jkant) 1rem;}
  .jpage .filters__fot{flex:none;padding:.8rem var(--jkant) calc(.8rem + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--bg);}
  .jpage .filters__done{display:block;width:100%;min-height:48px;margin:0;font:inherit;font-weight:700;background:var(--accent);color:var(--color-text-inverse);border:0;border-radius:var(--radius-md);padding:.9rem;cursor:pointer;}
  .jpage .filters__done:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
  .jpage .scrim{position:fixed;inset:0;background:rgba(10,22,40,.45);z-index:49;opacity:0;visibility:hidden;transition:opacity .3s;}
  .jpage .scrim.is-open{opacity:1;visibility:visible;}
  html.jfilter-aapen{overflow:hidden;}
}
@media(min-width:881px){ .jpage .filters__fot, .jpage .scrim{display:none;} }

/* ---------- smal skjerm: foerste stilling i foerste skjerm ----------
 * Telleren flytter opp ved tittelen, verktoeylinja og visningsveksleren
 * gaar bort (radvisning gjelder uansett), og kommunebaandet blir lavere. */
@media(max-width:680px){
  .jpage .jhead{padding-top:calc(var(--nav-height) + 1.25rem);padding-bottom:1rem;}
  .jpage .jhead__eyebrow{display:none;}
  .jpage .jhead__title{font-size: var(--text-3xl);}
  .jpage .jhead__antall{display:block;}
  .jpage .jhead__intro{margin-top:.6rem;}
  .jpage .jbar{display:none;}
  .jpage .jlayout{padding-top:.25rem;}
  .jpage .jband{min-height:0;margin-bottom:.6rem;}
  .jpage .jband__text{padding:1rem 1.15rem;}
  .jpage .jband__name{font-size: var(--text-3xl);}
  .jpage .jband__pin{display:none;}
  .jpage .jband__link{margin-top:.5rem;}
}

/* ---------- redusert bevegelse ---------- */
@media(prefers-reduced-motion:reduce){
  .jpage *, .jpage *::before, .jpage *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important;}
  .jpage .jcard:hover{transform:none;}
  .jpage .jgroup:hover .jband__media img{transform:none;}
  .jpage .jrow:hover::after{transform:scaleY(1);}
  .jpage .jhead__cta:hover{transform:none;}
  .jpage .jrow__arrow{opacity:1;transform:none;}
}

/* ---------- visningsveksler (kort / liste) — produksjons-UI ---------- */
.jpage .modeswitch{display:inline-flex;gap:.3rem;margin-top:1.1rem;padding:.3rem;background:var(--paper);border:1px solid var(--border);border-radius:999px;}
.jpage .modeswitch button{display:inline-flex;align-items:center;gap:.45rem;white-space:nowrap;font:inherit;font-size: var(--etikett);font-weight:700;cursor:pointer;color:var(--muted);background:none;border:0;padding:.45rem 1rem;border-radius:999px;transition:background .2s,color .2s;}
.jpage .modeswitch button svg{width:14px;height:14px;}
.jpage .modeswitch button.is-active{background:var(--accent);color:var(--color-text-inverse);}
.jpage .modeswitch button:not(.is-active):hover{color:var(--accent);}
.jpage .modeswitch button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* ---------- Partnerbedrifter (/lister/partnere/, /en/partners/) ----------
 * Gruppeoverskriftene foelger sidens eget idiom fra .jband: serif-navn i
 * display-stoerrelse, med antallet som en liten sperret versal UNDER — ikke
 * ved siden av. Foer dette var h2-en helt ustylet (.l-jobb__subtitle bor i
 * jobb.css og kommune-v2.css, som denne siden ikke laster), saa den falt
 * tilbake paa nettleserens fete sans ved siden av en kursiv serif.
 *
 * .jband bruker --aurora paa antallet. Det virker mot det moerke fotobaandet,
 * men mint mot krem gir under 2:1. --accent gir 6,62:1 mot --bg. */
.jpage .plist__group { margin-bottom: clamp(2.8rem, 5vw, 4.4rem); }

.jpage .plist__head {
  margin: 0 0 clamp(1.2rem, 2.2vw, 1.8rem);
  padding-bottom: clamp(.9rem, 1.6vw, 1.3rem);
  /* --border-soft (#ece5d8) forsvant helt mot --bg (#f4efe6) — maalt paa
   * skjerm var streken der, men ikke synlig. En strek som ikke sees gjoer
   * ingen jobb; --border (#e2dccf) skiller gruppene uten aa rope. */
  border-bottom: 1px solid var(--border);
}

.jpage .plist__name {
  font-family: var(--font-display);
  font-weight: 400;
  /* Litt mindre enn .jband__name (2.2-3.5rem): den staar én gang over et
   * fotobaand, denne gjentar seg fire ganger uten bilde til aa baere den. */
  font-size: clamp(1.9rem, 1.5831rem + 1.3521vw, 2.8rem);
  line-height: var(--linje-tett);
  letter-spacing: var(--sperring-tett);
  margin: 0;
  color: var(--ink);
}

.jpage .plist__count {
  display: block;
  margin-top: .55rem;
  font-family: var(--font-body);
  font-size: var(--etikett-liten);
  letter-spacing: var(--sperring-lg);
  text-transform: uppercase;
  font-weight: 700;
  color: var(--accent);
}