/* Articles redesign: cards, list page, article page. */
.ac,.ac-chip,.ac-cta,.art-toc,.art-end{--ac-o:#F97316;--ac-line:#dfe5ee}

/* ---------- list / category page ---------- */
.info-page{width:min(100%,1040px)}
.ac-tools{display:grid;gap:12px;margin:20px 0 0}
.ac-search{position:relative;display:flex;align-items:center;gap:10px;height:48px;padding:0 6px 0 16px;border:1px solid var(--ac-line,#dfe5ee);border-radius:14px;background:#fff;color:#9aa3b2}
.ac-search:focus-within{border-color:#F97316;box-shadow:0 0 0 3px rgba(249,115,22,.14)}
.ac-search svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ac-search input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;color:#1d1d1f;font:500 16px/1.2 var(--font-sans,inherit);-webkit-appearance:none;appearance:none}
.ac-search input::placeholder{color:#9aa3b2}
.ac-search input::-webkit-search-cancel-button{display:none}
.ac-search button{flex:none;width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:#6b7280;font-size:16px;cursor:pointer}
.ac-search button[hidden]{display:none}
.ac-chips{display:flex;gap:8px;overflow-x:auto;padding:0 0 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ac-chips::-webkit-scrollbar{display:none}
.ac-chip{flex:none;display:inline-flex;align-items:center;padding:10px 16px;border:1px solid var(--ac-line,#dfe5ee);border-radius:999px;background:#fff;color:#3f3f46;font-size:15px;font-weight:600;line-height:1.2;white-space:nowrap;text-decoration:none;-webkit-tap-highlight-color:transparent}
.ac-chip[aria-current="page"]{border-color:#F97316;background:#F97316;color:#fff}
.ac-chip:focus-visible{outline:3px solid rgba(249,115,22,.35);outline-offset:2px}
@media(hover:hover){.ac-chip:not([aria-current="page"]):hover{border-color:rgba(249,115,22,.5);color:#F97316}}
.ac-list{margin-top:22px}
.ac-feat{margin:0}
.ac-grid{display:grid;gap:16px;margin-top:16px}
.ac-feat+.ac-grid{margin-top:20px}
.ac-list>.info-empty{padding:28px 0}

/* ---------- card ---------- */
.ac{display:flex;flex-direction:column;overflow:hidden;border:1px solid #dfe5ee;border-radius:20px;background:#fff;color:#1d1d1f;text-decoration:none;box-shadow:0 6px 18px rgba(30,58,107,.06);transition:box-shadow .2s,transform .2s;-webkit-tap-highlight-color:transparent}
.ac__img{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#e9edf3}
.ac__img img{display:block;width:100%;height:100%;object-fit:cover}
.ac__img--ph{background:linear-gradient(135deg,#dbe4f3,#eef2f9)}
.ac__img--ph[data-cat="legalizatsiya"]{background:linear-gradient(135deg,#d9e3f5,#c6d4ee)}
.ac__img--ph[data-cat="robota"]{background:linear-gradient(135deg,#ffe6d2,#ffd2ae)}
.ac__img--ph[data-cat="zhyttya-v-polshchi"]{background:linear-gradient(135deg,#dff0e6,#c7e4d3)}
.ac__body{display:flex;flex:1;flex-direction:column;gap:8px;padding:16px 18px 18px}
.ac__cat{display:block;color:#F97316;font-size:13px;font-weight:700;letter-spacing:.05em;line-height:1.2;text-transform:uppercase}
.ac__title{display:block;margin:0;color:#1d1d1f;font-size:19px;font-weight:700;line-height:1.25;letter-spacing:-.2px}
.ac__desc{display:-webkit-box;margin:0;overflow:hidden;color:#4b4b51;font-size:15px;font-weight:400;line-height:1.5;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ac__meta{display:block;margin-top:auto;padding-top:4px;color:#6b7280;font-size:13px;line-height:1.3}
@media(hover:hover){.ac:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(30,58,107,.12)}}
.ac:focus-visible{outline:3px solid rgba(249,115,22,.55);outline-offset:3px}
.ac:active{transform:scale(.99)}
.ac--feat .ac__title{font-size:22px}

@media(min-width:700px){
  .ac-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ac-tools{grid-template-columns:minmax(0,1fr) 320px;align-items:center}
  .ac-tools .ac-chips{order:-1}
  .ac--feat{flex-direction:row}
  .ac--feat .ac__img{flex:0 0 52%;aspect-ratio:auto;min-height:300px}
  .ac--feat .ac__body{justify-content:center;padding:28px}
  .ac--feat .ac__title{font-size:28px}
}
@media(min-width:1000px){.ac-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- CTA (same look as vc-cta) ---------- */
.ac-cta{margin-top:48px;padding:32px 22px;border-radius:24px;background:#1E3A6B;color:#fff;text-align:center;box-shadow:0 2px 6px rgba(30,58,107,.16),0 14px 28px -6px rgba(30,58,107,.30)}
.ac-cta h2,html body #app-view .ac-cta h2{margin:0;color:#fff;font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.3px;text-align:center}
.ac-cta h2::after{content:"";display:block;width:44px;height:3px;margin:12px auto 0;border-radius:2px;background:#F97316}
.ac-cta p{max-width:34ch;margin:14px auto 0;color:#d6e0f2;font-size:15px;line-height:1.5}
.ac-cta__btns{display:flex;flex-direction:column;gap:12px;margin-top:24px}
.ac-btn,.ac-btn:visited{display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:14px;background:#F97316;color:#fff;font-size:16px;font-weight:700;line-height:1.2;text-decoration:none;box-shadow:0 3px 8px rgba(0,0,0,.22);-webkit-tap-highlight-color:transparent}
.ac-btn--ghost,.ac-btn--ghost:visited{background:rgba(255,255,255,.14);font-weight:600;box-shadow:none}
@media(min-width:700px){
  .ac-cta{margin-top:56px}
  .ac-cta h2,html body #app-view .ac-cta h2{font-size:28px}
  .ac-cta__btns{flex-direction:row;justify-content:center;gap:16px}
}
@media(min-width:900px){.ac-cta h2,html body #app-view .ac-cta h2{font-size:34px}}

/* ---------- article page ---------- */
.article-page .article-content{color:#27272a}
.art-crumbs{display:none;margin:0 0 14px;color:#6b7280;font-size:14px}
.art-crumbs a{color:inherit;text-decoration:none}
.art-crumbs a:hover{color:#F97316}
.art-crumbs span{margin:0 8px}
.art-cat,.art-cat:visited{display:block;margin:0;color:#F97316;font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;text-decoration:none}
.article-page .article-content h1{margin:8px 0 0;font-size:clamp(28px,7.5vw,40px);font-weight:700;line-height:1.12;letter-spacing:-.5px}
.art-meta{display:flex;flex-direction:column;gap:3px;margin:14px 0 0;color:#6b7280;font-size:14px;line-height:1.4}
.article-page .article-content .art-meta{margin:14px 0 0;color:#6b7280;font-size:14px;line-height:1.4}
.art-meta span:first-child{color:#1d1d1f;font-weight:600}
.art-cover{margin:20px 0 0;aspect-ratio:16/9;overflow:hidden;border-radius:22px;background:#e9edf3}
.art-cover img{display:block;width:100%;height:100%;object-fit:cover}
.art-toc{margin:22px 0 0;border:1px solid #dfe5ee;border-radius:18px;background:#fafbfc}
.art-toc summary{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;color:#1d1d1f;font-size:17px;font-weight:700;list-style:none;cursor:pointer}
.art-toc summary::-webkit-details-marker{display:none}
.art-toc summary::after{content:"";width:9px;height:9px;margin-right:4px;border-right:2px solid #F97316;border-bottom:2px solid #F97316;transform:rotate(-135deg);transition:transform .2s}
.art-toc:not([open]) summary::after{transform:rotate(45deg)}
.art-toc summary:focus-visible{outline:2px solid #F97316;outline-offset:2px;border-radius:12px}
.art-toc ol{display:grid;gap:8px;margin:0;padding:0 18px 16px 42px;font-size:15px;line-height:1.35}
.art-toc li::marker{color:#F97316;font-weight:700}
.article-page .article-content .art-toc a{color:#3f3f46;font-weight:400;text-decoration:none}
.article-page .article-content .art-toc a:hover{color:#F97316}

.article-page .article-content .art-body{margin-top:26px;color:#27272a;font-size:17px;line-height:1.7}
.article-page .article-content .art-body p{margin:0 0 16px;color:#27272a;font-size:inherit;line-height:inherit}
.article-page .article-content .art-body strong,.article-page .article-content .art-body b{color:#1d1d1f;font-weight:700}
html body #app-view .article-page .article-content .art-body h2{margin:38px 0 14px;color:#1d1d1f;font-size:24px;font-weight:700;line-height:1.25;letter-spacing:-.3px;scroll-margin-top:84px}
.article-page .article-content .art-body h2::after{content:"";display:block;width:36px;height:3px;margin-top:10px;border-radius:2px;background:#F97316}
.article-page .article-content .art-body h3{margin:26px 0 10px;color:#1d1d1f;font-size:19px;font-weight:700;line-height:1.3}
.article-page .article-content .art-body ul,.article-page .article-content .art-body ol{display:block;margin:0 0 18px;padding:0;list-style:none;color:inherit;font-size:inherit}
.article-page .article-content .art-body ul>li{position:relative;margin:0 0 9px;padding-left:24px}
.article-page .article-content .art-body ul>li::before{content:"";position:absolute;top:.65em;left:5px;width:7px;height:7px;border-radius:50%;background:#F97316}
.article-page .article-content .art-body ol{counter-reset:n}
.article-page .article-content .art-body ol>li{position:relative;margin:0 0 10px;padding-left:34px;counter-increment:n}
.article-page .article-content .art-body ol>li::before{content:counter(n);position:absolute;top:.1em;left:0;display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#fff7ed;color:#F97316;font-size:13px;font-weight:800;line-height:1}
.article-page .article-content .art-body a{color:#F97316;font-weight:600;text-decoration:none}
@media(hover:hover){.article-page .article-content .art-body a:hover{text-decoration:none;color:#EA580C}}

.art-end{margin:30px 0 0;padding:20px 22px;border-left:4px solid #F97316;border-radius:18px;background:#fff7ed}
.article-page .article-content .art-end p{margin:0;color:#27272a;font-size:16px;line-height:1.6}
.article-page .article-content .art-end p+p{margin-top:10px}
.article-page .article-content .art-end .art-end__q{color:#1d1d1f;font-weight:700}
.article-page .article-content .art-end a{color:#F97316;font-weight:600;text-decoration:none}
@media(hover:hover){.article-page .article-content .art-end a:hover{text-decoration:none;color:#EA580C}}

.article-related{margin-top:48px}
html body #app-view .article-related h2{margin:0;color:#1d1d1f;font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.3px}
.article-related h2::after{content:"";display:block;width:44px;height:3px;margin:12px 0 0;border-radius:2px;background:#F97316}
.article-related .ac-grid{margin-top:20px}
.article-page .ac-cta{margin-top:48px}
.article-page .article-content .ac-cta p{color:#d6e0f2;font-size:15px;line-height:1.5}
@media(min-width:700px){
  .art-crumbs{display:block}
  .article-page .article-content .art-body{font-size:18px}
  .art-toc ol{padding-left:46px}
  .article-related .ac-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:1000px){.article-page{width:min(100%,1040px)}.article-page .article-content>*:not(.article-related):not(.ac-cta):not(.push-entry){max-width:760px;margin-left:auto;margin-right:auto}.article-related .ac-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.ac{transition:none}}

/* ---------- home: article cards in the slider ---------- */
.hx-al{display:flex;gap:16px;max-width:none;margin:18px -20px 0;padding:4px 20px 14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:20px;scrollbar-width:none}
.hx-al::-webkit-scrollbar{display:none}
.hx-al .ac{flex:0 0 min(82%,320px);scroll-snap-align:start}
@media(min-width:620px) and (max-width:899px){.hx-al{margin:-22px -28px -34px;padding:30px 28px 52px;scroll-padding-inline:28px}.hx-al .ac{flex:0 0 clamp(250px,calc((100vw - 60px)/2.4),400px)}}
@media(min-width:900px){.hx-al{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:1000px;margin:0 auto;padding:0;overflow:visible}.hx-al .ac{flex:none}}
.article-page .article-content a.ac-btn,.article-page .article-content a.ac-btn:visited,.article-page .article-content a.ac-btn:hover{color:#fff;font-weight:700;text-decoration:none}
.article-page .article-content a.ac-btn--ghost{font-weight:600}
.article-page .article-content a.ac{color:#1d1d1f;font-weight:400}

.article-page .article-content .art-body li>ul,.article-page .article-content .art-body li>ol{margin:10px 0 0}
.article-page .article-content .art-body li>ol{counter-reset:n}
.article-page .article-content a.ac,.article-page .article-content a.ac:hover{text-decoration:none}
.article-page .article-content .art-end p+p{margin-top:26px}
.article-page .article-content .art-end{padding:22px 22px 24px}
/* card footer: date + arrow */
.ac__meta{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ac__go{flex:none;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#fff7ed;color:#F97316;transition:background .2s,color .2s,transform .2s}
.ac__go svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media(hover:hover){.ac:hover .ac__go{background:#F97316;color:#fff;transform:translateX(2px)}}
/* "Читайте також" as a link */
html body #app-view .article-related h2 a{color:inherit;text-decoration:none}
html body #app-view .article-related h2 a:hover{color:#F97316}
/* one heading size for block titles: same as "Підібрати вакансію?" */
html body #app-view :is(#home-push-title,.push-entry h3,.ac-cta h2,.article-related h2){font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.3px}
@media(min-width:700px){html body #app-view :is(#home-push-title,.push-entry h3,.ac-cta h2,.article-related h2){font-size:28px}}
@media(min-width:1024px){html body #app-view :is(#home-push-title,.push-entry h3,.ac-cta h2,.article-related h2){font-size:34px;letter-spacing:-.5px}}
/* home slider: wide cards like on the articles page */
@media(max-width:619px){.hx-al .ac{flex:0 0 calc(100vw - 64px)}}
/* links containing bold/italic text keep the link colour */
.article-page .article-content .art-body a,.article-page .article-content .art-body a:visited{color:#F97316}
.article-page .article-content .art-body a *,.article-page .article-content .art-body a strong,.article-page .article-content .art-body a b,.article-page .article-content .art-body a em{color:inherit;font-weight:inherit}
.kr-tips .ac-grid{margin-top:20px}
@media(min-width:1024px){.kr-tips .ac-grid{margin-top:28px}}
@media(min-width:1024px){html body .info-page{width:min(100%,1040px)}}
