/* =============================================================================
   VOCTOS BLOG — the article, the parts the ported template does NOT cover

   THE ARTICLE PAGE IS NOW THE AGENCY'S OWN TEMPLATE, rendered against the
   agency's own compiled stylesheet: see inc/article-template.php and
   assets/vendor/agency-main.css. Everything this file used to hold — the
   shell, the prose, the figures, the meta strip, the contents rail, the
   read-next cards — was a reconstruction of that page written from measured
   values, and it is gone because the real thing is in the theme now.

   What is left is the two blocks that belong to this publication and have no
   counterpart on voctos.com to port, both set to the agency's own scale so
   they read as part of the body rather than as bolt-ons:

     the study box    what any article carrying data has to show: sample,
                      period, method, last verified, and a citation string
     scroll-margin    the masthead here is fixed, so a heading jumped to from
                      the contents rail has to clear it
============================================================================= */

/* ── the shell's inherited font, which is the whole ballgame ──────────────────
   A computed-style diff of the ported page against the reference came back
   with 49 differences. FORTY-FIVE of them were this one line missing.

   The agency's <body> inherits weight 400, colour #000 and line-height 1.5;
   this theme's body is 300 / #0d172d / 24px, because that is what its own
   pages want. Every container on the ported page that does not declare a
   weight — the article card, the aside, the author card, the CTA, the
   prev/next row, the share row, the read-also cards — inherits it, so all of
   them came through 100 too light.

   Worse, `b` and `strong` compute Preflight's `font-weight:bolder` RELATIVE
   to what they inherit: against 300 that resolves to 400, against 400 it
   resolves to 700. So emphasis inside the prose was silently un-bolded by a
   value set on <body>, three levels up and in another stylesheet.

   Setting the agency's three body values on the shell fixes all of it at
   once, and confines them to this page so the masthead and footer above and
   below keep this theme's own. */
.vb-art-shell { font-weight:400; color:#000; line-height:1.5; }

/* the ported shell has no top padding of its own — the agency's wrapper
   carries pt-16 / lg:pt-[86px] for its own fixed header, and this theme's
   masthead is a different height */
.vb-art-shell { padding-block:104px 0; }
@media (min-width:1024px){ .vb-art-shell { padding-block:130px 0; } }

/* anchors land below the fixed masthead, not under it */
.article-content h2, .article-content h3 { scroll-margin-top:110px; }

/* Tailwind's Preflight sets h1–h6 to `font-weight:inherit`, and this theme's
   body runs at 300 where the agency's runs at 400 — so every heading in the
   ported shell that sits OUTSIDE .article-content came through 100 too light
   (the page h1 measured 300 against the reference's 400). The template's own
   inline fix only reaches headings inside the body, which is why it has to be
   said again here. */
.vb-art-shell h1,
.vb-art-shell h2,
.vb-art-shell h3,
.vb-art-shell h4 { font-weight:400; }

/* ── the study box ────────────────────────────────────────── */
.vb-study-box { margin-top:10px; background:#f7f8fa; border:1px solid #e3e7ee;
                border-radius:14px; padding:20px 22px; }
.vb-study-box h2 { font-size:11px; letter-spacing:.154em; text-transform:uppercase;
                   color:#5b6478; margin-bottom:16px; font-weight:400; }
.vb-study-box dl { display:grid; grid-template-columns:1fr; column-gap:56px; row-gap:0; }
@media (min-width:700px){ .vb-study-box dl { grid-template-columns:auto minmax(0,1fr); } }
.vb-study-box dt { font-size:14px; color:#5b6478; padding-block:7px; }
/* <dd> ships with a 40px inline margin; without this every value sits outside
   its own grid column */
.vb-study-box dd { margin:0; font-size:15px; color:#0d172d; padding-block:7px; }
.vb-study-cite { margin-top:16px; padding-top:16px; border-top:1px solid #e3e7ee;
                 font-size:13px; line-height:1.6; color:#5b6478; }
.vb-study-cite b { display:block; margin-bottom:6px; font-weight:400; font-size:11px;
                   letter-spacing:.12em; text-transform:uppercase; color:#878b95; }