/* ============================================================
   MEDIAPATH — insights hub + article components (wave 1, 2026-07)
   Shared by insights.html + insights/*.html. Pages also carry the
   standard inline base block (body/.pill/bands/.ctav/footer) like
   every other page; this file holds ONLY the insights-specific
   grammar. Everything references lib/mp-tokens.css tokens.
   Ledger rows, not cards — house grammar.
   ============================================================ */

/* ---- hub: article ledger ---- */
.iled{border-top:1px solid var(--line);}
.irow{position:relative;display:grid;grid-template-columns:84px minmax(0,1.15fr) minmax(0,1fr) 44px;gap:clamp(16px,2.6vw,40px);align-items:center;
  padding:clamp(26px,3.6vh,44px) 0;border-bottom:1px solid var(--line);transition:background .3s;}
.irow::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--rg,var(--iri));transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease-out);}
.irow:hover::after{transform:scaleX(1);}
.irow:nth-child(4n+1){--rg:linear-gradient(90deg,#3E7BFA,#41D1D8);}
.irow:nth-child(4n+2){--rg:linear-gradient(90deg,#7C3FE6,#E145B7);}
.irow:nth-child(4n+3){--rg:linear-gradient(90deg,#2BB673,#3FD8C2);}
.irow:nth-child(4n+4){--rg:linear-gradient(90deg,#F0742F,#E14545);}
.irow__n{font-family:var(--font-display);font-weight:600;font-size:clamp(30px,3.4vw,46px);letter-spacing:-0.04em;line-height:1;
  background:var(--rg,var(--iri));-webkit-background-clip:text;background-clip:text;color:transparent;padding:.14em .08em;margin:-.14em -.08em;font-variant-numeric:tabular-nums;}
.irow__main{min-width:0;}
.irow__kind{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;}
.irow__t{font-family:var(--font-display);font-weight:600;font-size:var(--fs-h3);letter-spacing:-0.03em;line-height:1.08;color:var(--ink);}
.irow__meta{margin-top:10px;font-size:13px;font-weight:300;color:var(--ink-faint);letter-spacing:.02em;}
.irow__d{font-size:15px;font-weight:300;color:var(--ink-mut);line-height:1.55;text-align:right;}
.irow__go{width:38px;height:38px;border-radius:999px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink-mut);
  transition:transform .35s var(--ease),background .3s,color .3s,border-color .3s;}
.irow__go svg{width:15px;height:15px;}
.irow:hover .irow__go{transform:translateX(4px);background:var(--accent);color:#0A0A0A;border-color:transparent;}
@media(max-width:820px){
  .irow{grid-template-columns:56px minmax(0,1fr) 40px;}
  .irow__d{display:none;}
  .irow__n{font-size:26px;}
}

/* ---- hub: gated report cross-link (pfrow-adjacent grammar) ---- */
.igate{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(20px,3vw,48px);align-items:center;
  border:1px solid var(--line);border-radius:22px;padding:clamp(26px,3.4vw,44px);background:var(--void-2,rgba(255,255,255,.02));}
.igate__kind{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px;}
.igate__t{font-family:var(--font-display);font-weight:600;font-size:var(--fs-h3-lg);letter-spacing:-0.035em;line-height:1.04;color:var(--ink);}
.igate__d{margin-top:12px;font-size:15.5px;font-weight:300;color:var(--ink-mut);line-height:1.55;max-width:52ch;}
@media(max-width:700px){.igate{grid-template-columns:1fr;}}

/* ---- article hero ---- */
.ahero{padding:calc(var(--mpn-h,64px) + clamp(72px,12vh,130px)) 0 clamp(44px,7vh,84px);
  background:radial-gradient(110% 70% at 50% -12%, #1f1612 0%, var(--void-1) 62%);}
.ahero .crumb{justify-content:flex-start;margin-bottom:26px;}
.ahero__eyebrow{margin-bottom:24px;}
.ahero h1{font-size:var(--fs-h2-lg);font-weight:800;letter-spacing:-0.04em;line-height:1.0;max-width:22ch;text-transform:none;}
.ahero h1 .dot{color:var(--accent);}
.ahero__dek{margin-top:22px;max-width:56ch;font-size:var(--fs-lede);font-weight:300;color:var(--ink-mut);line-height:1.5;}
.ahero__meta{margin-top:26px;display:flex;gap:18px;flex-wrap:wrap;font-family:var(--font-mono,ui-monospace,monospace);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);}
.ahero__meta b{color:var(--accent);font-weight:500;}

/* ---- article body ---- */
.art{max-width:820px;}
.art-sec{padding:clamp(30px,5vh,56px) 0 0;}
.art-sec__head{display:flex;align-items:baseline;gap:16px;border-top:1px solid var(--line);padding-top:clamp(22px,3.2vh,34px);margin-bottom:clamp(16px,2.4vh,26px);}
.art-sec__n{flex:none;font-family:var(--font-mono,ui-monospace,monospace);font-size:12px;font-weight:500;letter-spacing:.1em;color:var(--accent);}
.art-sec__head h2{font-size:var(--fs-h3-lg);font-weight:700;letter-spacing:-0.03em;line-height:1.06;}
.art p{font-size:var(--fs-body);font-weight:300;color:var(--ink-mut);line-height:1.66;margin:0 0 18px;}
.art p strong{color:var(--ink);font-weight:500;}
.art p:last-child{margin-bottom:0;}

/* ---- stat callouts ---- */
.astats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:clamp(18px,2.6vw,34px);margin:clamp(22px,3.4vh,36px) 0;}
.astat__big{font-family:var(--font-display);font-weight:600;font-size:clamp(38px,4.6vw,64px);letter-spacing:-0.045em;line-height:.95;font-variant-numeric:tabular-nums;
  background:var(--iri);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;padding:.14em .08em;margin:-.14em -.08em;}
.astat__label{margin-top:10px;font-size:14.5px;font-weight:400;color:var(--ink);line-height:1.4;}
.astat__src{margin-top:7px;font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);}

/* ---- data table ---- */
.atable{margin:clamp(22px,3.4vh,36px) 0;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.atable table{width:100%;min-width:560px;border-collapse:collapse;}
.atable caption{caption-side:top;text-align:left;font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);padding-bottom:14px;}
.atable th{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);text-align:left;padding:0 18px 12px 0;border-bottom:1px solid var(--line);}
.atable td{font-size:14.5px;font-weight:300;color:var(--ink-mut);line-height:1.5;padding:14px 18px 14px 0;border-bottom:1px solid var(--line-soft);vertical-align:top;}
.atable td:first-child{color:var(--ink);font-weight:450;}

/* ---- key takeaways ledger ---- */
.atake{border-top:1px solid var(--line);margin-top:clamp(30px,4.6vh,52px);}
.atake__row{display:grid;grid-template-columns:52px minmax(0,1fr);gap:18px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line-soft);}
.atake__n{font-family:var(--font-mono,ui-monospace,monospace);font-size:12px;font-weight:500;letter-spacing:.08em;color:var(--accent);}
.atake__row p{font-size:16px;font-weight:350;color:var(--ink);line-height:1.55;margin:0;}

/* ---- sources + note ---- */
.asrc{margin-top:clamp(30px,4.6vh,52px);border-top:1px solid var(--line);padding-top:24px;}
.asrc h3{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px;}
.asrc p{font-size:13px;font-weight:300;color:var(--ink-faint);line-height:1.7;margin:0 0 6px;}
.anote{margin-top:18px;font-size:13px;font-style:italic;font-weight:300;color:var(--ink-faint);line-height:1.6;}

/* ---- glossary ---- */
.gls{border-top:1px solid var(--line);}
.gls__row{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,1fr);gap:clamp(16px,3vw,44px);padding:clamp(18px,2.6vh,26px) 0;border-bottom:1px solid var(--line-soft);}
.gls__t{font-family:var(--font-display);font-weight:600;font-size:17.5px;letter-spacing:-0.02em;color:var(--ink);scroll-margin-top:calc(var(--mpn-h,64px) + 26px);}
.gls__also{display:block;margin-top:6px;font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);}
.gls__d{font-size:15.5px;font-weight:300;color:var(--ink-mut);line-height:1.6;}
.gls__az{position:sticky;top:calc(var(--mpn-h,64px) + 10px);z-index:5;display:flex;gap:4px;flex-wrap:wrap;padding:12px 0;margin-bottom:8px;background:linear-gradient(var(--void-1) 82%,transparent);}
.gls__az a{font-family:var(--font-mono,ui-monospace,monospace);font-size:12px;width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--ink-mut);border:1px solid transparent;transition:color .2s,border-color .2s;}
.gls__az a:hover{color:var(--accent);border-color:var(--line);}
.gls__az span{font-family:var(--font-mono,ui-monospace,monospace);font-size:12px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.16);}
.gls__letter{padding-top:clamp(26px,4vh,40px);}
.gls__letter h2{font-family:var(--font-display);font-weight:600;font-size:clamp(26px,3vw,38px);letter-spacing:-0.03em;
  background:var(--iri);-webkit-background-clip:text;background-clip:text;color:transparent;padding:.14em .08em;margin:-.14em -.08em .1em;scroll-margin-top:calc(var(--mpn-h,64px) + 70px);}
@media(max-width:640px){.gls__row{grid-template-columns:1fr;gap:8px;}}

/* ---- next / more insights ---- */
.anext{margin-top:clamp(36px,5.6vh,64px);}
.anext__k{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;}

/* ---- figures: charts + graphs (2026-07, wave 1.1) ----
   Hand-rendered SVG in the house grammar: hairline gridlines, per-figure
   gradient fills cycling the row identities, mono axis/source lines.
   Mobile: the svg keeps a readable min-width and scrolls inside .afig__sc
   (same pattern as .atable) — the page never scrolls horizontally. */
.afig{margin:clamp(24px,3.8vh,40px) 0;border-top:1px solid var(--line);padding-top:18px;}
.afig__t{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:0 0 16px;}
.afig__sc{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.afig__sc svg{display:block;width:100%;min-width:520px;height:auto;}
.afig__src{margin-top:12px;font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);}

/* ---- The monthly read (newsletter capture) ----
   Slim hairline row, ledger grammar (no card box). One instance per page.
   Wired by lib/mp-newsletter.js → POSTs to the lead function
   (source "Newsletter — the monthly read"); error line falls back to mailto. */
.mnews{margin-top:38px;padding-top:28px;border-top:1px solid var(--line);}
.mnews__k{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.mnews__d{margin-top:10px;font-size:14.5px;font-weight:300;color:var(--ink-mut);line-height:1.55;max-width:54ch;}
.mnews__f{margin-top:18px;display:flex;gap:10px;max-width:470px;}
.mnews__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.mnews__in{flex:1;min-width:0;font:inherit;font-size:14.5px;color:var(--ink);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:999px;padding:11px 18px;}
.mnews__in::placeholder{color:var(--ink-faint);}
.mnews__in:focus{outline:none;border-color:var(--accent);background:rgba(255,255,255,.06);}
.mnews__btn{border:0;cursor:pointer;white-space:nowrap;}
.mnews__done{margin-top:16px;font-size:14.5px;font-weight:400;color:var(--ink);}
.mnews__err{margin-top:12px;font-size:12.5px;color:#E8A48A;}
.mnews__err a{color:var(--accent);}
@media(max-width:480px){.mnews__f{flex-direction:column;}.mnews__btn{justify-content:center;}}

/* ---- Common questions (FAQ) ----
   Answer-first Q&A in ledger grammar (hairline rows, no card box). Targets
   natural-language "how/what/why" search queries; paired with FAQPage JSON-LD
   in the page @graph. Question is a real <h3> so it's indexable; answer sits
   directly under it (answer-first = featured-snippet friendly). */
.afaq{border-top:1px solid var(--line);margin-top:clamp(30px,4.6vh,52px);}
.afaq__row{padding:clamp(18px,2.6vh,26px) 0;border-bottom:1px solid var(--line-soft);}
.afaq__q{font-family:var(--font-display,inherit);font-size:clamp(17px,1.9vw,21px);font-weight:600;letter-spacing:-0.01em;line-height:1.25;color:var(--ink);margin:0 0 10px;}
.afaq__a{font-size:15.5px;font-weight:300;color:var(--ink-mut);line-height:1.6;margin:0;max-width:70ch;}
.afaq__a strong{color:var(--ink);font-weight:500;}

/* ---- In-article report request (.agate) ----
   Sits inline ~40% into the body so the reader meets it at peak engagement.
   NOT a content gate: the article stays fully readable and indexable — gating
   would hide the FAQ/charts that earn the rankings. Ledger grammar, hairline
   rules, no card box. Wired by lib/mp-article-form.js -> the lead function
   (per-article source + page attribution). Delivery is manual reach-out, so the
   copy says "request", never "download". */
.agate{margin:clamp(34px,5vh,56px) 0;padding:clamp(24px,3.2vh,34px) 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.agate__k{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.agate__t{margin-top:10px;font-family:var(--font-display,inherit);font-weight:600;font-size:clamp(20px,2.4vw,26px);letter-spacing:-0.02em;line-height:1.15;color:var(--ink);}
.agate__d{margin-top:10px;font-size:14.5px;font-weight:300;color:var(--ink-mut);line-height:1.55;max-width:60ch;}
.agate__f{margin-top:20px;display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:center;}
.agate__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.agate__in{font:inherit;font-size:14.5px;color:var(--ink);background:rgba(255,255,255,.04);
  border:1px solid var(--line);border-radius:999px;padding:11px 18px;min-width:0;}
.agate__in::placeholder{color:var(--ink-faint);}
.agate__in:focus{outline:none;border-color:var(--accent);background:rgba(255,255,255,.06);}
.agate__in[aria-invalid="true"]{border-color:#E8A48A;}
.agate__btn{border:0;cursor:pointer;white-space:nowrap;}
.agate__note{margin-top:12px;font-size:11.5px;font-weight:300;color:var(--ink-faint);}
.agate__done{margin-top:6px;font-size:15px;color:var(--ink);line-height:1.55;}
.agate__err{margin-top:12px;font-size:12.5px;color:#E8A48A;}
.agate__err a{color:var(--accent);}
@media(max-width:760px){.agate__f{grid-template-columns:1fr;}.agate__btn{justify-content:center;}}

/* ---- Read-wall (.awall / .agated) — VERTICAL DEEP-DIVES ONLY ----
   financial-services + healthcare-pharma only. The evergreen explainers stay
   fully open: they are the SEO engine, and walling them would hide the FAQ
   answers that earn featured snippets and bounce searchers back to Google.
   The gated body is present in the HTML (needed to unlock without a reload) and
   is declared to Google via isAccessibleForFree:false + hasPart cssSelector
   ".agated" — the sanctioned flexible-sampling markup. Showing Googlebot the
   body while hiding it from readers WITHOUT that markup would be cloaking.
   FAQ + sources stay outside the gate (public Q&A + attribution). */
.agated{display:none;}
html.mp-unlocked .agated{display:block;}

.awall{position:relative;margin-top:-140px;padding-top:150px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,var(--void) 42%);}
html.mp-unlocked .awall{display:none;}
.awall__box{border-top:1px solid var(--line);padding-top:clamp(24px,3.2vh,34px);}
.awall__k{font-family:var(--font-mono,ui-monospace,monospace);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.awall__t{margin-top:10px;font-family:var(--font-display,inherit);font-weight:600;font-size:clamp(21px,2.6vw,28px);letter-spacing:-0.02em;line-height:1.14;color:var(--ink);}
.awall__d{margin-top:10px;font-size:14.5px;font-weight:300;color:var(--ink-mut);line-height:1.55;max-width:58ch;}
.awall__f{margin-top:20px;display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:center;}
.awall__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.awall__in{font:inherit;font-size:14.5px;color:var(--ink);background:rgba(255,255,255,.04);
  border:1px solid var(--line);border-radius:999px;padding:11px 18px;min-width:0;}
.awall__in::placeholder{color:var(--ink-faint);}
.awall__in:focus{outline:none;border-color:var(--accent);background:rgba(255,255,255,.06);}
.awall__in[aria-invalid="true"]{border-color:#E8A48A;}
.awall__btn{border:0;cursor:pointer;white-space:nowrap;}
.awall__note{margin-top:12px;font-size:11.5px;font-weight:300;color:var(--ink-faint);}
.awall__err{margin-top:12px;font-size:12.5px;color:#E8A48A;}
.awall__err a{color:var(--accent);}
@media(max-width:760px){.awall__f{grid-template-columns:1fr;}.awall__btn{justify-content:center;}}
@media (prefers-reduced-motion: reduce){.awall{margin-top:0;padding-top:0;background:none;}}
