/*
Theme Name: jobcards.in
Theme URI: https://jobcards.in/
Description: Child theme of Astra for jobcards.in. Header, footer, type and components for job card help pages.
Author: Kapil and team
Template: astra
Version: 1.0.0
Text Domain: jobcards
*/

/* One self-hosted font file for Latin text. Hindi text uses the phone's own Devanagari font, so nothing extra is downloaded. */
@font-face {
  font-family: "Anek Latin JC";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("assets/fonts/anek-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* colour */
  --ground: #F5F6FA;
  --surface: #FFFFFF;
  --ink: #14182B;
  --muted: #4D5470;
  --line: #D9DCE8;
  --line-strong: #8A90AB;
  --brand: #2238A8;
  --brand-deep: #16256E;
  --brand-tint: #E8EBFA;
  --on-brand: #FFFFFF;
  --haldi: #F2B300;
  --haldi-tint: #FFF3CC;
  --on-haldi: #14182B;
  /* job card status (semantic, separate from brand) */
  --ok: #136B40;
  --ok-tint: #DDF3E6;
  --idle: #4D5470;
  --idle-tint: #E9EBF2;
  --pending: #7A5200;
  --pending-tint: #FFEFC2;
  --stop: #A8231B;
  --stop-tint: #FBE1DE;

  /* type */
  --font: "Anek Latin JC", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: ui-monospace, "Roboto Mono", "Cascadia Mono", Consolas, monospace;

  /* space and shape */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px;
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px;
  --tap: 48px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font: 400 17px/1.6 var(--font);
  font-optical-sizing: auto;
}
img, svg { max-width: 100%; }
a { color: var(--brand); text-underline-offset: 3px; }
a:hover { color: var(--brand-deep); }
:focus-visible { outline: 3px solid var(--haldi); outline-offset: 2px; box-shadow: 0 0 0 5px var(--ink); border-radius: var(--r-sm); }

h1, h2, h3 { margin: 0; text-wrap: balance; letter-spacing: -0.005em; }
h1 { font-size: 30px; line-height: 1.14; font-weight: 800; }
h2 { font-size: 23px; line-height: 1.2; font-weight: 750; }
h3 { font-size: 19px; line-height: 1.3; font-weight: 700; }
p { margin: 0; }
.lead { font-size: 18px; color: var(--muted); }
.hi { color: var(--muted); }
.small { font-size: 14.5px; line-height: 1.5; color: var(--muted); }
.mono { font-family: var(--mono); font-size: 0.92em; letter-spacing: -0.01em; }

.wrap { max-width: 752px; margin-inline: auto; padding-inline: var(--s4); }
.stack { display: flex; flex-direction: column; gap: var(--s4); }
.stack--lg { gap: var(--s6); }
main { padding-block: var(--s5) var(--s7); }
section > h2 { margin-bottom: var(--s3); }

/* ---------- notice bar + header ---------- */
.notice-bar { background: var(--ink); color: #fff; font-size: 13.5px; line-height: 1.35; }
.notice-bar .wrap { padding-block: 7px; display: flex; gap: var(--s2); align-items: center; }
.notice-bar strong { font-weight: 650; }
.notice-bar a { color: #fff; }
.notice-bar .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--haldi); flex: none; }

.jc-header { background: var(--surface); border-bottom: 1px solid var(--line); }
.jc-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); padding-block: var(--s3); }
.jc-header .logo { display: block; line-height: 0; }
.jc-header .logo img { height: 36px; width: auto; }
.lang { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1.5px solid var(--line-strong); border-radius: 999px; color: var(--ink); text-decoration: none; font-weight: 600; font-size: 15px; }
.lang:hover { border-color: var(--brand); color: var(--brand); }

.jc-nav { background: var(--surface); border-bottom: 1px solid var(--line); }
.jc-nav ul { list-style: none; margin: 0 auto; padding: 0 var(--s4); max-width: 752px; display: flex; gap: var(--s5); overflow-x: auto; scrollbar-width: none; }
.jc-nav ul::-webkit-scrollbar { display: none; }
.jc-nav a { display: block; padding: 11px 0 9px; white-space: nowrap; color: var(--muted); text-decoration: none; font-weight: 600; font-size: 15.5px; border-bottom: 3px solid transparent; }
.jc-nav a:hover { color: var(--ink); }
.jc-nav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--haldi); }

