/* ============================================================================
   The Financial Sciences Company — assets/tfsc-article.css
   Article shell v1 (2026-09-03).

   The RMC article shell (left TOC | article | right rail, Short Answer box,
   tip callouts, Keep Reading grid, monthly note) ported to the TFSC brand kit
   per Theo's direction 2026-09-03. Layout structure is RMC's — it tested well
   and he wants it as the firm's standard. Every token is TFSC's own:
   Ink / Brass / Bone / Paper / Steel, Playfair Display / Manrope / JetBrains
   Mono. Brass stays on the argument only (Short Answer rule, active TOC item,
   arrow glyphs) and well under the 8% ceiling.

   Wired on article pages AFTER the site's existing stylesheets:
     <link rel="stylesheet" href="/assets/tfsc-article.css" />
     <script src="/assets/tfsc-article.js" defer></script>

   EVERY class is namespaced `tfsca-` so nothing collides with, or has to
   out-specify, the Astra/Elementor CSS already on the page. Where Astra styles
   a bare element inside .entry-content (h2, table, ul) the override is scoped
   under .tfsca-body, which wins on specificity without !important.
   ========================================================================== */

.tfsca{
  /* ---- brand tokens (Brand kit v1.1 §XII) ---- */
  --ink:#0E1626;
  --brass:#B08D57;
  --bone:#FAF8F4;
  --paper:#F0EEE9;
  --steel:#6B7280;
  --white:#FFFFFF;

  --ink-soft:#4A5468;                  /* Iron — secondary body */
  --line:rgba(14,22,38,.13);
  --line-strong:rgba(14,22,38,.26);

  --f-display:'Playfair Display',Georgia,serif;
  --f-body:'Manrope',Arial,sans-serif;
  --f-mono:'JetBrains Mono',Consolas,monospace;

  --r-md:6px;
  --r-lg:10px;
  --shadow-1:0 1px 2px rgba(14,22,38,.05), 0 2px 8px rgba(14,22,38,.04);
  --shadow-2:0 2px 6px rgba(14,22,38,.06), 0 8px 24px rgba(14,22,38,.06);
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --measure:41rem;
  --gutter:20px;
}

/* ---------------------------------------------------------- GRID SHELL --- */
/* Below 1200px this is a plain block: the article keeps a centered measure and
   the rail stacks underneath. The live site's container is 1240px, so the
   desktop grid (168+656+288 + 2x40 gap = 1192) fits inside it. */
.tfsca-grid{display:block;}

@media (min-width:1200px){
  .tfsca-grid{
    display:grid;
    /* fluid centre column: the rails are fixed, the article takes the rest, so
       the grid can never overflow whatever width the host container gives us */
    grid-template-columns:168px minmax(0,1fr) 288px;
    gap:40px;
  }
  .tfsca-grid > .tfsca-col{grid-column:2; grid-row:1; max-width:none; width:100%; margin:0;}
  .tfsca-grid > .tfsca-toc{grid-column:1; grid-row:1;}
  .tfsca-grid > .tfsca-rail{grid-column:3; grid-row:1;}
}
@media (min-width:1400px){
  .tfsca-grid{grid-template-columns:180px minmax(0,1fr) 296px; gap:44px;}
}

.tfsca-col{max-width:var(--measure); margin:0 auto;}

/* anchor jumps clear the sticky masthead */
.tfsca-body h2[id]{scroll-margin-top:110px;}

/* ------------------------------------------------------------- HEADER --- */
.tfsca-kicker{
  display:flex; flex-wrap:wrap; align-items:center; gap:.55em;
  font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--steel);
  margin:0 0 1.2rem;
}
.tfsca-kicker::before{
  content:""; width:6px; height:6px; flex:none;
  background:var(--brass); border-radius:50%;
}
.tfsca-head h1{
  font-family:var(--f-display); font-weight:500;
  font-size:clamp(2rem,4.4vw,2.9rem); line-height:1.1;
  letter-spacing:.004em; color:var(--ink); margin:0 0 1.05rem;
}
.tfsca-byline{
  display:flex; flex-wrap:wrap; gap:.4rem 1.5rem; margin:0 0 1.9rem;
  font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--steel);
}

