/* VidhiAagaz, v2 design system.
   Built on how academic publishers present themselves (Springer Nature, OUP, Cambridge, Sage,
   and our own journals.academyclrs.org header): white pages, one humanist sans for the
   interface, a serif only for reading text, a real grey scale, and colour taken from the
   brand mark alone. The VidhiAagaz mark is black, so the identity is black and white.
   Blue is used for hyperlinks only, as it is on every publisher's site. */

:root {
  --ink: #1b1b1b;          /* text */
  --ink-2: #3d3d3d;
  --mu: #5f5f5f;           /* secondary text */
  --fnt: #8a8a8a;          /* tertiary text, labels */
  --rule: #dcdcdc;
  --rule-2: #c4c4c4;
  --strip: #f4f4f4;        /* utility strip, panels */
  --card: #f8f8f8;
  --paper: #ffffff;
  /* One brand blue, used the way Springer uses its colour: at full strength only for links,
     buttons and rules; large surfaces carry pale tints of it with dark text on top, so any
     cover or logo placed on them looks right. */
  --brand: #0a5d9c;        /* links, buttons, rules */
  --brand-h: #084a7d;
  --tint: #eef6fc;         /* light sections */
  --tint-2: #d9eaf7;       /* masthead band, feature cards */
  --tint-line: #b6d4ec;    /* rules on tinted surfaces */
  --deep: #0a2c47;         /* footer only */
  --band: var(--tint-2);
  --link: var(--brand);
  --link-h: var(--brand-h);
  --sans: "Source Sans 3", "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
  --serif: "Source Serif 4", "Source Serif Pro", Georgia, serif;
  --w: 1200px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.55; }