.breadcrumb { font-size: 14.5px; color: var(--muted); }
.breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2px 6px; }
.breadcrumb li + li::before { content: "›"; margin-right: 6px; color: var(--line-strong); }
.breadcrumb a { color: var(--muted); }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--s2); min-height: var(--tap); padding: 0 var(--s5); border: 0; border-radius: var(--r-md); background: var(--brand); color: var(--on-brand); font: 700 17px/1 var(--font); text-decoration: none; cursor: pointer; }
.btn:hover { background: var(--brand-deep); color: var(--on-brand); }
.btn--haldi { background: var(--haldi); color: var(--on-haldi); }
.btn--haldi:hover { background: #FFC61A; color: var(--on-haldi); }
.btn--ghost { background: transparent; color: var(--brand); border: 1.5px solid var(--brand); }
.btn--ghost:hover { background: var(--brand-tint); color: var(--brand-deep); }
.btn--block { width: 100%; }
.btn[disabled] { background: var(--line-strong); color: var(--on-brand); cursor: not-allowed; }

/* ---------- the finder: state > district > block > panchayat ---------- */
.finder { background: var(--brand); color: var(--on-brand); border-radius: var(--r-lg); padding: var(--s5) var(--s4); display: flex; flex-direction: column; gap: var(--s4); }
.finder h2 { font-size: 21px; }
.finder__steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s3); }
.finder__step { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: var(--s3); align-items: start; }
.finder__num { width: 30px; height: 30px; margin-top: 25px; border-radius: 50%; border: 2px solid #C9D2F8; display: grid; place-items: center; font: 700 15px/1 var(--mono); color: #C9D2F8; }
.finder__step.is-done .finder__num { background: var(--haldi); border-color: var(--haldi); color: var(--on-haldi); }
.finder__step label { display: flex; justify-content: space-between; gap: var(--s2); font-size: 14.5px; font-weight: 600; margin-bottom: 3px; }
.finder__step label span { font-weight: 500; color: #C9D2F8; }
.field, .finder select { width: 100%; min-height: var(--tap); padding: 0 40px 0 14px; border: 1.5px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1.5 1.5 7 7l5.5-5.5' fill='none' stroke='%2314182B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center; color: var(--ink); font: 500 17px/1.2 var(--font); appearance: none; }
.finder select { border-color: transparent; }
.finder select:disabled { background-color: #C9D2F8; color: var(--muted); opacity: 1; }
.finder__foot { font-size: 14px; color: #C9D2F8; }
.finder__foot a { color: #fff; }

/* ---------- state list ---------- */
.rows { list-style: none; margin: 0; padding: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.rows > li + li { border-top: 1px solid var(--line); }
.rows--2 { display: grid; grid-template-columns: 1fr; }
.row-link { display: flex; align-items: center; gap: var(--s3); min-height: 60px; padding: var(--s2) var(--s4); color: var(--ink); text-decoration: none; }
.row-link:hover { background: var(--brand-tint); color: var(--ink); }
.row-link__text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.row-link__text b { font-weight: 650; }
.row-link__text span { font-size: 14.5px; color: var(--muted); }
.row-link::after { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--line-strong); border-top: 2px solid var(--line-strong); transform: rotate(45deg); flex: none; }
.code { flex: none; width: 40px; height: 40px; border-radius: var(--r-sm); background: var(--brand-tint); color: var(--brand-deep); display: grid; place-items: center; font: 700 14px/1 var(--mono); }
.icon { flex: none; width: 40px; height: 40px; border-radius: var(--r-sm); background: var(--haldi-tint); color: var(--ink); display: grid; place-items: center; }
.icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- ad slots: space is reserved so the page never jumps ---------- */
.ad { display: flex; flex-direction: column; align-items: center; gap: 6px; margin-block: var(--s2); }
.ad__label { font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.ad__box { width: 100%; max-width: 336px; min-height: 280px; background: var(--idle-tint); border-radius: var(--r-sm); display: grid; place-items: center; color: var(--muted); font: 500 13px/1.3 var(--mono); text-align: center; }
.ad--wide .ad__box { max-width: 728px; min-height: 100px; }

/* ---------- job card number anatomy ---------- */
.jcn { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s4); display: flex; flex-direction: column; gap: var(--s3); }
.jcn__number { font: 700 clamp(17px, 5.6vw, 26px)/1.2 var(--mono); letter-spacing: -0.02em; display: flex; flex-wrap: wrap; }
.jcn__number span { padding-bottom: 5px; border-bottom: 4px solid var(--c); }
.jcn__number i { font-style: normal; color: var(--line-strong); padding-inline: 1px; }
.jcn__key { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px var(--s4); font-size: 14.5px; line-height: 1.35; }
.jcn__key li { display: flex; gap: var(--s2); align-items: baseline; }
.jcn__key li::before { content: ""; flex: none; width: 14px; height: 4px; background: var(--c); transform: translateY(-3px); }
.jcn__key b { font-family: var(--mono); font-weight: 700; }
.c1 { --c: #2238A8; } .c2 { --c: #F2B300; } .c3 { --c: #136B40; } .c4 { --c: #A8231B; } .c5 { --c: #7A5200; } .c6 { --c: #14182B; }

/* ---------- callouts ---------- */
.callout { background: var(--haldi-tint); border-radius: var(--r-md); padding: var(--s4); display: flex; flex-direction: column; gap: 6px; }
.callout h3 { font-size: 18px; }
.callout--plain { background: var(--surface); border: 1px solid var(--line); }
.callout--sample { background: var(--stop-tint); font-size: 14.5px; line-height: 1.45; }

/* ---------- job card list ---------- */
.summary { display: grid; grid-template-columns: repeat(2, 1fr); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.summary div { padding: var(--s3) var(--s4); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.summary div:nth-child(2n) { border-right: 0; }
.summary div:nth-last-child(-n+2) { border-bottom: 0; }
.summary b { display: block; font: 800 26px/1.1 var(--font); font-variant-numeric: tabular-nums; }
.summary span { font-size: 14px; color: var(--muted); }

.searchbar { display: flex; flex-direction: column; gap: 4px; }
.searchbar label { font-weight: 600; font-size: 15px; display: flex; justify-content: space-between; gap: var(--s2); }
.searchbar label .hi { font-weight: 500; }
.searchbar input { width: 100%; min-height: var(--tap); padding: 0 14px; border: 1.5px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface); color: var(--ink); font: 500 17px/1.2 var(--font); }
.searchbar input::placeholder { color: var(--muted); }

.chips { display: flex; gap: var(--s2); overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.chips::-webkit-scrollbar { display: none; }
.chip { flex: none; min-height: 40px; padding: 0 14px; border: 1.5px solid var(--line-strong); border-radius: 999px; background: var(--surface); color: var(--ink); font: 600 15px/1 var(--font); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.chip b { font-family: var(--mono); font-weight: 500; font-size: 13px; opacity: 0.8; }

.jc-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--s3); align-items: center; padding: var(--s3) var(--s4); }
.jc-row__name { font-weight: 650; line-height: 1.3; }
.jc-row__no { grid-column: 1; color: var(--muted); font-family: var(--mono); font-size: 14px; letter-spacing: -0.02em; }
.jc-row .status { grid-row: 1 / span 2; grid-column: 2; }
.rows__empty { padding: var(--s5) var(--s4); color: var(--muted); text-align: center; }

.status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px 4px; border-radius: 999px; font-size: 13.5px; font-weight: 650; line-height: 1.2; white-space: nowrap; background: var(--bg); color: var(--fg); }
.status::before { content: ""; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--fg); flex: none; }
.status--ok { --bg: var(--ok-tint); --fg: var(--ok); }
.status--ok::before { background: var(--fg); }
.status--idle { --bg: var(--idle-tint); --fg: var(--idle); }
.status--pending { --bg: var(--pending-tint); --fg: var(--pending); }
.status--pending::before { background: linear-gradient(90deg, var(--fg) 50%, transparent 50%); }
.status--stop { --bg: var(--stop-tint); --fg: var(--stop); }
.status--stop::before { border-radius: 2px; background: var(--fg); }

.legend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s3); }
.legend li { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: var(--s3); align-items: start; font-size: 15.5px; line-height: 1.45; }

/* ---------- article ---------- */
.byline { font-size: 14.5px; color: var(--muted); display: flex; flex-wrap: wrap; gap: 2px var(--s3); }
.prose { display: flex; flex-direction: column; gap: var(--s4); }
.prose h2 { margin-top: var(--s4); }
.prose ul, .prose ol { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.facts { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.facts div { display: grid; grid-template-columns: 42% minmax(0, 1fr); gap: var(--s3); padding: 10px var(--s4); }
.facts div + div { border-top: 1px solid var(--line); }
.facts dt { color: var(--muted); font-size: 15px; }
.facts dd { margin: 0; font-weight: 600; }
.steps { list-style: none; counter-reset: step; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s4); }
.steps li { counter-increment: step; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: var(--s3); }
.steps li::before { content: counter(step); width: 34px; height: 34px; border-radius: 50%; background: var(--ink); color: #fff; display: grid; place-items: center; font: 700 15px/1 var(--mono); }
.steps b { display: block; font-weight: 700; }
.faq { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.faq details + details { border-top: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; padding: 14px var(--s4); font-weight: 650; display: flex; justify-content: space-between; gap: var(--s3); align-items: center; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font: 500 24px/1 var(--mono); color: var(--brand); flex: none; }
.faq details[open] summary::after { content: "–"; }
.faq details p { padding: 0 var(--s4) var(--s4); color: var(--muted); }
.sources { font-size: 15px; }
.sources ol { margin: var(--s2) 0 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; }

/* ---------- footer ---------- */
.jc-footer { background: var(--brand-deep); color: #DDE2FA; font-size: 15px; }
.jc-footer .wrap { padding-block: var(--s6); display: flex; flex-direction: column; gap: var(--s5); }
.jc-footer img { height: 34px; width: auto; }
.jc-footer a { color: #fff; }
.jc-footer .legal { border-top: 1px solid var(--brand); padding-top: var(--s4); font-size: 14px; line-height: 1.5; color: #C9D2F8; display: flex; flex-direction: column; gap: var(--s2); }

/* ---------- wider screens ---------- */
@media (min-width: 720px) {
  body { font-size: 18px; }
  h1 { font-size: 42px; }
  h2 { font-size: 27px; }
  .lead { font-size: 20px; }
  main { padding-block: var(--s6) 72px; }
  .finder { padding: var(--s6); }
  .finder__steps { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4) var(--s5); }
  .rows--2 { grid-template-columns: 1fr 1fr; }
  .rows--2 > li { border-top: 0; border-bottom: 1px solid var(--line); }
  .rows--2 > li:nth-child(odd) { border-right: 1px solid var(--line); }
  .summary { grid-template-columns: repeat(4, 1fr); }
  .summary div { border-bottom: 0; }
  .summary div:nth-child(2n) { border-right: 1px solid var(--line); }
  .summary div:last-child { border-right: 0; }
  .jcn__key { grid-template-columns: repeat(3, 1fr); }
}
@media (prefers-reduced-motion: no-preference) {
  .btn, .row-link, .chip { transition: background-color 0.12s, color 0.12s, border-color 0.12s; }
}

/* ---------- Astra integration: make the parent theme's content area follow the jobcards.in rules ---------- */
body, button, input, select, textarea { font-family: var(--font); }
body.jc-site, body { background: var(--ground); color: var(--ink); font-size: 17px; line-height: 1.6; }
.site-content .ast-container { display: block; max-width: 752px; padding-inline: var(--s4); }
#primary, .ast-separate-container #primary, .ast-plain-container #primary { width: 100%; margin: 0; padding: var(--s5) 0 var(--s7); }
.ast-separate-container .ast-article-single, .ast-separate-container .ast-article-post, .ast-article-single { background: transparent; padding: 0; margin: 0; border: 0; }
.entry-header { margin: 0 0 var(--s4); }
.entry-content h1, .entry-content h2, .entry-content h3, h1.entry-title, .entry-title { color: var(--ink); font-family: var(--font); letter-spacing: -0.005em; text-wrap: balance; margin: 0; }
.entry-content h1, h1.entry-title { font-size: 30px; line-height: 1.14; font-weight: 800; }
.entry-content h2 { font-size: 23px; line-height: 1.2; font-weight: 750; }
.entry-content h3 { font-size: 19px; line-height: 1.3; font-weight: 700; }
.entry-content p { margin: 0; }
.entry-content a { color: var(--brand); text-decoration: underline; text-underline-offset: 3px; }
.entry-content a:hover { color: var(--brand-deep); }
.entry-content a.btn, .entry-content a.row-link { text-decoration: none; }
.entry-content a.btn { color: var(--on-brand); }
.entry-content a.btn--haldi { color: var(--on-haldi); }
.entry-content a.row-link { color: var(--ink); }
.entry-content .finder h2, .entry-content .finder p, .entry-content .finder li { color: var(--on-brand); }
.entry-content .finder .finder__foot, .entry-content .finder .finder__foot a { color: #C9D2F8; }
.entry-content .finder .finder__foot a { color: #fff; }

/* flow: text pages read as prose, landing pages as sections */
.entry-content > * { margin-block: 0; }
.entry-content > * + * { margin-top: var(--s4); }
.entry-content > h2, .entry-content > * + h2 { margin-top: var(--s6); }
.entry-content > h3, .entry-content > * + h3 { margin-top: var(--s5); }
.entry-content > ul, .entry-content > ol { margin-left: 0; padding-left: 22px; }
.entry-content > ul li + li, .entry-content > ol li + li { margin-top: 6px; }
.entry-content > .jc-sec, .entry-content > * + .jc-sec, .entry-content > .jc-sec + * { margin-top: var(--s6); }
.jc-sec { display: flex; flex-direction: column; gap: var(--s3); }
.jc-sec > h2 { margin-bottom: 2px; }
.jc-sec > ul:not([class]), .jc-sec > ol:not([class]) { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.jc-hero { display: flex; flex-direction: column; gap: var(--s3); }
.entry-content .byline a { color: var(--muted); }

/* finder used as a launch pad to the official list */
.finder__steps--static { counter-reset: fs; }
.finder__steps--static li { display: grid; grid-template-columns: 30px minmax(0, 1fr); column-gap: var(--s3); align-items: center; min-height: 40px; font-weight: 600; }
.finder__steps--static li .finder__num { margin-top: 0; }
.finder__steps--static li span[lang] { font-weight: 500; color: #C9D2F8; margin-left: 6px; }

/* compare table: old scheme against new */
.jc-table-wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); }
.jc-table { width: 100%; border-collapse: collapse; font-size: 15.5px; line-height: 1.4; margin: 0; border: 0; }
.jc-table th, .jc-table td { padding: 10px var(--s3); text-align: left; vertical-align: top; border: 0; border-bottom: 1px solid var(--line); }
.jc-table tr:last-child th, .jc-table tr:last-child td { border-bottom: 0; }
.jc-table thead th { font-size: 14px; color: var(--muted); font-weight: 600; background: var(--ground); }
.jc-table tbody th { font-weight: 600; width: 34%; }

/* header and footer extras */
.jc-header__tag { display: none; margin: 0; color: var(--muted); font-size: 15px; }
.jc-nav .jc-menu, .jc-footer .jc-menu { list-style: none; }
.jc-footer .logo { line-height: 0; align-self: flex-start; }
.jc-footer__about { margin: 0; max-width: 46ch; color: #DDE2FA; }
.jc-footer__nav .jc-menu { margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2) var(--s4); }
.jc-footer__nav a { display: block; padding-block: 5px; color: #fff; text-decoration: none; }
.jc-footer__nav a:hover { text-decoration: underline; color: #fff; }
.jc-footer .legal p { margin: 0; }
.ast-scroll-top-icon, #ast-scroll-top { display: none !important; }

@media (min-width: 720px) {
  body.jc-site, body { font-size: 18px; }
  .entry-content h1, h1.entry-title { font-size: 42px; }
  .entry-content h2 { font-size: 27px; }
  #primary, .ast-separate-container #primary, .ast-plain-container #primary { padding: var(--s6) 0 72px; }
  .jc-header__tag { display: block; }
  .jc-footer__nav .jc-menu { grid-template-columns: repeat(3, 1fr); }
  .finder__steps--static { grid-template-columns: 1fr 1fr; }
}

/* Astra paints the page ground from a body class, so match its specificity */
body.ast-plain-container, body.ast-separate-container, body.ast-page-builder-template, body.ast-narrow-container { background-color: var(--ground); }
.byline { gap: 0 var(--s3); }