/* Pakadd Jobs — modern jobs portal styling */

:root {
  --pk-accent: #0f9d58;
  --pk-accent-dark: #0b7a44;
  --pk-ink: #10151b;
  --pk-body: #3f4a56;
  --pk-muted: #6b7785;
  --pk-line: #e6eaef;
  --pk-bg: #f6f8fa;
  --pk-card: #ffffff;
  --pk-warn: #b4530a;
  --pk-warn-bg: #fdf1e3;
  --pk-radius: 14px;
  --pk-shadow: 0 1px 2px rgba(16, 21, 27, 0.05), 0 12px 28px -18px rgba(16, 21, 27, 0.35);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--pk-bg);
  color: var(--pk-body);
  font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { color: var(--pk-ink); font-weight: 800; line-height: 1.2; margin: 0 0 .5em; letter-spacing: -0.02em; }
a { color: var(--pk-accent-dark); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }

.pk-wrap { width: min(1180px, 100% - 2rem); margin-inline: auto; }

.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.skip-link:focus { position: fixed; top: 8px; left: 8px; z-index: 999; background: #fff; padding: .5rem 1rem; width: auto; height: auto; clip: auto; }

/* ---------- Header ---------- */
.pk-header { position: sticky; top: 0; z-index: 50; background: var(--pk-card); border-bottom: 1px solid var(--pk-line); }
.pk-header.is-stuck { box-shadow: 0 8px 24px -20px rgba(16,21,27,.6); }
.pk-header__inner { display: flex; align-items: center; gap: 1.5rem; padding: .9rem 0; }

.pk-brand__text { display: flex; flex-direction: column; text-decoration: none; }
.pk-brand__mark { font-size: 1.35rem; font-weight: 800; color: var(--pk-ink); letter-spacing: -0.03em; }
.pk-brand__mark::first-letter { color: var(--pk-accent); }
.pk-brand__tag { font-size: .75rem; color: var(--pk-muted); }
.custom-logo { max-height: 48px; width: auto; }

.pk-nav { margin-left: auto; display: flex; align-items: center; gap: 1.25rem; }
.pk-nav__list { display: flex; gap: 1.1rem; list-style: none; margin: 0; padding: 0; }
.pk-nav__list a { color: var(--pk-ink); font-weight: 600; font-size: .95rem; padding: .35rem 0; border-bottom: 2px solid transparent; }
.pk-nav__list a:hover { color: var(--pk-accent); border-bottom-color: var(--pk-accent); text-decoration: none; }
.pk-nav__list .sub-menu { display: none; }

.pk-search { display: flex; align-items: center; background: var(--pk-bg); border: 1px solid var(--pk-line); border-radius: 999px; overflow: hidden; }
.pk-search input { border: 0; background: transparent; padding: .5rem .9rem; font: inherit; font-size: .9rem; outline: none; width: 170px; }
.pk-search button { border: 0; background: var(--pk-accent); color: #fff; font: inherit; font-weight: 700; font-size: .85rem; padding: .55rem 1rem; cursor: pointer; }
.pk-search button:hover { background: var(--pk-accent-dark); }

.pk-burger { display: none; flex-direction: column; gap: 4px; background: none; border: 0; padding: .4rem; cursor: pointer; margin-left: auto; }
.pk-burger span { display: block; width: 22px; height: 2px; background: var(--pk-ink); border-radius: 2px; }

.pk-catbar { background: var(--pk-ink); }
.pk-catbar__list { display: flex; flex-wrap: wrap; gap: .25rem 1.4rem; list-style: none; margin: 0; padding: .55rem 0; }
.pk-catbar__list a { color: #cfd6de; font-size: .82rem; font-weight: 600; letter-spacing: .01em; }
.pk-catbar__list a:hover { color: #fff; text-decoration: none; }

.pk-notice { background: var(--pk-warn-bg); color: var(--pk-warn); font-size: .9rem; }
.pk-notice .pk-wrap { padding: .7rem 0; }

/* ---------- Layout ---------- */
.pk-main { padding: 1.75rem 0 3rem; }
.pk-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1.75rem; align-items: start; }
.pk-grid__main { min-width: 0; display: grid; gap: 1.75rem; }

.pk-hero { padding: 0 0 .5rem; }
.pk-hero__kicker { text-transform: uppercase; letter-spacing: .16em; font-size: .72rem; font-weight: 700; color: var(--pk-accent); margin: 0 0 .4rem; }
.pk-hero__title { font-size: clamp(1.6rem, 3.2vw, 2.4rem); margin-bottom: .35rem; }
.pk-hero__sub { color: var(--pk-muted); margin: 0; max-width: 62ch; }

.pk-section-title { font-size: 1.25rem; margin-bottom: 1rem; }

/* ---------- Hot jobs ---------- */
.pk-hot { background: var(--pk-card); border: 1px solid var(--pk-line); border-radius: var(--pk-radius); box-shadow: var(--pk-shadow); overflow: hidden; }
.pk-hot__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--pk-line); }
.pk-hot__head h2 { margin: 0; font-size: 1.05rem; }
.pk-hot__pulse { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--pk-accent); background: color-mix(in srgb, var(--pk-accent) 12%, #fff); padding: .3rem .6rem; border-radius: 999px; }
.pk-hot__list { list-style: none; margin: 0; padding: 0; }
.pk-hot__item { display: flex; align-items: center; gap: 1rem; padding: .8rem 1.25rem; border-bottom: 1px solid var(--pk-line); }
.pk-hot__item:last-child { border-bottom: 0; }
.pk-hot__item:hover { background: var(--pk-bg); }
.pk-hot__link { flex: 1; color: var(--pk-ink); font-weight: 600; font-size: .95rem; }
.pk-hot__link:hover { color: var(--pk-accent-dark); }

.pk-btn { display: inline-flex; align-items: center; justify-content: center; background: var(--pk-accent); color: #fff; font-weight: 700; font-size: .82rem; padding: .45rem 1rem; border-radius: 999px; white-space: nowrap; }
.pk-btn:hover { background: var(--pk-accent-dark); color: #fff; text-decoration: none; }
.pk-btn--lg { font-size: 1rem; padding: .8rem 1.8rem; border-radius: 12px; }

/* ---------- Table ---------- */
.pk-table-card { background: var(--pk-card); border: 1px solid var(--pk-line); border-radius: var(--pk-radius); box-shadow: var(--pk-shadow); overflow: hidden; }
.pk-table-card__title { margin: 0; padding: 1.1rem 1.25rem; font-size: 1.05rem; background: var(--pk-ink); color: #fff; }
.pk-table-scroll { overflow-x: auto; }
.pk-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.pk-table th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--pk-muted); padding: .75rem 1.25rem; border-bottom: 1px solid var(--pk-line); background: var(--pk-bg); }
.pk-table td { padding: .8rem 1.25rem; border-bottom: 1px solid var(--pk-line); vertical-align: middle; }
.pk-table tr:last-child td { border-bottom: 0; }
.pk-table tbody tr:hover { background: var(--pk-bg); }
.pk-table__date, .pk-table__last { white-space: nowrap; color: var(--pk-muted); font-size: .85rem; }
.pk-table__title a { color: var(--pk-ink); font-weight: 600; }
.pk-table__title a:hover { color: var(--pk-accent-dark); }

.pk-chip { display: inline-block; background: color-mix(in srgb, var(--pk-accent) 12%, #fff); color: var(--pk-accent-dark); font-size: .72rem; font-weight: 700; padding: .2rem .6rem; border-radius: 999px; }
.pk-chip--warn { background: var(--pk-warn-bg); color: var(--pk-warn); }

/* ---------- Cards ---------- */
.pk-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.pk-card { background: var(--pk-card); border: 1px solid var(--pk-line); border-radius: var(--pk-radius); overflow: hidden; box-shadow: var(--pk-shadow); display: flex; flex-direction: column; transition: transform .18s ease, box-shadow .18s ease; }
.pk-card:hover { transform: translateY(-2px); box-shadow: 0 18px 36px -24px rgba(16,21,27,.5); }
.pk-card__media img { width: 100%; display: block; aspect-ratio: 16/10; object-fit: cover; }
.pk-card__body { padding: 1.1rem 1.25rem 1.25rem; display: flex; flex-direction: column; gap: .55rem; }
.pk-card__meta { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: .78rem; color: var(--pk-muted); }
.pk-card__title { font-size: 1.02rem; margin: 0; }
.pk-card__title a { color: var(--pk-ink); }
.pk-card__title a:hover { color: var(--pk-accent-dark); }
.pk-card__excerpt { margin: 0; font-size: .9rem; color: var(--pk-body); }
.pk-more { font-weight: 700; font-size: .85rem; margin-top: auto; }

/* ---------- Single ---------- */
.pk-single { background: var(--pk-card); border: 1px solid var(--pk-line); border-radius: var(--pk-radius); box-shadow: var(--pk-shadow); padding: 1.75rem; }
.pk-single__title { font-size: clamp(1.5rem, 3vw, 2.1rem); }
.pk-single__meta { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; font-size: .82rem; color: var(--pk-muted); margin-bottom: 1.25rem; }
.pk-single__media img { border-radius: 12px; }
.pk-single__content { font-size: 1.02rem; }
.pk-single__content h2 { font-size: 1.3rem; margin-top: 1.6rem; }
.pk-single__content table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
.pk-single__content table th, .pk-single__content table td { border: 1px solid var(--pk-line); padding: .6rem .8rem; text-align: left; }
.pk-single__content blockquote { border-left: 3px solid var(--pk-accent); margin: 1.2rem 0; padding: .3rem 0 .3rem 1rem; color: var(--pk-muted); }
.pk-single__apply { margin-top: 1.5rem; }
.pk-single__foot { margin-top: 2rem; border-top: 1px solid var(--pk-line); padding-top: 1rem; }
.pk-postnav { display: flex; justify-content: space-between; gap: 1rem; font-size: .9rem; font-weight: 600; }

/* ---------- Sidebar / widgets ---------- */
.pk-grid__side { display: grid; gap: 1.25rem; position: sticky; top: 110px; }
.widget { background: var(--pk-card); border: 1px solid var(--pk-line); border-radius: var(--pk-radius); padding: 1.15rem 1.25rem; box-shadow: var(--pk-shadow); }
.widget-title { font-size: .95rem; text-transform: uppercase; letter-spacing: .08em; margin-bottom: .8rem; }
.widget ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.widget ul li a { color: var(--pk-ink); font-size: .9rem; font-weight: 600; }
.widget ul li a:hover { color: var(--pk-accent-dark); }

/* ---------- Pagination / misc ---------- */
.pk-pagination .nav-links { display: flex; flex-wrap: wrap; gap: .4rem; }
.pk-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 .6rem; border-radius: 10px; background: var(--pk-card); border: 1px solid var(--pk-line); color: var(--pk-ink); font-weight: 700; font-size: .85rem; }
.pk-pagination .page-numbers.current, .pk-pagination .page-numbers:hover { background: var(--pk-accent); color: #fff; border-color: var(--pk-accent); text-decoration: none; }

.pk-404 { text-align: center; padding: 4rem 0; display: grid; gap: 1rem; justify-items: center; }
.pk-404 h1 { font-size: 4rem; margin: 0; }

.pk-comments { margin-top: 1.75rem; background: var(--pk-card); border: 1px solid var(--pk-line); border-radius: var(--pk-radius); padding: 1.5rem; }
.pk-comments input[type="text"], .pk-comments input[type="email"], .pk-comments input[type="url"], .pk-comments textarea { width: 100%; padding: .6rem .8rem; border: 1px solid var(--pk-line); border-radius: 10px; font: inherit; }
.pk-comments .submit { background: var(--pk-accent); color: #fff; border: 0; padding: .6rem 1.4rem; border-radius: 999px; font-weight: 700; cursor: pointer; }

/* ---------- Footer ---------- */
.pk-footer { background: var(--pk-ink); color: #aeb8c4; margin-top: 2rem; }
.pk-footer__widgets { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; padding: 2.5rem 0 1.5rem; }
.pk-footer .widget { background: transparent; border: 0; box-shadow: none; padding: 0; }
.pk-footer .widget-title { color: #fff; }
.pk-footer .widget ul li a { color: #56d38a; font-weight: 500; }
.pk-footer .widget ul li a:hover { color: #fff; }
.pk-footer__bar { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center; border-top: 1px solid rgba(255,255,255,.1); padding: 1.1rem 0; font-size: .85rem; }
.pk-footer__copy { margin: 0; }
.pk-footer__nav { display: flex; gap: 1rem; list-style: none; margin: 0; padding: 0; }
.pk-footer__nav a { color: #56d38a; }
.pk-footer__nav a:hover { color: #fff; }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
  .pk-grid { grid-template-columns: 1fr; }
  .pk-grid__side { position: static; }
}

@media (max-width: 760px) {
  .pk-burger { display: flex; }
  .pk-nav { display: none; width: 100%; order: 3; flex-direction: column; align-items: stretch; gap: .75rem; padding-bottom: .75rem; }
  .pk-nav.is-open { display: flex; }
  .pk-header__inner { flex-wrap: wrap; }
  .pk-nav__list { flex-direction: column; gap: .25rem; }
  .pk-nav__list a { display: block; padding: .5rem 0; border-bottom: 1px solid var(--pk-line); }
  .pk-search input { width: 100%; }
  .pk-search { width: 100%; }
  .pk-catbar__list { gap: .25rem 1rem; }
  .pk-single { padding: 1.25rem; }
}

/* Hot sticker + green apply bar */
.pk-hotmark {
  position: relative;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpolygon fill='%23e40613' points='50,2 59,20 78,14 75,34 94,40 81,55 94,70 75,76 78,96 59,90 50,108 41,90 22,96 25,76 6,70 19,55 6,40 25,34 22,14 41,20'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  animation: pk-blink 0.9s steps(1, end) infinite;
}
.pk-hotmark__star { display: none; }
.pk-hotmark__text {
  position: relative;
  color: #ffe600;
  font-weight: 800;
  font-size: .72rem;
  text-transform: capitalize;
  text-shadow: 0 1px 0 #7a0000;
  letter-spacing: .02em;
  line-height: 1;
}
@keyframes pk-blink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: .12; } }
@media (prefers-reduced-motion: reduce) { .pk-hotmark { animation: none; } }

.pk-hot__item { flex-wrap: wrap; }
.pk-hot__link { overflow-wrap: anywhere; word-break: break-word; }
.pk-btn--apply { background: var(--pk-accent); border-radius: 6px; padding: .55rem 1.2rem; letter-spacing: .01em; }
.pk-btn__icon { margin-right: .4rem; transform: rotate(-20deg); display: inline-block; }
@media (max-width: 640px) {
  .pk-hot__link { flex: 1 1 100%; order: 2; }
  .pk-btn--apply { flex: 1 1 100%; order: 3; }
}

/* Card text must never overflow its box */
.pk-card__body { min-width: 0; }
.pk-card__title,
.pk-card__excerpt,
.pk-card__title a {
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
  max-width: 100%;
}
.pk-card__meta > * { max-width: 100%; overflow-wrap: anywhere; }
.pk-table__title a { overflow-wrap: anywhere; }


/* About + disclaimer strip */
.pk-about { background: var(--pk-card); border-top: 3px solid var(--pk-accent); padding: 2rem 0 1.75rem; }
.pk-about__copy { margin: 1rem 0 0; text-align: center; font-size: .9rem; color: var(--pk-muted); }
.pk-about__text { margin: 0 0 1rem; font-size: .95rem; color: var(--pk-body); }
.pk-disclaimer { margin: 0; background: #fdf6dd; border: 1px solid #f0e2a8; border-radius: 8px; padding: .85rem 1rem; font-size: .92rem; color: #4a4326; }

/* Footer link columns */
.pk-footer__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem 2rem; padding: 2.5rem 0 1.5rem; }
@media (max-width: 900px) { .pk-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .pk-footer__cols { grid-template-columns: minmax(0, 1fr); } }
.pk-footer__coltitle { color: #fff; font-size: 1.05rem; margin: 0 0 .6rem; padding-bottom: .6rem; border-bottom: 1px solid rgba(255,255,255,.12); }
.pk-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.pk-footer__col a { color: #56d38a; font-size: .93rem; }
.pk-footer__col a:hover { color: #8ff0b6; }

/* ============ v2 overrides: dark-green bars, footer, hot sticker, text clipping ============ */
:root {
  --pk-dark: #0b3a22;      /* dark green replaces black strips */
  --pk-dark-2: #082c1a;    /* deeper green for bottom bar */
}

/* every black "patti" (strip/bar) becomes dark green */
.pk-catbar,
.pk-table-card__title,
.pk-footer { background: var(--pk-dark); }
.pk-burger span { background: var(--pk-dark); }

/* ---------- Footer (matches reference layout) ---------- */
.pk-footer { color: #b9c4cf; margin-top: 0; }
.pk-footer__cols { padding: 2.25rem 0 1.25rem; gap: 1.25rem 2.5rem; }
.pk-footer__coltitle {
  color: #fff; font-size: .95rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; margin: 0 0 .9rem; padding-bottom: .7rem;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.pk-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.pk-footer__col li { list-style: none; margin: 0; }
.pk-footer__col a { color: #c3ccd6; font-size: .98rem; font-weight: 400; }
.pk-footer__col a:hover { color: #fff; text-decoration: none; }

.pk-footer__bar {
  background: var(--pk-dark-2);
  border-top: 1px solid rgba(255,255,255,.08);
  margin-top: .5rem;
  padding: 0;
}
.pk-footer__barinner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 1rem; padding: .95rem 0;
}
.pk-footer__nav { display: flex; flex-wrap: wrap; gap: 0; list-style: none; margin: 0; padding: 0; }
.pk-footer__nav li { display: flex; align-items: center; }
.pk-footer__nav li + li::before { content: "|"; color: rgba(255,255,255,.3); margin: 0 .7rem; }
.pk-footer__nav a { color: #eaf3ee; font-size: 1rem; font-weight: 500; }
.pk-footer__nav a:hover { color: #fff; text-decoration: underline; }
.pk-footer__social { display: flex; align-items: center; gap: 1.15rem; }
.pk-footer__social a { color: #dfe8e2; display: inline-flex; }
.pk-footer__social a:hover { color: #fff; }
.pk-footer__social svg { width: 20px; height: 20px; fill: currentColor; display: block; }

/* rainbow strip under the footer, like the reference */
.pk-rainbow {
  height: 6px;
  background: linear-gradient(90deg,#c86dd7,#8e7bef,#4facfe,#43e97b,#f9d423,#fda085,#ff6a88,#a18cd1);
}

/* ---------- About strip ---------- */
.pk-about { border-top: 0; }
.pk-about__copy { color: #46525f; }

/* ---------- Hot sticker: real red blinking star ---------- */
.pk-hotmark {
  width: 52px; height: 52px;
  background-image: none !important;
  background-color: #e40613;
  clip-path: polygon(50% 0%, 61% 33%, 96% 33%, 68% 55%, 79% 89%, 50% 68%, 21% 89%, 32% 55%, 4% 33%, 39% 33%);
  animation: pk-hot-blink 1s steps(1, end) infinite;
}
.pk-hotmark__text {
  color: #fff; font-size: .68rem; font-weight: 800; text-transform: uppercase;
  text-shadow: none; margin-top: .45rem;
}
@keyframes pk-hot-blink {
  0%, 49%   { background-color: #e40613; }
  50%, 100% { background-color: #ffd400; }
}
@media (prefers-reduced-motion: reduce) {
  .pk-hotmark { animation: none; background-color: #e40613; }
}

/* ---------- Text must never spill outside its box ---------- */
.pk-card, .pk-hot, .pk-table-card, .pk-single, .widget { overflow: hidden; }
.pk-card, .pk-card__body, .pk-hot__item, .pk-grid__main, .pk-cards > * { min-width: 0; }
.pk-card__title, .pk-card__title a, .pk-card__excerpt, .pk-card__meta,
.pk-hot__link, .pk-table__title a, .widget ul li a, .pk-footer__col a {
  display: block;
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: none;
  white-space: normal;
}
.pk-card__meta { display: flex; }