/* answer-first summary box — the one place brass frames the whole block */
.tfsca-short{
  background:var(--paper);
  border:1px solid var(--line); border-left:3px solid var(--brass);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  padding:1.35rem 1.55rem 1.45rem; margin:0 0 2.4rem;
}
.tfsca-short .tfsca-label{
  display:block;
  font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink);
  margin-bottom:.7rem;
}
.tfsca-short p{
  font-family:var(--f-body); font-size:1.03125rem; line-height:1.68;
  color:var(--ink); margin:0;
}

/* framed 1.9:1 image plate */
.tfsca-photo{
  display:block; width:100%; aspect-ratio:1.9/1; object-fit:cover;
  border-radius:var(--r-lg); box-shadow:var(--shadow-2); margin:0 0 2.6rem;
}
/* placeholder state while a photograph is pending */
.tfsca-photo--pending{
  display:flex; align-items:center; justify-content:center; text-align:center;
  background:
    linear-gradient(to right, rgba(14,22,38,.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14,22,38,.035) 1px, transparent 1px),
    var(--bone);
  background-size:40px 40px,40px 40px,auto;
  border:1px solid var(--line); padding:1.5rem;
  font-family:var(--f-mono); font-size:.75rem; letter-spacing:.1em;
  line-height:1.9; text-transform:uppercase; color:var(--steel);
}

/* --------------------------------------------------------------- BODY --- */
.tfsca-body{font-family:var(--f-body); font-size:1.15rem; line-height:1.72; color:var(--ink);}
.tfsca-body p{margin:0 0 1.35rem;}
.tfsca-body h2{
  font-family:var(--f-display); font-weight:500;
  font-size:1.75rem; line-height:1.22; letter-spacing:.004em; color:var(--ink);
  margin:3.1rem 0 1.15rem; padding-top:2.1rem; border-top:1px solid var(--line);
}
.tfsca-body h3{
  font-family:var(--f-display); font-weight:500; font-size:1.25rem;
  line-height:1.3; color:var(--ink); margin:2rem 0 .6rem;
}
.tfsca-body ul,.tfsca-body ol{margin:0 0 1.35rem 1.35rem; padding:0;}
.tfsca-body li{margin-bottom:.55rem;}
.tfsca-body a{color:var(--ink); text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:var(--brass); text-decoration-thickness:1px;}
.tfsca-body a:hover{color:var(--brass);}
.tfsca-body strong{font-weight:600;}

/* tables — brand chart aesthetic: one rule colour, mono caps headers */
.tfsca-body table{
  width:100%; border-collapse:collapse; margin:1.6rem 0 1.8rem;
  font-family:var(--f-body); font-size:.9rem;
  background:var(--white); border:1px solid var(--line);
}
.tfsca-body th{
  font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.1em; text-transform:uppercase; color:var(--steel);
  text-align:left; padding:.65rem .8rem; border-bottom:2px solid var(--ink);
}
.tfsca-body td{padding:.6rem .8rem; border-bottom:1px solid var(--line); vertical-align:top;}
.tfsca-body tr:last-child td{border-bottom:none;}

.tfsca-cite{font-size:.8125rem; color:var(--steel);}
.tfsca-cite a{color:var(--steel); text-decoration-color:var(--line-strong);}
.tfsca-srcline{
  font-family:var(--f-mono); font-size:.6875rem; letter-spacing:.06em;
  line-height:1.6; color:var(--steel); margin:-1rem 0 1.8rem;
}

/* ------------------------------------------------------- TIP CALLOUT ---- */
/* Quiet marginalia by default; the tinted variant is the one warm emphasis
   per article. Body copy restates a fact already made above — no new claims. */
