/* ==========================================================
   PlaisioJobs — pSEO pages  |  ΑΡΧΕΙΟ 5/5
   Ανέβασέ το στο: /wp-content/uploads/pj-css/pj-pseo.css
   ========================================================== */

.pj-pseo{
  --pj-accent:#0f5c5c;
  --pj-accent-soft:#e6f2f1;
  --pj-ink:#16211f;
  --pj-muted:#5d6b68;
  --pj-line:#dde4e2;
  --pj-bg:#f7faf9;
  --pj-radius:10px;

  color:var(--pj-ink);
  font-size:17px;
  line-height:1.7;
}

.pj-pseo h2{
  font-size:1.45rem;
  line-height:1.25;
  margin:2.6rem 0 1rem;
  padding-left:.75rem;
  border-left:4px solid var(--pj-accent);
}

.pj-pseo section:first-of-type h2{margin-top:1.8rem}

/* --- Intro --- */
.pj-lead p{font-size:1.08rem;margin:0 0 1rem}
.pj-lead p:first-child{font-size:1.15rem;color:var(--pj-ink)}

/* --- Πίνακας στοιχείων (signature element) --- */
.pj-facts__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:1px;
  margin:0;
  padding:0;
  background:var(--pj-line);
  border:1px solid var(--pj-line);
  border-radius:var(--pj-radius);
  overflow:hidden;
}
.pj-facts__grid > div{background:#fff;padding:.9rem 1.1rem}
.pj-facts dt{
  margin:0 0 .2rem;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--pj-muted);
  font-weight:600;
}
.pj-facts dd{margin:0;font-size:1.02rem;font-weight:500}
.pj-facts .pj-hl{color:var(--pj-accent);font-weight:700}
.pj-updated{
  margin:.7rem 0 0;
  font-size:.82rem;
  color:var(--pj-muted);
}

/* --- Λίστα αγγελιών --- */
.pj-jobs__list{display:grid;gap:.6rem}
.pj-job{
  display:grid;
  grid-template-columns:1fr auto;
  gap:.2rem 1rem;
  padding:.95rem 1.1rem;
  background:#fff;
  border:1px solid var(--pj-line);
  border-radius:var(--pj-radius);
  text-decoration:none;
  color:inherit;
  transition:border-color .15s ease, background .15s ease;
}
.pj-job:hover,
.pj-job:focus-visible{
  border-color:var(--pj-accent);
  background:var(--pj-accent-soft);
}
.pj-job:focus-visible{outline:2px solid var(--pj-accent);outline-offset:2px}
.pj-job__title{font-weight:650;line-height:1.35}
.pj-job__date{
  grid-column:2;grid-row:1;
  font-size:.78rem;color:var(--pj-muted);white-space:nowrap;
}
.pj-job__meta{
  grid-column:1/-1;
  display:flex;flex-wrap:wrap;gap:.35rem .9rem;
  font-size:.86rem;color:var(--pj-muted);
}
.pj-job__sal{color:var(--pj-accent);font-weight:600}

.pj-empty{
  padding:1.1rem 1.2rem;
  background:var(--pj-bg);
  border:1px dashed var(--pj-line);
  border-radius:var(--pj-radius);
  color:var(--pj-muted);
}

/* --- CTA --- */
.pj-cta{margin:1.4rem 0 0}
.pj-btn{
  display:inline-block;
  padding:.75rem 1.5rem;
  background:var(--pj-accent);
  color:#fff!important;
  border-radius:var(--pj-radius);
  font-weight:600;
  text-decoration:none;
}
.pj-btn:hover{filter:brightness(1.12)}
.pj-btn:focus-visible{outline:2px solid var(--pj-ink);outline-offset:2px}

/* --- USP --- */
.pj-usp ul{list-style:none;margin:0;padding:0}
.pj-usp li{
  position:relative;
  padding:.35rem 0 .35rem 1.6rem;
  margin:0;
}
.pj-usp li::before{
  content:"";
  position:absolute;left:.35rem;top:.95rem;
  width:7px;height:7px;
  background:var(--pj-accent);
  border-radius:50%;
}

/* --- FAQ --- */
.pj-faq details{
  border:1px solid var(--pj-line);
  border-radius:var(--pj-radius);
  margin:0 0 .5rem;
  background:#fff;
}
.pj-faq summary{
  cursor:pointer;
  padding:.85rem 1.1rem;
  font-weight:600;
  list-style:none;
}
.pj-faq summary::-webkit-details-marker{display:none}
.pj-faq summary::after{content:"+";float:right;color:var(--pj-accent);font-weight:700}
.pj-faq details[open] summary::after{content:"–"}
.pj-faq details > div{padding:0 1.1rem 1rem;color:var(--pj-muted)}
.pj-faq details > div p{margin:0 0 .7rem}

/* --- Σχετικές σελίδες --- */
.pj-related ul{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.5rem;
}
.pj-related a{
  display:block;padding:.7rem .95rem;
  background:var(--pj-bg);
  border:1px solid var(--pj-line);
  border-radius:var(--pj-radius);
  text-decoration:none;color:var(--pj-accent);font-weight:550;font-size:.95rem;
}
.pj-related a:hover{background:var(--pj-accent-soft)}

/* --- Mobile --- */
@media (max-width:600px){
  .pj-pseo{font-size:16px}
  .pj-pseo h2{font-size:1.25rem}
  .pj-job{grid-template-columns:1fr}
  .pj-job__date{grid-column:1;grid-row:auto}
}

@media (prefers-reduced-motion:reduce){
  .pj-job{transition:none}
}