img { max-width: 100%; display: block; }
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-h); text-decoration: underline; }
h1, h2, h3, h4, p, ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
.wrap { max-width: var(--w); margin: 0 auto; padding: 0 32px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---- utility strip ------------------------------------------------ */
.util { background: var(--strip); border-bottom: 1px solid var(--rule); font-size: 13px; color: var(--mu); }
.util .wrap { display: flex; justify-content: space-between; align-items: center; min-height: 34px; gap: 16px; }
.util-facts { display: flex; gap: 22px; flex-wrap: wrap; }
.util-facts b { color: var(--ink-2); font-weight: 600; }
.util-links { display: flex; gap: 20px; }
.util-links a { color: var(--ink-2); }

/* ---- header -------------------------------------------------------- */
.hdr { background: var(--paper); border-bottom: 1px solid var(--rule); }
.hdr .wrap { display: flex; align-items: center; gap: 32px; min-height: 84px; }
.hdr-logo img { height: 48px; width: auto; }
.search { flex: 1; display: flex; max-width: 560px; margin-left: auto; }
.search input { flex: 1; font: inherit; font-size: 15px; padding: 10px 14px; border: 1px solid var(--rule-2); border-right: 0; border-radius: 3px 0 0 3px; color: var(--ink); background: #fff; min-width: 0; }
.search input::placeholder { color: var(--fnt); }
.search button { font: inherit; font-weight: 600; font-size: 14px; padding: 0 18px; border: 1px solid var(--brand); background: var(--brand); color: #fff; border-radius: 0 3px 3px 0; cursor: pointer; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-family: var(--sans); font-weight: 600; font-size: 15px; line-height: 1.2; padding: 11px 20px; border-radius: 4px; border: 1px solid var(--brand); background: var(--brand); color: #fff; cursor: pointer; white-space: nowrap; }
.btn:hover { background: var(--brand-h); border-color: var(--brand-h); color: #fff; text-decoration: none; }
.btn-o { background: #fff; color: var(--brand); border-color: var(--brand); }
.btn-o:hover { background: var(--tint); color: var(--brand-h); }
.btn-w { background: var(--brand); color: #fff; border-color: var(--brand); }   /* primary on a tinted band */
.btn-w:hover { background: var(--brand-h); color: #fff; }
.btn-g { background: #fff; color: var(--brand); border-color: var(--brand); }   /* secondary on a tinted band */
.btn-g:hover { background: var(--tint); color: var(--brand-h); }

.nav { background: var(--paper); border-bottom: 1px solid var(--rule); }
.nav ul { display: flex; gap: 4px; }
.nav a { display: block; padding: 13px 14px; font-weight: 600; font-size: 15px; color: var(--ink); border-bottom: 3px solid transparent; }
.nav a:hover { text-decoration: none; border-bottom-color: var(--rule-2); }
.nav a.on { border-bottom-color: var(--brand); }
.nav ul li:first-child a { padding-left: 0; }

/* ---- breadcrumb ---------------------------------------------------- */
.crumb { font-size: 14px; color: var(--mu); padding: 16px 0; }
.crumb a { color: var(--mu); }
.crumb span { margin: 0 8px; color: var(--rule-2); }

/* ---- masthead band (book, journal) --------------------------------- */
.band { background: var(--band); color: var(--ink); border-bottom: 1px solid var(--tint-line); }
.band .wrap { display: grid; grid-template-columns: 196px 1fr; gap: 44px; padding-top: 40px; padding-bottom: 36px; align-items: start; }
.band-cover { background: #fff; box-shadow: 0 2px 10px rgba(10,44,71,.18); }
.band-cover img { width: 100%; height: auto; }
.band-kicker { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--brand); margin-bottom: 12px; }
.band h1 { font-size: 38px; line-height: 1.15; font-weight: 700; letter-spacing: -.005em; }
.band-sub { font-size: 21px; line-height: 1.35; color: var(--ink-2); margin-top: 10px; }
.band-eds { font-size: 16px; color: var(--ink-2); margin-top: 18px; }
.band-eds b { color: var(--ink); font-weight: 600; }
.band-btns { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; }
.facts { display: flex; flex-wrap: wrap; gap: 14px 40px; margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--tint-line); }
.facts dt { font-size: 13px; color: var(--mu); }
.facts dd { font-size: 16px; font-weight: 600; color: var(--ink); margin-top: 2px; }

/* ---- page body: main column + sidebar ------------------------------ */
.body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; padding: 40px 0 72px; }
.sec { margin-bottom: 44px; }
.sec-h { display: flex; align-items: center; gap: 16px; font-size: 14px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--mu); margin-bottom: 18px; }
.sec-h::after { content: ""; flex: 1; height: 1px; background: var(--rule); }
.read { font-family: var(--serif); font-size: 17px; line-height: 1.72; color: var(--ink); text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.read p + p { margin-top: 14px; }

/* table of contents */
.toc li { border-top: 1px solid var(--rule); padding: 18px 0; display: grid; grid-template-columns: 84px minmax(0,1fr) auto; gap: 6px 20px; }
.toc li:last-child { border-bottom: 1px solid var(--rule); }
.toc-no { font-size: 14px; color: var(--mu); padding-top: 2px; }
.toc-t { font-size: 18px; font-weight: 600; line-height: 1.3; }
.toc-t a { color: var(--ink); }
.toc-t a:hover { color: var(--link); }
.toc-a { font-size: 15px; color: var(--ink-2); margin-top: 4px; }
.toc-m { font-size: 14px; color: var(--mu); margin-top: 6px; display: flex; gap: 18px; flex-wrap: wrap; }
.toc-act { display: flex; flex-direction: column; gap: 8px; align-items: flex-end; }
.pdf { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--brand); border: 1px solid var(--brand); padding: 6px 12px; border-radius: 4px; white-space: nowrap; background: #fff; }
.pdf:hover { background: var(--tint); color: var(--brand-h); text-decoration: none; }
.oa { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ink-2); }
.oa::before { content: ""; width: 9px; height: 9px; border: 2px solid var(--ink-2); border-radius: 50%; }

/* people */
.people li { padding: 12px 0; border-top: 1px solid var(--rule); }
.people li:last-child { border-bottom: 1px solid var(--rule); }
.people b { font-weight: 600; font-size: 17px; display: block; }
.people span { font-size: 15px; color: var(--mu); }

/* ---- sidebar panels ------------------------------------------------ */
.panel { background: #fff; border: 1px solid var(--rule); border-radius: 6px; padding: 20px 22px; margin-bottom: 20px; }
.panel-h { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--fnt); margin-bottom: 12px; display: flex; align-items: center; gap: 12px; }
.panel-h::after { content: ""; flex: 1; height: 1px; background: var(--rule); }
.kv { font-size: 15px; }
.kv div { display: flex; justify-content: space-between; gap: 14px; padding: 9px 0; border-top: 1px solid var(--rule); }
.kv div:first-child { border-top: 0; padding-top: 2px; }
.kv dt { color: var(--mu); }
.kv dd { font-weight: 600; text-align: right; color: var(--ink); }
.kv dd.pending { font-weight: 400; color: var(--fnt); font-style: italic; }
.partners { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.partners img { height: 52px; width: auto; }
.cite { font-family: var(--serif); font-size: 15px; line-height: 1.6; background: var(--tint); border: 1px solid var(--tint-line); border-radius: 6px; padding: 12px 14px; }
.cite-btns { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.cite-btns a { font-size: 14px; font-weight: 600; color: var(--brand); border: 1px solid var(--brand); padding: 6px 12px; border-radius: 4px; background: #fff; }
.cite-btns a:hover { background: var(--tint); text-decoration: none; }
.licence { font-size: 14px; color: var(--ink-2); line-height: 1.55; }
.licence b { display: block; font-size: 15px; margin-bottom: 4px; color: var(--ink); }

/* ---- chapter page -------------------------------------------------- */
.ch-head { padding: 8px 0 30px; border-bottom: 1px solid var(--rule); }
.ch-kicker { display: flex; gap: 16px; align-items: center; font-size: 14px; color: var(--mu); margin-bottom: 12px; }
.ch-head h1 { font-size: 34px; line-height: 1.2; font-weight: 700; max-width: 900px; }
.ch-auth { font-size: 18px; margin-top: 16px; }
.ch-auth sup { font-size: 11px; color: var(--mu); margin-left: 1px; }
.ch-aff { font-size: 14px; color: var(--mu); margin-top: 8px; line-height: 1.6; }
.ch-aff sup { margin-right: 4px; }
.ch-in { font-size: 15px; color: var(--ink-2); margin-top: 16px; }
.ch-in a { color: var(--ink); font-style: italic; }
.ch-btns { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.ch-meta { display: flex; gap: 10px 32px; flex-wrap: wrap; font-size: 14px; color: var(--mu); margin-top: 20px; }
.ch-meta b { color: var(--ink); font-weight: 600; }
.kw { display: flex; flex-wrap: wrap; gap: 8px; }
.kw li { font-size: 14px; border: 1px solid var(--rule-2); padding: 5px 11px; border-radius: 3px; color: var(--ink-2); background: #fff; }
.side-book { display: grid; grid-template-columns: 76px 1fr; gap: 14px; align-items: start; }
.side-book img { border: 1px solid var(--rule); }
.side-book a { font-weight: 600; color: var(--ink); line-height: 1.3; display: block; }
.side-book span { font-size: 14px; color: var(--mu); display: block; margin-top: 4px; }
.side-toc li { border-top: 1px solid var(--rule); padding: 9px 0; font-size: 14.5px; line-height: 1.35; }
.side-toc li:first-child { border-top: 0; padding-top: 0; }
.side-toc a { color: var(--ink-2); }
.side-toc li.on a { color: var(--ink); font-weight: 600; }
.side-toc em { font-style: normal; color: var(--fnt); margin-right: 6px; }
.pn { display: flex; justify-content: space-between; gap: 20px; margin-top: 8px; font-size: 15px; }

/* ---- home ---------------------------------------------------------- */
.intro { background: var(--tint); border-bottom: 1px solid var(--tint-line); }
.intro .wrap { padding-top: 44px; padding-bottom: 44px; display: grid; grid-template-columns: minmax(0,1fr) 380px; gap: 56px; align-items: center; }
.intro h1 { font-size: 34px; line-height: 1.2; font-weight: 700; max-width: 640px; }
.intro p { font-size: 18px; color: var(--ink-2); margin-top: 14px; max-width: 640px; }
.intro-facts { background: #fff; border: 1px solid var(--tint-line); border-radius: 6px; padding: 18px 22px; }
.grid-j { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.jcard { display: grid; grid-template-columns: 120px 1fr; gap: 20px; border: 1px solid var(--rule); border-radius: 8px; padding: 22px; background: #fff; }
.jcard.feat { background: var(--tint-2); border-color: var(--tint-line); }
.jcover { aspect-ratio: 3/4; background: #fff; border: 1px solid var(--rule-2); padding: 10px; display: flex; flex-direction: column; justify-content: space-between; font-size: 11px; color: var(--mu); }
.jcover b { font-size: 13px; color: var(--ink); line-height: 1.25; }
.jcard h3 { font-size: 20px; line-height: 1.25; }
.jcard h3 a { color: var(--ink); }
.jcard p { font-size: 15px; color: var(--ink-2); margin-top: 6px; }
.jcard .kv { margin-top: 12px; font-size: 14px; }
.jcard-links { display: flex; gap: 16px; margin-top: 12px; font-size: 14px; font-weight: 600; }
.grid-b { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; }
.bcard img { width: 100%; aspect-ratio: 210/297; object-fit: cover; border: 1px solid var(--rule); background: var(--strip); }
.bcard a { color: var(--ink); }
.bcard h3 { font-size: 15.5px; line-height: 1.3; margin-top: 12px; font-weight: 600; }
.bcard p { font-size: 13.5px; color: var(--mu); margin-top: 4px; }
.cols3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.cols3 h3 { font-size: 18px; margin-bottom: 8px; }
.cols3 p { font-size: 15px; color: var(--ink-2); }
.cols3 a.more { display: inline-block; margin-top: 10px; font-weight: 600; font-size: 15px; }
.full { padding: 48px 0 8px; }

/* ---- footer -------------------------------------------------------- */
.ftr { background: var(--deep); color: #b9c7d4; font-size: 14.5px; margin-top: 24px; }
.ftr .wrap { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; padding-top: 48px; padding-bottom: 36px; }
.ftr img { height: 42px; width: auto; margin-bottom: 14px; }
.ftr h4 { color: #fff; font-size: 14px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 12px; }
.ftr li { margin: 7px 0; }
.ftr a { color: #dce7f1; }
.ftr a:hover { color: #fff; }
.ftr-base { border-top: 1px solid #1d4668; }
.ftr-base .wrap { display: flex; justify-content: space-between; gap: 20px; padding-top: 16px; padding-bottom: 20px; grid-template-columns: none; font-size: 13.5px; color: #93a9bd; }

/* ---- responsive ---------------------------------------------------- */
@media (max-width: 980px) {
  .body { grid-template-columns: 1fr; }
  .intro .wrap { grid-template-columns: 1fr; gap: 28px; }
  .grid-b { grid-template-columns: repeat(3, 1fr); }
  .grid-j { grid-template-columns: 1fr; }
  .ftr .wrap { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .wrap { padding: 0 18px; }
  .util-facts span:nth-child(n+2) { display: none; }
  .hdr .wrap { flex-wrap: wrap; gap: 12px; padding: 14px 18px; }
  .search { order: 3; max-width: none; width: 100%; margin: 0; }
  .nav ul { overflow-x: auto; }
  .nav a { padding: 12px 10px; font-size: 14.5px; white-space: nowrap; }
  .band .wrap { grid-template-columns: 110px 1fr; gap: 20px; padding-top: 24px; }
  .band h1 { font-size: 26px; }
  .band-sub { font-size: 17px; }
  .facts { grid-column: 1 / -1; gap: 12px 28px; }
  .band-btns { grid-column: 1 / -1; }
  .toc li { grid-template-columns: 1fr; }
  .toc-act { flex-direction: row; align-items: center; }
  .ch-head h1 { font-size: 26px; }
  .read { text-align: left; font-size: 16.5px; }      /* justified text opens rivers on a phone */
  .grid-b { grid-template-columns: repeat(2, 1fr); }
  .cols3 { grid-template-columns: 1fr; }
  .jcard { grid-template-columns: 90px 1fr; }
  .ftr .wrap { grid-template-columns: 1fr; }
  .ftr-base .wrap { flex-direction: column; }
}

/* ---- authenticity: indexing strip, recognition, institutions ----- */
.idx { background: #fff; border-bottom: 1px solid var(--rule); }
.idx .wrap { display: grid; grid-template-columns: 170px 1fr; gap: 10px 32px; align-items: center; padding-top: 26px; padding-bottom: 22px; }
.idx-l { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--mu); }
.idx-logos { display: flex; align-items: center; gap: 44px; flex-wrap: wrap; }
.idx-logos img { height: 40px; width: auto; object-fit: contain; }
.idx-n { grid-column: 2; font-size: 14px; color: var(--mu); }
.idx-mini { display: flex; gap: 18px; align-items: center; margin-top: 14px; }
.idx-mini img { height: 24px; width: auto; }
.recog { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.recog > div { background: var(--tint); border: 1px solid var(--tint-line); border-radius: 8px; padding: 20px 22px; }
.recog b { display: block; font-size: 22px; line-height: 1.2; color: var(--ink); }
.recog p { font-size: 15px; color: var(--ink-2); margin-top: 8px; }
.lead-s { font-size: 16.5px; color: var(--ink-2); margin: -4px 0 20px; max-width: 820px; }
.more { font-weight: 600; font-size: 15px; }
.inst { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
.inst img { height: 76px; width: 100%; object-fit: contain; background: #fff; border: 1px solid var(--rule); border-radius: 6px; padding: 12px 16px; }
.clrs { display: flex; justify-content: space-between; align-items: center; gap: 32px; background: var(--tint); border: 1px solid var(--tint-line); border-radius: 8px; padding: 28px 32px; }
.clrs h3 { font-size: 22px; line-height: 1.25; }
.clrs p { font-size: 15.5px; color: var(--ink-2); margin-top: 8px; max-width: 760px; }
.clrs .band-btns { margin-top: 0; flex-shrink: 0; }
.nb { border-top: 3px solid var(--brand); padding-top: 14px; }
.nb-k { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--brand); margin-bottom: 6px; }
.nb h3 a { color: var(--ink); }
.ftr-cred { border-top: 1px solid #1d4668; }
.ftr-cred .wrap { display: flex; flex-wrap: wrap; gap: 8px 28px; padding-top: 14px; padding-bottom: 14px; grid-template-columns: none; font-size: 13.5px; color: #cfdbe6; }
.ftr-base a { color: #b9c7d4; }
@media (max-width: 980px) { .recog { grid-template-columns: 1fr 1fr; } .inst { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) {
  .idx .wrap { grid-template-columns: 1fr; } .idx-n { grid-column: 1; } .idx-logos { gap: 22px; } .idx-logos img { height: 30px; }
  .recog { grid-template-columns: 1fr; } .inst { grid-template-columns: repeat(2, 1fr); }
  .clrs { flex-direction: column; align-items: flex-start; padding: 22px; }
}

/* ---- homepage section rhythm: full-width bands alternating white and tint ---- */
.blk { padding: 52px 0 56px; }
.blk.alt { background: var(--tint); border-top: 1px solid var(--tint-line); border-bottom: 1px solid var(--tint-line); }
.blk.alt2 { background: var(--tint-2); border-top: 1px solid var(--tint-line); border-bottom: 1px solid var(--tint-line); }
.blk.alt .sec-h::after, .blk.alt2 .sec-h::after { background: var(--tint-line); }
.blk.alt .recog > div { background: #fff; }
.cols3.cards > div { background: #fff; border: 1px solid var(--tint-line); border-radius: 8px; padding: 24px 24px 22px; display: flex; flex-direction: column; }
.cols3.cards p { flex: 1; }
.blk.alt2 .clrs { background: transparent; border: 0; padding: 0; border-radius: 0; }
.blk.alt2 .clrs .btn-o { background: #fff; }
.idx + .blk { border-top: 0; }
.inst { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; }
.inst img { width: calc((100% - 72px) / 5); }
@media (max-width: 980px) { .inst img { width: calc((100% - 36px) / 3); } }
@media (max-width: 720px) { .inst img { width: calc((100% - 18px) / 2); } }

/* institution tiles: every logo in the same frame; round seals sit larger, with the name beside them */
.inst .inst-t { width: calc((100% - 72px) / 5); height: 76px; background: #fff; border: 1px solid var(--rule); border-radius: 6px; padding: 10px 16px; display: flex; align-items: center; justify-content: center; }
.inst .inst-t img { width: 100%; height: 100%; object-fit: contain; border: 0; padding: 0; background: none; border-radius: 0; }
.inst .inst-t.seal { justify-content: flex-start; gap: 10px; padding: 8px 12px; }
.inst .inst-t.seal img { width: 56px; height: 56px; flex-shrink: 0; }
.inst .inst-t.seal span { font-size: 13px; line-height: 1.3; font-weight: 600; color: var(--ink-2); }
@media (max-width: 980px) { .inst .inst-t { width: calc((100% - 36px) / 3); } }
@media (max-width: 720px) { .inst .inst-t { width: calc((100% - 18px) / 2); } }

/* ==== inner pages ==================================================== */
.phero .wrap { grid-template-columns: minmax(0, 1fr); padding-top: 44px; padding-bottom: 40px; }
.phero .wrap > div { max-width: 880px; }
.phero h1 { font-size: 36px; }
.phero .band-sub { font-size: 19px; line-height: 1.5; }
.blk .sec-h em.sec-sub { font-style: normal; font-weight: 400; letter-spacing: .04em; text-transform: none; color: var(--fnt); font-size: 14px; }
.narrow { max-width: 820px; }
.split { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.split > aside .panel:last-child { margin-bottom: 0; }
.pull { margin: 22px 0 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--brand); font-size: 18px; color: var(--ink-2); font-style: italic; text-align: left; }
.sub-h { font-family: var(--sans); font-size: 17px; font-weight: 600; margin: 24px 0 10px; }
.read ol.plain { list-style: decimal; padding-left: 22px; margin: 0 0 14px; }
.read ol.plain li { margin: 6px 0; }
.read ul { list-style: disc; padding-left: 22px; margin: 12px 0; }
.read ul li { margin: 5px 0; }
.read h2 { font-family: var(--sans); font-size: 19px; font-weight: 600; margin: 30px 0 10px; color: var(--ink); text-align: left; }
.read h3 { font-family: var(--sans); font-size: 17px; font-weight: 600; margin: 24px 0 8px; text-align: left; }

/* numbered steps */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.steps li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 22px; background: #fff; border: 1px solid var(--rule); border-radius: 8px; }
.blk.alt .steps li { border-color: var(--tint-line); }
.st-n { font-size: 15px; font-weight: 700; color: var(--brand); border-top: 2px solid var(--brand); padding-top: 6px; height: fit-content; }
.steps h3 { font-size: 17px; margin-bottom: 6px; }
.steps p { font-size: 15px; color: var(--ink-2); }

/* FAQ */
.faq { max-width: 900px; }
.faq details { background: #fff; border: 1px solid var(--rule); border-radius: 6px; margin-bottom: 10px; }
.blk.alt .faq details { border-color: var(--tint-line); }
.faq summary { cursor: pointer; list-style: none; padding: 16px 48px 16px 20px; font-weight: 600; font-size: 16.5px; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 22px; top: 21px; width: 8px; height: 8px; border-right: 2px solid var(--brand); border-bottom: 2px solid var(--brand); transform: rotate(45deg); transition: transform .15s; }
.faq details[open] summary::after { transform: rotate(-135deg); top: 25px; }
.faq details p { padding: 0 20px 18px; font-size: 15.5px; color: var(--ink-2); max-width: 780px; }

/* timeline */
.tl { max-width: 900px; }
.tl li { display: grid; grid-template-columns: 150px 1fr; gap: 24px; padding: 20px 0; border-top: 1px solid var(--rule); }
.tl li:last-child { border-bottom: 1px solid var(--rule); }
.tl-d { font-weight: 700; color: var(--brand); font-size: 15px; padding-top: 2px; }
.tl h3 { font-size: 18px; margin-bottom: 4px; }
.tl p { font-size: 15.5px; color: var(--ink-2); }

/* credentials grid */
.creds { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.creds > div { background: #fff; border: 1px solid var(--tint-line); border-radius: 8px; padding: 20px 22px; }
.creds b { display: block; font-size: 18px; line-height: 1.25; }
.creds p { font-size: 14.5px; color: var(--ink-2); margin-top: 6px; }
.creds .idx-mini { flex-wrap: wrap; gap: 12px; }
.creds .idx-mini img { height: 20px; }
.cr-logo { height: 22px; width: auto; margin-top: 12px; }

/* journals page */
.jbig { display: grid; grid-template-columns: 190px 1fr; gap: 36px; padding: 30px; border: 1px solid var(--rule); border-radius: 10px; background: #fff; }
.jbig + .jbig { margin-top: 24px; }
.jbig.feat { background: var(--tint-2); border-color: var(--tint-line); }
.jcover.lg { padding: 14px; font-size: 12px; }
.jcover.lg b { font-size: 17px; }
.jbig h3 { font-size: 26px; line-height: 1.2; }
.jbig p { font-size: 16px; color: var(--ink-2); margin-top: 10px; max-width: 820px; }
.facts.dark { margin-top: 20px; padding-top: 16px; border-top-color: var(--tint-line); }
.jbig:not(.feat) .facts.dark { border-top-color: var(--rule); }
.idx-block .idx-logos { margin-bottom: 18px; }
.idx-block p { font-size: 15.5px; color: var(--ink-2); max-width: 820px; }

/* books */
.feature-book { display: grid; grid-template-columns: 200px 1fr; gap: 36px; align-items: start; }
.feature-book img { box-shadow: 0 2px 10px rgba(10,44,71,.18); }
.feature-book h3 { font-size: 26px; line-height: 1.2; }
.feature-book h3 a { color: var(--ink); }
.fb-sub { font-size: 18px; color: var(--ink-2); margin: 6px 0 14px; }
.feature-book p:not(.fb-sub) { font-size: 16px; color: var(--ink-2); max-width: 760px; }
.grid-b.g4 { grid-template-columns: repeat(4, 1fr); }

/* publish: ethics list */
.ethics { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; counter-reset: e; }
.ethics li { counter-increment: e; background: #fff; border: 1px solid var(--tint-line); border-radius: 8px; padding: 22px 24px 22px 64px; position: relative; }
.ethics li::before { content: counter(e); position: absolute; left: 22px; top: 21px; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--brand); color: var(--brand); font-weight: 700; font-size: 14px; display: flex; align-items: center; justify-content: center; }
.ethics h3 { font-size: 17px; margin-bottom: 6px; }
.ethics p { font-size: 15px; color: var(--ink-2); }

/* team */
.pgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.pcard { display: grid; grid-template-columns: 76px 1fr; gap: 16px; align-items: start; background: #fff; border: 1px solid var(--rule); border-radius: 8px; padding: 18px; }
.blk.alt .pcard { border-color: var(--tint-line); }
.pcard img, .pav { width: 76px; height: 76px; border-radius: 50%; object-fit: cover; object-position: top; }
.pav { background: var(--tint-2); color: var(--brand-h); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 22px; letter-spacing: .04em; }
.pcard b { display: block; font-size: 16.5px; line-height: 1.3; }
.pcard span { display: block; font-size: 14px; color: var(--mu); line-height: 1.45; margin-top: 3px; }
.pcard .role { color: var(--brand); font-weight: 600; font-size: 14.5px; }
.pcard .loc { color: var(--fnt); font-size: 13.5px; }

/* notebook */
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 30px; }
.chips span { font-size: 14px; font-weight: 600; padding: 7px 14px; border: 1px solid var(--rule-2); border-radius: 20px; color: var(--ink-2); background: #fff; }
.chips span.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.nb-d { font-size: 13.5px; color: var(--fnt); margin-top: 10px; }
form.sub { display: flex; flex-shrink: 0; }
form.sub input { font: inherit; font-size: 15px; padding: 10px 14px; border: 1px solid var(--rule-2); border-right: 0; border-radius: 4px 0 0 4px; min-width: 260px; }
form.sub .btn { border-radius: 0 4px 4px 0; }

/* events */
.events li { display: grid; grid-template-columns: 78px minmax(0, 1fr) 120px; gap: 24px; padding: 22px 0; border-top: 1px solid var(--rule); align-items: start; }
.events li:last-child { border-bottom: 1px solid var(--rule); }
.ev-d { text-align: center; border: 1px solid var(--tint-line); background: var(--tint); border-radius: 6px; padding: 8px 0; }
.ev-d b { display: block; font-size: 17px; color: var(--brand-h); text-transform: uppercase; letter-spacing: .06em; }
.ev-d span { font-size: 14px; color: var(--mu); }
.ev-k { font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--brand); margin-bottom: 4px; }
.events h3 { font-size: 19px; line-height: 1.3; }
.events h3 a { color: var(--ink); }
.events p { font-size: 15.5px; color: var(--ink-2); margin-top: 6px; max-width: 780px; }
.events li > div:last-child { text-align: right; }
.tag { display: inline-block; font-size: 13px; font-weight: 600; color: var(--ink-2); border: 1px solid var(--rule-2); border-radius: 3px; padding: 4px 10px; }

/* contact */
.cform { background: #fff; border: 1px solid var(--rule); border-radius: 8px; padding: 26px 28px; }
.cform h3 { font-size: 20px; margin-bottom: 16px; }
.cform label { display: block; font-size: 14px; font-weight: 600; color: var(--ink-2); margin-bottom: 14px; }
.cform input, .cform select, .cform textarea { display: block; width: 100%; margin-top: 6px; font: inherit; font-size: 15.5px; font-weight: 400; padding: 10px 12px; border: 1px solid var(--rule-2); border-radius: 4px; color: var(--ink); background: #fff; }
.cform input:focus, .cform select:focus, .cform textarea:focus, form.sub input:focus { outline: 2px solid var(--brand); outline-offset: -1px; border-color: var(--brand); }

/* fee */
.panel.qr { text-align: center; }
.panel.qr img { width: 100%; max-width: 280px; margin: 0 auto; }
.panel.qr p { font-size: 14px; color: var(--mu); margin-top: 10px; }

/* order */
.orders { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.orders li { display: grid; grid-template-columns: 70px 1fr auto; gap: 18px; align-items: center; background: #fff; border: 1px solid var(--rule); border-radius: 8px; padding: 14px 18px; }
.orders img { width: 70px; aspect-ratio: 210/297; object-fit: cover; border: 1px solid var(--rule); }
.orders h3 { font-size: 16.5px; line-height: 1.3; }
.orders p { font-size: 14.5px; color: var(--mu); margin-top: 4px; }

/* posts and policies */
.post { max-width: 820px; margin: 8px auto 64px; }
.post h1 { font-size: 34px; line-height: 1.2; margin: 6px 0 26px; }
.post .ch-kicker .nb-k { margin: 0; }
.post-body img { margin: 18px 0; border-radius: 4px; height: auto; }
.post-body a { word-break: break-word; }
.policy .read { text-align: left; }

@media (max-width: 980px) {
  .split { grid-template-columns: 1fr; gap: 28px; }
  .steps, .pgrid, .creds { grid-template-columns: 1fr 1fr; }
  .orders { grid-template-columns: 1fr; }
  .grid-b.g4 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .phero .wrap { padding-top: 28px; padding-bottom: 28px; }
  .phero h1 { font-size: 27px; }
  .phero .band-sub { font-size: 17px; }
  .steps, .pgrid, .creds, .ethics { grid-template-columns: 1fr; }
  .tl li { grid-template-columns: 1fr; gap: 4px; }
  .jbig { grid-template-columns: 1fr; padding: 20px; gap: 18px; }
  .feature-book { grid-template-columns: 1fr; gap: 18px; }
  .jbig .jcover.lg, .feature-book > a { width: 140px; }
  .jbig h3, .feature-book h3 { font-size: 22px; }
  .grid-b.g4 { grid-template-columns: repeat(2, 1fr); }
  .events li { grid-template-columns: 64px minmax(0, 1fr); gap: 16px; }
  .events li > div:last-child { grid-column: 2; text-align: left; }
  .orders li { grid-template-columns: 56px 1fr; }
  .orders img { width: 56px; }
  .orders .btn { grid-column: 1 / -1; }
  form.sub { width: 100%; }
  form.sub input { min-width: 0; flex: 1; }
  .post h1 { font-size: 26px; }
  .blk { padding: 40px 0 44px; }
}
.pgrid.g4 { grid-template-columns: repeat(4, 1fr); }
.pgrid.g4 .pcard { grid-template-columns: 1fr; }
@media (max-width: 980px) { .pgrid.g4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) { .pgrid.g4 { grid-template-columns: 1fr; } .pgrid.g4 .pcard { grid-template-columns: 76px 1fr; } }
@media (max-width: 720px) { .blk .sec-h em.sec-sub { display: none; } }

/* ==== WordPress build ================================================= */
/* the order popup (vidhiaagaz-book-orders plugin) reads the old theme's variables */
:root { --acc: var(--brand); --acc-d: var(--brand-h); --acc-m: var(--brand); --acc-ss: var(--tint); --navy: var(--brand); --navy-d: var(--brand-h); --navy-dd: var(--deep);
  --fb: var(--sans); --fd: var(--sans); --fs: var(--serif); --fm: var(--sans); --ink-f: var(--fnt); --ink-m: var(--mu); --paper-s: var(--strip); }
.vabo-modal #vabo-pay { box-shadow: none; }
.chips a { font-size: 14px; font-weight: 600; padding: 7px 14px; border: 1px solid var(--rule-2); border-radius: 20px; color: var(--ink-2); background: #fff; }
.chips a:hover { text-decoration: none; border-color: var(--brand); color: var(--brand); }
.chips a.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.note { border-radius: 6px; padding: 12px 14px; font-size: 15px; margin-bottom: 16px; }
.note.ok { background: #eaf6ee; border: 1px solid #b7dcc3; color: #1d5a33; }
.note.err { background: #fbeeee; border: 1px solid #e6c1c1; color: #7a2323; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.reader { border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; background: var(--strip); }
.reader iframe { display: block; width: 100%; height: 78vh; min-height: 520px; max-height: 900px; border: 0; }
.post-img img { width: 100%; height: auto; border-radius: 6px; margin-bottom: 24px; }
.post-by { font-size: 15px; color: var(--mu); margin-top: 28px; padding-top: 14px; border-top: 1px solid var(--rule); }
.post .ch-kicker .tag { margin-left: 4px; }
.results li { padding: 18px 0; border-top: 1px solid var(--rule); max-width: 860px; }
.results li:last-child { border-bottom: 1px solid var(--rule); }
.results h3 { font-size: 19px; line-height: 1.3; }
.results h3 a { color: var(--ink); }
.results p { font-size: 15.5px; color: var(--ink-2); margin-top: 6px; }
.orders h3 a { color: var(--ink); }
.band .band-cover img { aspect-ratio: auto; }
.read table { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 15px; margin: 16px 0; text-align: left; }
.read th, .read td { border: 1px solid var(--rule); padding: 8px 10px; vertical-align: top; }
.read th { background: var(--strip); }
.read ol { list-style: decimal; padding-left: 22px; margin: 12px 0; }
.read blockquote { margin: 18px 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--tint-line); color: var(--ink-2); }
@media (max-width: 720px) { .reader iframe { height: 70vh; min-height: 420px; } }

/* ---- order popup (vidhiaagaz-book-orders plugin) in the v2 design ---- */
.vabo-modal { font-family: var(--sans); color: var(--ink); background: #fff; border-color: var(--rule); border-radius: 10px; }
.vabo-head { background: var(--tint-2); color: var(--ink); border-bottom: 3px solid var(--brand); padding: 24px 64px 22px 30px; }
.vabo-eyebrow { font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: .12em; color: var(--brand); margin-bottom: 8px; }
.vabo-title { font-family: var(--sans); font-size: 24px; font-weight: 700; line-height: 1.25; color: var(--ink); }
.vabo-isbn { font-family: var(--sans); font-size: 14px; color: var(--mu); margin-top: 6px; }
.vabo-x { border-color: var(--tint-line); background: #fff; color: var(--ink); font-size: 18px; }
.vabo-x:hover { background: var(--tint); }
.vabo-body { gap: 32px; padding: 28px 30px 32px; }
.vabo-modal .va-form .va-field { display: block; margin-bottom: 16px; }
.vabo-modal .va-form .va-field.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 0; }
.vabo-modal .va-label { display: block; font-size: 14px; font-weight: 600; color: var(--ink-2); margin-bottom: 6px; }
.vabo-modal .va-label span, .vabo-modal .va-label em { font-weight: 400; color: var(--fnt); font-style: normal; }
.vabo-modal .va-input { display: block; width: 100%; box-sizing: border-box; font: inherit; font-size: 15.5px; padding: 10px 12px; border: 1px solid var(--rule-2); border-radius: 4px; background: #fff; color: var(--ink); }
.vabo-modal .va-input:focus { outline: 2px solid var(--brand); outline-offset: -1px; border-color: var(--brand); }
.vabo-modal #vabo-qty { max-width: 120px; }
.vabo-modal .va-btn { font-family: var(--sans); font-size: 15px; font-weight: 600; border-radius: 4px; }
.vabo-modal .va-btn-p { background: var(--brand); color: #fff; border-color: var(--brand); }
.vabo-modal .va-btn-p:hover { background: var(--brand-h); border-color: var(--brand-h); color: #fff; }
.vabo-modal .va-btn-d { background: #fff; color: var(--brand); border-color: var(--brand); }
.vabo-modal .va-btn-d:hover { background: var(--tint); color: var(--brand-h); }
.vabo-modal #vabo-pay { font-size: 16px; padding: 14px; margin-top: 8px; box-shadow: none; }
.vabo-sum { background: var(--tint); border-color: var(--tint-line); border-radius: 8px; padding: 20px 22px; }
.vabo-sum-row { font-family: var(--sans); font-size: 15px; color: var(--ink-2); border-bottom-color: var(--tint-line); }
.vabo-sum-total { font-family: var(--sans); font-size: 22px; font-weight: 700; color: var(--ink); }
.vabo-note { font-family: var(--sans); font-size: 13.5px; color: var(--mu); }
.vabo-modal .va-kk { font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--mu); display: flex; }
.vabo-modal .va-h2 { font-size: 24px; font-weight: 700; line-height: 1.25; color: var(--ink); }
.vabo-modal .va-h2 em { font-style: normal; color: var(--brand); }
.vabo-modal .va-lead { font-size: 16px; color: var(--ink-2); line-height: 1.55; }
.vabo-done .vabo-tick { background: var(--tint-2); color: var(--brand); }
.vabo-msg { font-family: var(--sans); font-size: 14.5px; }
@media (max-width: 680px) {
  .vabo-head { padding: 20px 60px 18px 18px; }
  .vabo-title { font-size: 20px; }
  .vabo-modal .va-form .va-field.row2 { grid-template-columns: 1fr; gap: 0; }
}

/* ---- phone menu ---- */
.nav-tog { display: none; }
@media (max-width: 720px) {
  .hdr .wrap { position: relative; }
  .nav-tog { display: inline-flex; align-items: center; gap: 8px; font: inherit; font-size: 15px; font-weight: 600; color: var(--ink); background: #fff; border: 1px solid var(--rule-2); border-radius: 4px; padding: 9px 12px; cursor: pointer; }
  .nav-tog-i, .nav-tog-i::before, .nav-tog-i::after { display: block; width: 16px; height: 2px; background: var(--ink); position: relative; transition: transform .15s, background .15s; }
  .nav-tog-i::before, .nav-tog-i::after { content: ""; position: absolute; left: 0; }
  .nav-tog-i::before { top: -5px; } .nav-tog-i::after { top: 5px; }
  .nav-tog[aria-expanded="true"] .nav-tog-i { background: transparent; }
  .nav-tog[aria-expanded="true"] .nav-tog-i::before { transform: translateY(5px) rotate(45deg); }
  .nav-tog[aria-expanded="true"] .nav-tog-i::after { transform: translateY(-5px) rotate(-45deg); }
  .hdr .btn { font-size: 14px; padding: 9px 12px; margin-left: auto; }
  .nav { display: none; }
  .nav.open { display: block; border-bottom: 1px solid var(--rule); }
  .nav ul { flex-direction: column; gap: 0; overflow: visible; }
  .nav li + li { border-top: 1px solid var(--rule); }
  .nav a, .nav ul li:first-child a { padding: 14px 0; font-size: 16px; border-bottom: 0; }
  .nav a.on { color: var(--brand); border-bottom: 0; box-shadow: inset 3px 0 0 var(--brand); padding-left: 12px; }
}
@media (max-width: 720px) {
  .hdr-logo img { height: 38px; }
  .hdr .wrap { gap: 10px; }
  .hdr .btn { font-size: 13.5px; padding: 8px 10px; }
  .nav-tog { font-size: 14px; padding: 8px 10px; }
}