/* Single article */
.art-hero {
  padding:28px 0 var(--space-2);
}
.art-hero h1 {
  font-family:var(--font-heading);
  font-weight:600;
  font-size:var(--fs-38);
  line-height:1.06;
  letter-spacing:-.025em;
  color:var(--color-text);
  text-wrap:balance;
  max-width:900px;
}
.art-dek {
  font-size:var(--font-size-lg);
  line-height:1.45;
  color:var(--color-text-mid);
  margin-top:14px;
  max-width:var(--measure-wide);
  text-wrap:pretty;
}
.cat-link {
  display:inline-block;
  font-size:var(--font-size-xs);
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-secondary);
  text-decoration:none;
  margin-bottom:var(--space-3);
}
.byline {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 22px;
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid var(--color-border);
  font-size:var(--fs-15);
  color:var(--color-muted);
}
.byline .who-a {
  display:flex;
  align-items:center;
  gap:var(--space-3);
}
.avatar {
  flex:none;
  display:grid;
  place-items:center;
  width:var(--tap-size);
  height:var(--tap-size);
  border-radius:var(--radius-round);
  background:var(--color-primary);
  color:var(--color-white);
  font-weight:700;
  font-size:var(--fs-15);
}
.byline strong {
  display:block;
  font-size:var(--fs-16);
  color:var(--color-text);
}
.byline span {
  display:block;
}
.art-layout {
  display:grid;
  gap:var(--space-6);
  padding:28px 0 var(--space-14);
}
.toc {
  border:1px solid var(--color-border);
  border-radius:var(--radius-xl);
  background:var(--color-white);
}
.toc summary {
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:52px;
  padding:0 18px;
  font-weight:700;
  font-size:var(--font-size-xs);
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-muted);
}
.toc summary::-webkit-details-marker {
  display:none;
}
.toc summary::after {
  content:"+";
  font-size:var(--fs-22);
  font-weight:400;
  color:var(--color-accent);
  letter-spacing:0;
}
.toc[open] summary::after {
  content:"\2013";
}
.toc ol {
  padding:0 18px var(--space-3);
  counter-reset:t;
}
.toc li {
  counter-increment:t;
}
.toc a {
  display:flex;
  gap:10px;
  padding:9px 0;
  border-top:1px solid var(--color-surface-tint-2);
  font-size:var(--fs-16);
  font-weight:500;
  line-height:1.35;
  color:var(--color-text-soft);
  text-decoration:none;
}
.toc a::before {
  content:counter(t);
  flex:none;
  width:22px;
  font-weight:700;
  color:var(--color-accent);
}
.toc a:hover {
  color:var(--color-accent);
}
.prose {
  min-width:0;
}
.prose h2 {
  font-family:var(--font-heading);
  font-weight:600;
  font-size:var(--fs-30);
  line-height:1.12;
  letter-spacing:-.02em;
  color:var(--color-text);
  margin:44px 0 14px;
  scroll-margin-top:88px;
  text-wrap:balance;
}
.prose h2:first-child {
  margin-top:0;
}
.prose h3 {
  font-size:var(--fs-19);
  font-weight:700;
  color:var(--color-text);
  margin:28px 0 var(--space-2);
}
.prose p {
  font-size:var(--fs-18_5);
  line-height:1.7;
  color:var(--color-text-soft);
  max-width:var(--measure);
  text-wrap:pretty;
}
.prose p+p {
  margin-top:var(--space-4);
}
.prose a {
  color:var(--color-primary);
  font-weight:600;
  text-underline-offset:3px;
}
.prose :is(ul.b,ul.wp-block-list,ul:not([class])),.prose :is(ol.n,ol.wp-block-list,ol:not([class])) {
  max-width:var(--measure);
  margin:14px 0;
}
.prose :is(ul.b,ul.wp-block-list,ul:not([class])) li {
  position:relative;
  padding:5px 0 5px 26px;
  font-size:var(--fs-18);
  line-height:1.55;
  color:var(--color-text-soft);
}
.prose :is(ul.b,ul.wp-block-list,ul:not([class])) li::before {
  content:"";
  position:absolute;
  left:6px;
  top:16px;
  width:7px;
  height:7px;
  border-radius:var(--radius-round);
  background:var(--color-primary);
}
.prose :is(ol.n,ol.wp-block-list,ol:not([class])) {
  counter-reset:s;
}
.prose :is(ol.n,ol.wp-block-list,ol:not([class])) li {
  position:relative;
  counter-increment:s;
  padding:var(--space-2) 0 var(--space-2) 44px;
  font-size:var(--fs-18);
  line-height:1.55;
  color:var(--color-text-soft);
}
.prose :is(ol.n,ol.wp-block-list,ol:not([class])) li::before {
  content:counter(s);
  position:absolute;
  left:0;
  top:8px;
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:var(--radius-round);
  background:var(--color-primary);
  color:var(--color-white);
  font-size:var(--fs-14);
  font-weight:700;
}
.prose li strong {
  color:var(--color-text);
}
.prose li small {
  display:block;
  font-size:var(--fs-16);
  color:var(--color-muted);
}
:is(.callout,.is-style-callout-tip,.is-style-callout-warn) {
  max-width:var(--measure);
  margin:26px 0;
  padding:18px var(--space-5);
  border-radius:var(--radius-xl);
  background:var(--color-surface-alt);
  font-size:var(--font-size-md);
  line-height:1.55;
  color:var(--color-text-soft);
}
:is(.callout,.is-style-callout-tip,.is-style-callout-warn) strong.ct {
  display:block;
  font-size:var(--fs-12_5);
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-warn-text);
  margin-bottom:6px;
}
:is(.callout.tip,.is-style-callout-tip) {
  background:var(--color-success-bg);
}
:is(.callout.tip,.is-style-callout-tip) strong.ct {
  color:var(--color-secondary-dark);
}
:is(.tbl-wrap,.wp-block-table) {
  max-width:var(--measure);
  margin:var(--space-6) 0;
  background:var(--color-white);
  border:1px solid var(--color-border);
  border-radius:var(--radius-xl);
  overflow:hidden;
}
:is(.tbl,.wp-block-table table) {
  width:100%;
  border-collapse:collapse;
  font-size:var(--fs-16_5);
}
:is(.tbl,.wp-block-table table) th,:is(.tbl,.wp-block-table table) td {
  text-align:left;
  padding:14px var(--space-4);
  border-bottom:1px solid var(--color-border-soft);
  vertical-align:top;
}
:is(.tbl,.wp-block-table table) thead th {
  font-size:var(--fs-12_5);
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--color-muted);
  background:var(--color-surface-alt);
}
:is(.tbl,.wp-block-table table) tr:last-child td,:is(.tbl,.wp-block-table table) tr:last-child th {
  border-bottom:0;
}
:is(.tbl,.wp-block-table table) th[scope=row] {
  font-weight:600;
  color:var(--color-text);
}
:is(.tbl,.wp-block-table table) caption {
  caption-side:bottom;
  text-align:left;
  padding:10px var(--space-4);
  font-size:var(--fs-14);
  color:var(--color-muted-soft);
  border-top:1px solid var(--color-border-soft);
}
.art-cta {
  max-width:var(--measure);
  margin:var(--space-10) 0 0;
  padding:26px var(--space-6);
  border-radius:var(--radius-xl);
  background:var(--color-primary);
  color:var(--color-on-dark);
}
.prose .art-cta h2 {
  font-family:var(--font-heading);
  text-wrap:wrap;
  scroll-margin-top:0;
  font-size:var(--fs-28);
  font-weight:600;
  line-height:1.1;
  letter-spacing:-.015em;
  color:var(--color-white);
  margin:0;
}
.art-cta p {
  font-size:var(--font-size-md);
  color:var(--color-on-dark-soft);
  margin-top:10px;
}
.art-end {
  max-width:var(--measure);
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid var(--color-border);
  font-size:var(--fs-15);
  color:var(--color-muted);
}
.side-cta {
  display:none;
}
.related {
  display:grid;
  gap:var(--space-4);
}
@media (min-width:860px){
  .art-hero {
    padding:var(--space-14) 0 var(--space-2);
  }
  .art-hero h1 {
    font-size:var(--fs-60);
    line-height:1.02;
  }
  .art-dek {
    font-size:var(--fs-23);
  }
  .art-layout {
    grid-template-columns:260px minmax(0,1fr);
    gap:var(--space-20);
    padding:var(--space-12) 0 var(--space-24);
    align-items:start;
  }
  .toc summary {
    pointer-events:none;
    cursor:default;
  }
  .toc summary::after {
    display:none;
  }
  .toc:not([open]) ol {
    display:block;
  }
  .prose h2 {
    font-size:var(--fs-38);
    margin-top:var(--space-14);
  }
  .prose p {
    font-size:var(--font-size-lg);
    line-height:1.72;
  }
  .prose :is(ul.b,ul.wp-block-list,ul:not([class])) li,.prose :is(ol.n,ol.wp-block-list,ol:not([class])) li {
    font-size:var(--fs-19_5);
  }
  .side-cta {
    display:block;
    margin-top:var(--space-4);
    padding:var(--space-5);
    border-radius:var(--radius-xl);
    background:var(--color-primary);
    color:var(--color-on-dark);
  }
  .side-cta strong {
    display:block;
    font-family:var(--font-heading);
    font-size:var(--fs-22);
    line-height:1.15;
    color:var(--color-white);
  }
  .side-cta p {
    font-size:var(--fs-15);
    color:var(--color-on-dark-soft);
    margin:var(--space-2) 0 14px;
  }
  .side-cta .btn {
    width:100%;
    min-height:48px;
    font-size:var(--fs-16);
  }
  .related {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:var(--space-6);
  }
}

/* Buttons inside article text keep their own colours (".prose a" would otherwise turn them green on green / green on dark) */
.prose .btn {
  text-decoration:none;
  font-weight:600;
}
.prose .btn-primary {
  color:var(--color-white);
}
.prose .btn-ghost-light {
  color:var(--color-on-dark);
}
.prose .btn-ghost-light:hover {
  color:var(--color-primary);
}