.tfsca-tip{
  margin:2.5rem 0 2.5rem .35rem;
  padding:.25rem 0 .35rem 1.25rem;
  border-left:2px solid var(--line-strong);
}
.tfsca-tip .tfsca-label{
  display:block; font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink); margin-bottom:.55rem;
}
.tfsca-tip p{font-size:1.03125rem; line-height:1.62; color:var(--ink); margin:0;}
.tfsca-tip--mark{
  margin-left:0; padding:1.1rem 1.3rem 1.2rem;
  background:var(--paper); border-left:3px solid var(--brass);
  border-radius:var(--r-md);
}

/* --------------------------------------------------------- LEFT TOC ----- */
.tfsca-toc{display:none;}
@media (min-width:1200px){
  .tfsca-toc{
    display:block; position:sticky; top:110px; align-self:start;
    padding:.15rem 0 .5rem;
  }
}
.tfsca-toc-label{
  display:block; font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--steel);
}
.tfsca-toc ol{list-style:none; margin:.85rem 0 0; padding:0;}
.tfsca-toc li{margin:0;}
.tfsca-toc a{
  display:block; padding:.42rem .2rem .42rem .85rem;
  border-left:2px solid var(--line);
  font-family:var(--f-body); font-size:.8125rem; line-height:1.45;
  color:var(--steel); text-decoration:none;
  transition:color .15s var(--ease-out), border-color .15s var(--ease-out);
}
.tfsca-toc a:hover{color:var(--ink);}
.tfsca-toc a.is-active{border-left-color:var(--brass); color:var(--ink); font-weight:600;}

/* mobile TOC disclosure */
.tfsca-toc-m{margin:0 0 2.1rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
@media (min-width:1200px){ .tfsca-toc-m{display:none;} }
.tfsca-toc-m summary{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.85rem .1rem; cursor:pointer; list-style:none;
}
.tfsca-toc-m summary::-webkit-details-marker{display:none;}
.tfsca-caret{
  flex:none; width:9px; height:9px;
  border-right:2px solid var(--steel); border-bottom:2px solid var(--steel);
  transform:rotate(45deg); transition:transform .15s var(--ease-out);
}
.tfsca-toc-m[open] .tfsca-caret{transform:rotate(-135deg); margin-top:.3rem;}
.tfsca-toc-m ol{list-style:none; margin:0 0 1rem; padding:0;}
.tfsca-toc-m a{
  display:block; padding:.45rem .1rem .45rem .9rem; border-left:2px solid var(--line);
  font-family:var(--f-body); font-size:.9375rem; line-height:1.5;
  color:var(--steel); text-decoration:none;
}
.tfsca-toc-m a:hover{color:var(--ink);}

/* -------------------------------------------------------- RIGHT RAIL ---- */
.tfsca-rail{
  display:grid; gap:1.4rem; align-content:start;
  max-width:var(--measure); margin:2.6rem auto 0;
}
@media (min-width:1200px){
  .tfsca-rail{
    max-width:none; margin:0;
    position:sticky; top:110px; align-self:start;
    max-height:calc(100vh - 140px); overflow-y:auto;
  }
}
.tfsca-card{
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  padding:1.25rem 1.35rem 1.3rem;
}
.tfsca-rail-kicker{
  display:block; font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink);
}

/* related guides */
.tfsca-related ul{list-style:none; margin:.7rem 0 0; padding:0;}
.tfsca-related li{border-top:1px solid var(--line); padding:.75rem 0;}
.tfsca-related li:first-child{border-top:none; padding-top:.45rem;}
.tfsca-related li:last-child{padding-bottom:.15rem;}
.tfsca-related a{
  display:block; font-family:var(--f-body); font-size:.9375rem; font-weight:600;
  line-height:1.42; color:var(--ink); text-decoration:none;
  transition:color .15s var(--ease-out);
}
.tfsca-related a:hover{color:var(--brass);}
.tfsca-related .tfsca-meta{
  display:block; margin-top:.3rem;
  font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--steel);
}

