/* World 1 · journal layer. Owned by one agent; keep all rules for this area here, never in style.css. */

/* The reference design used h2 for the opening line and h3 for section headings. The articles keep that
   exact typographic rhythm, but the document outline is now h1 > h2 > h3, which is what search engines and
   screen readers need. .art-v2 outranks the base .art-content rules without touching style.css. */
.art-v2 .art-lead{margin-top:38px;font-size:30px;font-weight:400;line-height:39px;letter-spacing:-.04em;color:var(--ink);text-wrap:balance}
.art-v2 h2{margin-top:44px;font-size:25px;font-weight:400;line-height:32.5px;letter-spacing:-.035em;color:var(--ink);text-wrap:balance;scroll-margin-top:150px}
.art-v2 h3{margin-top:28px;font-size:20px;font-weight:400;line-height:27px;letter-spacing:-.03em;color:var(--ink)}
.art-v2 h2+h3{margin-top:22px}
.art-v2 h3+p{margin-top:12px}

/* in-body links: the global reset kills colour and underline, so the journal restates them */
.art-v2 p a,.art-v2 li a,.art-v2 td a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--hair,#E3E3E3);text-underline-offset:4px;text-decoration-thickness:1px;transition:color .25s var(--ease),text-decoration-color .25s var(--ease)}
.art-v2 p a:hover,.art-v2 li a:hover,.art-v2 td a:hover{color:var(--accent);text-decoration-color:var(--accent)}
.art-v2 blockquote a{color:var(--bg);text-decoration:underline;text-underline-offset:4px}

/* lists: the orange signature only shows up in the markers */
.art-v2 ul{list-style:disc}
.art-v2 ul li::marker{color:var(--w1-orange)}
.art-v2 li{padding-left:2px}

/* tables scroll inside their own box instead of pushing the page sideways on a phone.
   The grid items need min-width:0: without it the table's min-width becomes the automatic minimum
   size of the column and the whole two column layout inflates to the width of the widest table. */
.art-cols>*{min-width:0}
.art-table{margin-top:25px;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:30px}
.art-table table{margin-top:0;min-width:480px}
.art-table:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* end-of-article call to action: was a beige card (#F5F5E9, r30, p30) around plain text; now an open block
   between two hairlines, Concierge type, the primary button carries the accent */
.art-cta{margin-top:56px;padding:30px 0 34px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start}
.art-cta-t{font-size:20px;font-weight:500;line-height:1.3;letter-spacing:-.025em;color:var(--ink)}
.art-cta-p{margin-top:10px;font-size:16px;font-weight:400;line-height:1.55;letter-spacing:-.012em;color:#5B6478;max-width:520px}
.art-cta .btn{margin-top:22px}

/* long editorial titles in the card grid: keep the measured type, just stop a stray word from clipping */
.ins-feat-txt h2,.ins-txt h3,.insight-txt b{overflow-wrap:break-word}

@media (max-width:1199px){
  .art-v2 .art-lead{font-size:25px;line-height:32.5px}
  .art-v2 h2{font-size:22px;line-height:29px;margin-top:38px}
  .art-v2 h3{font-size:18px;line-height:25px}
}
@media (max-width:809px){
  .art-v2 .art-lead{font-size:20px;line-height:26px;margin-top:30px}
  .art-v2 h2{font-size:19px;line-height:25px;margin-top:32px}
  .art-v2 h3{font-size:16px;line-height:22px;margin-top:22px}
  .art-table table{min-width:440px}
  .art-v2 th,.art-v2 td{padding:12px;font-size:14px;line-height:21px}
  .art-cta{padding:24px 0 28px}
  .art-cta-t{font-size:17px;line-height:1.3}
  .art-cta-p{font-size:14px;line-height:1.5}
}