/* talk card — Ink panel, Playfair line, one Bone button. Desktop rail only,
   so it can never double with the end-of-article invitation. */
.tfsca-talk{background:var(--ink); border:none; border-radius:var(--r-lg); box-shadow:var(--shadow-2); padding:1.5rem 1.45rem;}
.tfsca-talk .tfsca-rail-kicker{color:#A6ADBA;}
.tfsca-talk p{
  font-family:var(--f-display); font-weight:500; font-size:1.1875rem;
  line-height:1.42; color:var(--bone); margin:.75rem 0 1.2rem;
}
.tfsca-talk-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:var(--f-body); font-weight:600; font-size:.9375rem;
  background:var(--bone); color:var(--ink); text-decoration:none;
  padding:11px 20px; border-radius:var(--r-md);
  transition:background .15s var(--ease-out), transform .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.tfsca-talk-btn:hover{background:var(--white); color:var(--ink); transform:translateY(-1px); box-shadow:var(--shadow-2);}
.tfsca-talk-btn:active{transform:translateY(1px);}
.tfsca-arr{color:var(--brass); transition:transform .15s var(--ease-out);}
.tfsca-talk-btn:hover .tfsca-arr{transform:translateX(3px);}
@media (max-width:1199.98px){ .tfsca-talk{display:none;} }

/* ------------------------------------------------------- ARTICLE END ---- */
.tfsca-end{margin:3.2rem 0 0;}

/* sources panel */
.tfsca-sources{
  background:var(--bone); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.4rem 1.6rem 1.5rem; margin:0 0 2.6rem;
}
.tfsca-sources h2{
  font-family:var(--f-display); font-weight:500; font-size:1.25rem;
  border-top:none; padding-top:0; margin:0 0 .8rem; color:var(--ink);
}
.tfsca-sources ul{list-style:none; margin:0; padding:0;}
.tfsca-sources li{font-size:.9375rem; line-height:1.55; padding:.35rem 0;}

/* next step — Ink topline card, three verb-first on-site actions */
.tfsca-next{
  position:relative; background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--shadow-2);
  padding:1.7rem 1.8rem 1.35rem; margin:0 0 2.8rem;
}
.tfsca-next::before{
  content:""; position:absolute; left:0; top:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--ink),var(--brass));
  border-radius:var(--r-lg) var(--r-lg) 0 0;
}
.tfsca-body .tfsca-next h2{border-top:none; padding-top:0; font-size:1.5rem; margin:0 0 .6rem;}
.tfsca-body .tfsca-next ul{list-style:none; margin:0; padding:0;}
.tfsca-body .tfsca-next li{margin:0; padding:.7rem 0; border-top:1px solid var(--line);}
.tfsca-body .tfsca-next li:first-child{border-top:none;}
.tfsca-next a{
  display:inline-flex; align-items:baseline; gap:.45em;
  font-family:var(--f-body); font-size:1rem; font-weight:600; line-height:1.45;
  color:var(--ink); text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:transparent;
  transition:color .15s var(--ease-out), text-decoration-color .25s ease-in-out;
}
.tfsca-next a:hover{color:var(--brass); text-decoration-color:currentColor;}
.tfsca-next a:hover .tfsca-arr{transform:translateX(3px);}

/* keep reading — three cards with thumbnails */
.tfsca-read{margin:0 0 2.8rem;}
.tfsca-body .tfsca-read h2{font-size:1.5rem; margin:0 0 1.1rem; padding-top:2.1rem;}
.tfsca-read-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem;}
@media (max-width:820px){ .tfsca-read-grid{grid-template-columns:1fr; gap:1rem;} }
.tfsca-read-card{
  display:block; text-decoration:none; background:var(--white);
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-1);
  transition:transform .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.tfsca-read-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-2);}
.tfsca-read-card img{display:block; width:100%; aspect-ratio:1.9/1; object-fit:cover;}
.tfsca-read-card .tfsca-rc-tag{
  display:block; padding:.8rem .9rem .3rem;
  font-family:var(--f-mono); font-size:.625rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--steel);
}
.tfsca-read-card .tfsca-rc-t{
  display:block; padding:0 .9rem 1rem;
  font-family:var(--f-body); font-size:.9375rem; font-weight:600;
  line-height:1.4; color:var(--ink);
}
.tfsca-read-card:hover .tfsca-rc-t{color:var(--brass);}

/* the monthly note */
.tfsca-note{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.5rem 1.7rem 1.6rem;
}
.tfsca-note .tfsca-rail-kicker{margin-bottom:.6rem;}
.tfsca-note p{font-size:1rem; line-height:1.6; margin:0 0 1rem;}
.tfsca-note-form{display:flex; flex-wrap:wrap; gap:.7rem;}
.tfsca-note-form input{
  flex:1 1 15rem; min-width:0;
  font-family:var(--f-body); font-size:.9375rem; color:var(--ink);
  background:var(--white); border:1px solid var(--line-strong);
  border-radius:var(--r-md); padding:11px 14px;
}
.tfsca-note-form input:focus{outline:2px solid var(--brass); outline-offset:1px;}
.tfsca-note-btn{
  flex:none; font-family:var(--f-body); font-weight:600; font-size:.9375rem;
  background:var(--ink); color:var(--bone); border:none; cursor:pointer;
  padding:11px 20px; border-radius:var(--r-md);
  transition:background .15s var(--ease-out);
}
.tfsca-note-btn:hover{background:#1a2740;}
.tfsca-note-fine{font-family:var(--f-mono); font-size:.625rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--steel); margin:.8rem 0 0;}

/* the weekly market brief -- the live newsletter block, one-for-one copy;
   markup keeps the SureForms ids so assets/tfsc-forms.js keeps posting to the
   same /api/firm-lead.php relay */
.tfsca-brief h3{
  font-family:var(--f-display); font-weight:500; font-size:1.35rem; line-height:1.25;
  color:var(--ink); margin:0 0 .6rem;
}
.tfsca-brief-form label{display:block; margin:0 0 .9rem;}
.tfsca-brief-form label span{
  display:block; font-family:var(--f-body); font-size:.8125rem; font-weight:600;
  color:var(--ink); margin:0 0 .35rem;
}
.tfsca-brief-form label span em{color:#8a2323; font-style:normal;}
.tfsca-brief-row{display:grid; grid-template-columns:1fr 1fr; gap:.9rem;}
@media (max-width:600px){ .tfsca-brief-row{grid-template-columns:1fr;} }
.tfsca-brief-form input[type="text"],.tfsca-brief-form input[type="email"]{
  width:100%; font-family:var(--f-body); font-size:.9375rem; color:var(--ink);
  background:var(--white); border:1px solid var(--line-strong); border-radius:var(--r-md);
  padding:11px 14px;
}
.tfsca-brief-form input:focus{outline:2px solid var(--brass); outline-offset:1px;}
.tfsca-brief-btn{
  font-family:var(--f-mono); font-size:.6875rem; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; background:var(--ink); color:var(--bone); border:1px solid var(--ink);
  cursor:pointer; padding:14px 26px; border-radius:var(--r-md); margin-top:.2rem;
  transition:background .15s var(--ease-out), color .15s var(--ease-out);
}
.tfsca-brief-btn:hover{background:var(--brass); color:var(--ink); border-color:var(--brass);}
.tfsca-brief .tfsc-form-error{font-family:var(--f-body);}

/* standing disclosure */
.tfsca-legal{
  font-family:var(--f-body); font-style:italic; font-size:.8125rem;
  line-height:1.65; color:var(--steel); margin-top:2.4rem;
}
.tfsca-legal + .tfsca-legal{margin-top:1rem;}

/* ------------------------------------------------------ GUIDES INDEX ---- */
.tfsca-index{max-width:1040px; margin:0 auto;}
.tfsca-ix-head{margin:0 0 3rem;}
.tfsca-ix-head h1{
  font-family:var(--f-display); font-weight:500; font-size:clamp(1.8rem,3.1vw,2.4rem) !important;
  line-height:1.14 !important; color:var(--ink); margin:0 0 .9rem; max-width:26ch;
}
.tfsca-ix-lede{font-size:1.125rem; line-height:1.6; color:var(--ink-soft); max-width:60ch; margin:0;}
.tfsca-ix-section{margin:0 0 3.4rem;}
.tfsca-ix-section h2{
  font-family:var(--f-display); font-weight:500; font-size:1.5rem !important; line-height:1.25 !important;
  color:var(--ink); margin:0 0 .35rem; padding-top:1.6rem; border-top:1px solid var(--line);
}
.tfsca-ix-blurb{color:var(--steel); font-size:.9375rem; margin:0 0 1.3rem;}
.tfsca-ix-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem;}
@media (max-width:900px){ .tfsca-ix-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:560px){ .tfsca-ix-grid{grid-template-columns:1fr;} }
.tfsca-ix-card{
  display:block; text-decoration:none; background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-1);
  transition:transform .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.tfsca-ix-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-2);}
.tfsca-ix-card img{display:block; width:100%; aspect-ratio:1.9/1; object-fit:cover;}
.tfsca-ix-kicker{
  display:block; padding:.85rem .95rem .3rem; font-family:var(--f-mono); font-size:.625rem;
  font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--steel);
}
.tfsca-ix-title{
  display:block; padding:0 .95rem .45rem; font-family:var(--f-body); font-size:1rem;
  font-weight:600; line-height:1.38; color:var(--ink);
}
.tfsca-ix-card:hover .tfsca-ix-title{color:var(--brass);}
.tfsca-ix-desc{display:block; padding:0 .95rem 1rem; font-size:.875rem; line-height:1.5; color:var(--ink-soft);}

/* ------------------------------------------------------- small screens --- */
@media (max-width:600px){
  .tfsca-body{font-size:1.125rem;}
  .tfsca-body table{display:block; overflow-x:auto; white-space:nowrap;}
  .tfsca-next,.tfsca-note{padding:1.4rem 1.3rem 1.1rem;}
  .tfsca-card{padding:1.15rem 1.15rem 1.2rem;}
  .tfsca-tip{margin:2.1rem 0;}
  .tfsca-short{padding:1.2rem 1.25rem 1.3rem;}
}


/* ---------------------------------------------------------------------------
   The live site injects site-wide heading sizes with !important
   (`h2{font-size:clamp(34px,4.4vw,64px)!important}` and the h1 equivalent),
   so the shell's own scale has to answer in kind. These are the only
   !important declarations in this file and they are all scoped inside the
   article shell -- nothing outside .tfsca is touched.
   ------------------------------------------------------------------------ */
.tfsca-head h1{
  font-size:clamp(1.8rem,3.1vw,2.4rem) !important;
  line-height:1.14 !important;
}
.tfsca-body h2{
  font-size:clamp(1.45rem,2.1vw,1.7rem) !important;
  line-height:1.24 !important;
}
.tfsca-body h3{font-size:1.2rem !important; line-height:1.34 !important;}
.tfsca-sources h2{font-size:1.2rem !important;}
.tfsca-body .tfsca-next h2,
.tfsca-body .tfsca-read h2{font-size:1.35rem !important;}

/* ------------------------------------------------------ reduced motion --- */
@media (prefers-reduced-motion:reduce){
  .tfsca-caret,.tfsca-arr,.tfsca-talk-btn,.tfsca-read-card,
  .tfsca-next a,.tfsca-toc a,.tfsca-related a,.tfsca-note-btn{transition:none !important;}
  .tfsca-read-card:hover{transform:none;}
  .tfsca-talk-btn:hover{transform:none;}
}
