/* ==========================================================================
   Disruptive Templates blog, v2
   --------------------------------------------------------------------------
   The Bussinesstan blog layout in DT colours. Loaded only on a guide and on
   /blog/ while the v2 layout is on (see dt-blog-v2.php). Every rule starts
   at .dtx so nothing reaches the shop, the role pages or the header.

   Guide: a centred reading column (max 720px). Contents and sharing on the
   left rail, the kit offer and a free tool on the right rail, both sticky.
   Below 1240px the rails fold into the column: "On this page" at the top,
   the offer half way down, the share row at the end.

   Post content styled here: the new dtb- components (blog-components.css)
   and the classes the first 21 guides use (dt-po__key, dt-po__ex, dt-po__faq).

   Colour: #009933 fills and marks; #007A29 for green TEXT (5.5:1 on white,
   #009933 is only 3.7:1); #0B3D1E for dark bands and headings.
   ========================================================================== */

.dtx{
  --g:#009933;
  --g-text:#007A29;
  --g-dark:#0B3D1E;
  --g-deep:#072A14;
  --g-bright:#3DDC84;
  --ink:#151816;
  --ink-2:#2E3632;
  --slate:#56605B;
  --mist:#EEF7F1;
  --mist-2:#F6FAF7;
  --mist-border:#CFE6D7;
  --line:#DCE4DF;
  --line-strong:#B7C6BD;
  --bad:#B42318;
  --bad-soft:#FDF1F0;
  --bad-line:#F4C7C3;
  --warm:#FFFBEF;
  --warm-line:#F2E3B8;
  --warm-text:#7A5A0B;
  --white:#FFFFFF;
  --fd:var(--dt-font-display,'Source Serif 4',Georgia,serif);
  --fb:var(--dt-font-body,'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif);
  --gut:clamp(16px,4vw,32px);
  --ease:cubic-bezier(.2,.7,.2,1);
  color:var(--ink);
  font-family:var(--fb);
}
.dtx *,.dtx *::before,.dtx *::after{box-sizing:border-box}
.dtx :where(h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl){margin:0}
.dtx img{max-width:100%;height:auto}
.dtx .dtx-w{width:100%;max-width:calc(1260px + var(--gut) * 2);margin-inline:auto;padding-inline:var(--gut)}

/* Astra: the layout draws its own full-width bands */
body.dtx-on #content > .ast-container,
body.dtx-on .site-content > .ast-container{max-width:none;padding-left:0;padding-right:0;display:block}
body.dtx-on #primary{margin:0;padding:0;width:100%}
body.dtx-on--index .entry-header,
body.dtx-on--index .entry-title{display:none}

/* breadcrumbs */
.dtx .dtx-crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;list-style:none;margin:0;padding:0}
.dtx .dtx-crumbs li{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--slate)}
.dtx .dtx-crumbs a,.dtx .dtx-crumbs a:visited{color:var(--slate);text-decoration:none}
.dtx .dtx-crumbs a:hover{color:var(--g-text);text-decoration:underline}
.dtx .dtx-crumbs__sep{display:inline-flex;color:var(--line-strong)}
.dtx .dtx-crumbs [aria-current]{color:var(--ink)}

/* buttons ------------------------------------------------------------------ */
.dtx a.dtx-btn,.dtx button.dtx-btn{
  appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:48px;padding:0 22px;border-radius:999px;cursor:pointer;
  font-family:var(--fb);font-size:15px;font-weight:700;line-height:1.2;letter-spacing:.005em;
  text-decoration:none;border:1px solid transparent;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s var(--ease);
}
.dtx .dtx-btn svg{flex:0 0 auto;transition:transform .25s var(--ease)}
.dtx a.dtx-btn:hover svg{transform:translateX(3px)}
.dtx a.dtx-btn--solid,.dtx a.dtx-btn--solid:visited{background:var(--g-text);border-color:var(--g-text);color:var(--white)}
.dtx a.dtx-btn--solid:hover,.dtx a.dtx-btn--solid:focus-visible{background:var(--g-dark);border-color:var(--g-dark);color:var(--white)}
.dtx a.dtx-btn--ghost,.dtx a.dtx-btn--ghost:visited,.dtx button.dtx-btn--ghost{background:var(--white);border-color:var(--line-strong);color:var(--g-dark)}
.dtx a.dtx-btn--ghost:hover,.dtx button.dtx-btn--ghost:hover,.dtx .dtx-btn--ghost:focus-visible{background:var(--g-dark);border-color:var(--g-dark);color:var(--white)}
.dtx a.dtx-btn--bright,.dtx a.dtx-btn--bright:visited{background:var(--g-bright);border-color:var(--g-bright);color:var(--g-deep)}
.dtx a.dtx-btn--bright:hover,.dtx a.dtx-btn--bright:focus-visible{background:var(--white);border-color:var(--white);color:var(--g-deep)}
.dtx a.dtx-btn--line,.dtx a.dtx-btn--line:visited{background:transparent;border-color:rgba(255,255,255,.4);color:var(--white)}
.dtx a.dtx-btn--line:hover,.dtx a.dtx-btn--line:focus-visible{background:var(--white);border-color:var(--white);color:var(--g-deep)}

.dtx a.dtx-link,.dtx a.dtx-link:visited{
  display:inline-flex;align-items:center;gap:8px;min-height:32px;
  font-family:var(--fb);font-size:15px;font-weight:700;color:var(--g-text);text-decoration:none;
}
.dtx a.dtx-link:hover{color:var(--g-dark)}
.dtx a.dtx-link svg{transition:transform .25s var(--ease)}
.dtx a.dtx-link:hover svg{transform:translateX(3px)}

.dtx .dtx-art__dot{display:inline-block;width:7px;height:7px;border-radius:999px;background:var(--g-bright);box-shadow:0 0 0 4px rgba(61,220,132,.2)}

/* ==========================================================================
   The guide
   ========================================================================== */
.dtx-art{
  --art-col:720px;
  --art-rail:250px;
  --art-gap:48px;
  --art-top:110px;
  --art-radius:16px;
  background:var(--white);
}

/* reading progress */
.dtx-art-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:100000;pointer-events:none}
.dtx-art-progress span{
  display:block;height:100%;width:100%;
  background:linear-gradient(90deg,var(--g,#009933),#3DDC84);
  transform:scaleX(0);transform-origin:0 50%;
}
body.admin-bar .dtx-art-progress{top:32px}

/* hero */
.dtx-art .dtx-art__hero{
  position:relative;padding-top:clamp(18px,2.4vw,30px);
  background:
    radial-gradient(60% 70% at 50% 0%,rgba(0,153,51,.09),transparent 70%),
    linear-gradient(180deg,var(--mist) 0%,rgba(238,247,241,.4) 62%,var(--white) 100%);
}
.dtx-art .dtx-art__hero-w{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:1000px}
.dtx-art .dtx-art__crumbs{padding-bottom:18px;max-width:100%}
.dtx-art .dtx-art__crumbs ol{justify-content:center}
.dtx-art .dtx-art__crumbs li:last-child{min-width:0}
.dtx-art .dtx-art__crumbs [aria-current]{display:inline-block;max-width:34ch;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;vertical-align:bottom}

.dtx-art .dtx-art__eyebrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;font-size:13px;color:var(--slate)}
.dtx-art a.dtx-art__cat,.dtx-art a.dtx-art__cat:visited{
  display:inline-flex;align-items:center;height:30px;padding:0 14px;border-radius:999px;
  background:var(--white);border:1px solid var(--mist-border);
  font-weight:800;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--g-text);text-decoration:none;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}
.dtx-art a.dtx-art__cat:hover,.dtx-art a.dtx-art__cat:focus-visible{background:var(--g-text);border-color:var(--g-text);color:var(--white)}
.dtx-art .dtx-art__eyebrow-t{display:inline-flex;align-items:center;gap:6px;font-weight:700}
.dtx-art .dtx-art__eyebrow-t svg{color:var(--g)}

.dtx-art h1.dtx-art__h1{
  margin-top:18px;max-width:24ch;
  font-family:var(--fd);font-weight:700;font-size:clamp(31px,4.3vw,52px);line-height:1.1;letter-spacing:-.02em;
  color:var(--g-dark);text-wrap:balance;
}
.dtx-art p.dtx-art__dek{margin-top:18px;max-width:62ch;font-size:clamp(16.5px,1.5vw,19px);line-height:1.6;color:var(--slate);text-wrap:pretty}

.dtx-art .dtx-art__byline{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 22px;
  margin-top:24px;padding:8px 14px 8px 8px;border-radius:999px;
  background:rgba(255,255,255,.85);border:1px solid var(--mist-border);
  box-shadow:0 10px 30px -18px rgba(11,61,30,.35);
}
.dtx-art a.dtx-art__who,.dtx-art a.dtx-art__who:visited{display:inline-flex;align-items:center;gap:12px;text-align:left;color:var(--ink);text-decoration:none}
.dtx-art .dtx-art__avatar{flex:0 0 auto;border-radius:999px;object-fit:cover;background:var(--mist);box-shadow:0 0 0 2px var(--white),0 0 0 3.5px var(--g)}
.dtx-art .dtx-art__who .dtx-art__avatar{width:44px;height:44px}
.dtx-art .dtx-art__who-t{display:flex;flex-direction:column;line-height:1.25}
.dtx-art .dtx-art__who-n{font-weight:800;font-size:15px}
.dtx-art .dtx-art__who-r{font-size:12.5px;color:var(--slate)}
.dtx-art a.dtx-art__who:hover .dtx-art__who-n{color:var(--g-text)}
.dtx-art p.dtx-art__dates{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--slate)}
.dtx-art p.dtx-art__dates svg{color:var(--g)}

.dtx-art figure.dtx-art__cover{margin:clamp(28px,3.4vw,40px) auto 0;max-width:calc(1080px + var(--gut) * 2)}
.dtx-art .dtx-art__cover img{
  display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  border-radius:clamp(14px,1.8vw,22px);background:var(--mist);
  box-shadow:0 30px 70px -40px rgba(11,61,30,.55);
}

/* layout */
.dtx-art .dtx-art__grid{
  display:grid;grid-template-columns:var(--art-rail) minmax(0,var(--art-col)) var(--art-rail);
  justify-content:center;column-gap:var(--art-gap);
  padding-block:clamp(36px,4.4vw,64px) clamp(48px,6vw,88px);
}
.dtx-art .dtx-art__main{min-width:0;grid-column:2}
.dtx-art .dtx-art__rail--l{grid-column:1;grid-row:1}
.dtx-art .dtx-art__rail--r{grid-column:3;grid-row:1}
.dtx-art .dtx-art__sticky{position:sticky;top:var(--art-top);display:flex;flex-direction:column;gap:18px}

/* contents */
.dtx-art .dtx-art__toc{
  padding:18px 14px;border-radius:var(--art-radius);background:var(--white);border:1px solid var(--line);
  max-height:calc(100vh - var(--art-top) - 200px);overflow:auto;overscroll-behavior:contain;
}
.dtx-art p.dtx-art__toc-k,.dtx-art p.dtx-art__share-k{
  margin:0 0 10px 8px;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);
}
.dtx-art .dtx-art__toc ol,.dtx-art .dtx-art__toc-m ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.dtx-art .dtx-art__toc li,.dtx-art .dtx-art__toc-m li{margin:0;padding:0}
.dtx-art .dtx-art__toc a,.dtx-art .dtx-art__toc-m a{
  display:grid;grid-template-columns:24px 1fr;gap:6px;align-items:baseline;
  padding:7px 8px;border-radius:10px;
  font-size:13.5px;line-height:1.4;font-weight:600;color:var(--slate);text-decoration:none;
  transition:background-color .2s ease,color .2s ease;
}
.dtx-art .dtx-art__toc-n{font-size:11px;font-weight:800;color:var(--line-strong);font-variant-numeric:tabular-nums}
.dtx-art .dtx-art__toc a:hover,.dtx-art .dtx-art__toc-m a:hover{background:var(--mist);color:var(--ink)}
.dtx-art .dtx-art__toc a.is-on{background:var(--mist);color:var(--g-text)}
.dtx-art .dtx-art__toc a.is-on .dtx-art__toc-n{color:var(--g-text)}

.dtx-art details.dtx-art__toc-m{display:none;margin:0 0 28px;border-radius:var(--art-radius);background:var(--mist);border:1px solid var(--mist-border)}
.dtx-art .dtx-art__toc-m summary{
  display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:0 18px;
  cursor:pointer;list-style:none;font-weight:800;font-size:15px;color:var(--g-dark);
}
.dtx-art .dtx-art__toc-m summary::-webkit-details-marker{display:none}
.dtx-art .dtx-art__toc-m summary svg{color:var(--g-text);transition:transform .25s var(--ease)}
.dtx-art .dtx-art__toc-m[open] summary svg{transform:rotate(180deg)}
.dtx-art .dtx-art__toc-m nav{padding:0 10px 12px}

/* share */
.dtx-art .dtx-art__share{position:relative}
.dtx-art .dtx-art__share ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.dtx-art .dtx-art__share li{margin:0;padding:0}
.dtx-art .dtx-art__share li[hidden]{display:none}
.dtx-art .dtx-art__sbtn,.dtx-art a.dtx-art__sbtn:visited{
  appearance:none;display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;padding:0;border-radius:999px;cursor:pointer;
  background:var(--white);border:1px solid var(--line);color:var(--g-dark);text-decoration:none;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s var(--ease);
}
.dtx-art .dtx-art__sbtn:hover,.dtx-art .dtx-art__sbtn:focus-visible,.dtx-art a.dtx-art__sbtn:hover{
  background:var(--g-text);border-color:var(--g-text);color:var(--white);transform:translateY(-2px);
}
.dtx-art .dtx-art__share--rail{padding:16px 14px;border-radius:var(--art-radius);border:1px solid var(--line)}
.dtx-art .dtx-art__share--rail p.dtx-art__share-k{margin-left:2px}
.dtx-art .dtx-art__share--bar{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 18px;
  margin-top:44px;padding:16px 18px;border-radius:var(--art-radius);background:var(--mist);border:1px solid var(--mist-border);
}
.dtx-art .dtx-art__share--bar p.dtx-art__share-k{margin:0;font-size:12px;color:var(--g-dark)}
.dtx-art .dtx-art__toast{
  position:absolute;left:50%;bottom:calc(100% + 8px);transform:translate(-50%,6px);
  padding:6px 12px;border-radius:999px;background:var(--g-dark);color:var(--white);
  font-size:12.5px;font-weight:700;white-space:nowrap;opacity:0;pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;
}
.dtx-art .dtx-art__toast.is-on{opacity:1;transform:translate(-50%,0)}

/* the offer card */
.dtx-art .dtx-art__cta{
  position:relative;overflow:hidden;isolation:isolate;
  padding:24px 22px 22px;border-radius:20px;background:var(--g-dark);color:var(--white);
  box-shadow:0 24px 50px -30px rgba(11,61,30,.85);
}
.dtx-art .dtx-art__cta::before{
  content:"";position:absolute;z-index:-1;inset:auto -30% -55% -30%;height:80%;
  background:radial-gradient(closest-side,rgba(0,153,51,.55),transparent 72%);
}
.dtx-art .dtx-art__cta::after{
  content:"";position:absolute;z-index:-1;right:-40px;top:-40px;width:140px;height:140px;border-radius:999px;
  background:radial-gradient(closest-side,rgba(61,220,132,.3),transparent 70%);
}
.dtx-art p.dtx-art__cta-k{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--g-bright)}
.dtx-art p.dtx-art__cta-h{margin-top:12px;font-family:var(--fd);font-weight:700;font-size:21px;line-height:1.25;letter-spacing:-.01em;color:var(--white);text-wrap:balance}
.dtx-art p.dtx-art__cta-b{margin:10px 0 18px;font-size:14px;line-height:1.6;color:rgba(238,247,241,.84)}
.dtx-art .dtx-art__cta a.dtx-btn{width:100%;padding:0 14px}
.dtx-art .dtx-art__rail a.dtx-btn{font-size:14px;gap:7px;min-height:46px}

/* free tool card */
.dtx-art .dtx-art__lm{
  display:grid;grid-template-columns:44px 1fr;column-gap:14px;align-items:center;
  padding:18px;border-radius:var(--art-radius);background:linear-gradient(180deg,var(--mist),var(--white));border:1px solid var(--mist-border);
}
.dtx-art .dtx-art__lm-ic{grid-row:1 / span 2;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:14px;background:var(--g);color:var(--white)}
.dtx-art p.dtx-art__lm-k{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--g-text)}
.dtx-art p.dtx-art__lm-t{margin-top:2px;font-family:var(--fd);font-weight:700;font-size:16.5px;line-height:1.3;color:var(--g-dark)}
.dtx-art p.dtx-art__lm-b{grid-column:1 / -1;margin-top:10px;font-size:13.5px;line-height:1.55;color:var(--slate)}
.dtx-art .dtx-art__lm a.dtx-btn{grid-column:1 / -1;margin-top:14px;width:100%;min-height:44px}

/* the inline copy of the offer, for narrow screens */
.dtx-art .dtx-art__body aside.dtx-art__cta--inline{display:none;margin:40px 0}
.dtx-art .dtx-art__body .dtx-art__cta p{margin:0}
.dtx-art .dtx-art__body .dtx-art__cta p.dtx-art__cta-k{font-size:11px;line-height:1.3;color:var(--g-bright)}
.dtx-art .dtx-art__body .dtx-art__cta p.dtx-art__cta-h{margin:12px 0 0;font-size:22px;color:var(--white)}
.dtx-art .dtx-art__body .dtx-art__cta p.dtx-art__cta-b{margin:10px 0 18px;font-size:15px;line-height:1.6;color:rgba(238,247,241,.84)}
.dtx-art .dtx-art__body .dtx-art__cta a.dtx-btn{width:auto;padding:0 22px;text-decoration:none}

/* ==========================================================================
   Body copy
   ========================================================================== */
.dtx-art .dtx-art__body{font-size:18px;line-height:1.78;color:var(--ink-2);overflow-wrap:break-word}
.dtx-art .dtx-art__body > :first-child{margin-top:0}
.dtx-art .dtx-art__body p{margin:0 0 1.2em;font-size:inherit;line-height:inherit;color:var(--ink-2);text-wrap:pretty}
.dtx-art .dtx-art__body p:empty{display:none}
.dtx-art .dtx-art__body strong,.dtx-art .dtx-art__body b{color:var(--ink);font-weight:800}
.dtx-art .dtx-art__body code{
  padding:.12em .42em;border-radius:6px;background:var(--mist);border:1px solid var(--mist-border);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.84em;color:var(--g-dark);overflow-wrap:anywhere;
}
.dtx-art .dtx-art__body a,.dtx-art .dtx-art__body a:visited{
  color:var(--g-text);font-weight:700;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.2em;
  text-decoration-color:rgba(0,122,41,.35);transition:color .2s ease,text-decoration-color .2s ease;
}
.dtx-art .dtx-art__body a:hover{color:var(--g-dark);text-decoration-color:var(--g-dark)}

.dtx-art .dtx-art__body h2{
  position:relative;margin:2.2em 0 .7em;padding-top:.9em;
  font-family:var(--fd);font-weight:700;font-size:clamp(25px,2.5vw,32px);line-height:1.2;letter-spacing:-.015em;
  color:var(--g-dark);scroll-margin-top:var(--art-top);text-wrap:balance;
}
.dtx-art .dtx-art__body h2::before{
  content:"";position:absolute;left:0;top:0;width:44px;height:4px;border-radius:4px;
  background:linear-gradient(90deg,var(--g),var(--g-bright));
}
.dtx-art .dtx-art__body h3{
  margin:1.7em 0 .5em;font-family:var(--fb);font-weight:800;font-size:clamp(19px,1.7vw,21px);line-height:1.35;letter-spacing:-.01em;
  color:var(--ink);scroll-margin-top:var(--art-top);
}
.dtx-art .dtx-art__body h4{margin:1.5em 0 .4em;font-weight:800;font-size:18px;color:var(--ink)}
.dtx-art .dtx-art__body h2 + p,.dtx-art .dtx-art__body h3 + p{margin-top:0}

/* plain lists get the brand bullets; component lists keep their own */
.dtx-art .dtx-art__body :where(ul,ol):not([class]){margin:0 0 1.3em;padding:0;list-style:none;display:grid;gap:.55em}
.dtx-art .dtx-art__body :where(ul,ol):not([class]) > li{position:relative;margin:0;padding-left:1.8em;line-height:1.7}
.dtx-art .dtx-art__body ul:not([class]) > li::before{
  content:"";position:absolute;left:.35em;top:.68em;width:.46em;height:.46em;border-radius:999px;
  background:var(--g);box-shadow:0 0 0 3px rgba(0,153,51,.15);
}
.dtx-art .dtx-art__body ol:not([class]){counter-reset:dtx}
.dtx-art .dtx-art__body ol:not([class]) > li{counter-increment:dtx;padding-left:2.4em}
.dtx-art .dtx-art__body ol:not([class]) > li::before{
  content:counter(dtx);position:absolute;left:0;top:.18em;display:inline-flex;align-items:center;justify-content:center;
  width:1.6em;height:1.6em;border-radius:999px;background:var(--g-dark);color:var(--white);
  font-size:.78em;font-weight:800;line-height:1;
}

/* images */
.dtx-art .dtx-art__body figure,
.dtx-art .dtx-art__body .dtb-figure{margin:34px 0;padding:0}
.dtx-art .dtx-art__body figure img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--line);background:var(--mist)}
.dtx-art .dtx-art__body .dtb-figure img{aspect-ratio:16/9;object-fit:cover}
.dtx-art .dtx-art__body .dtb-figure--product img{aspect-ratio:4/3;object-fit:contain;background:var(--mist)}
.dtx-art .dtx-art__body figcaption{margin-top:10px;text-align:center;font-size:14px;line-height:1.5;color:var(--slate)}

/* things the template now draws itself */
.dtx-art .dtx-art__body .dtb-toc,
.dtx-art .dtx-art__body .dtb-meta,
.dtx-art .dtx-art__body .dtb-author,
.dtx-art .dtx-art__body > h1{display:none}

/* key takeaways: new (.dtb-takeaways) and first-21 (.dt-po__key) */
.dtx-art .dtx-art__body .dtb-takeaways,
.dtx-art .dtx-art__body .dt-po__key{
  margin:0 0 36px;padding:22px 24px 14px;border-radius:var(--art-radius);
  background:var(--white);border:1px solid var(--line);box-shadow:0 18px 40px -32px rgba(11,61,30,.5);
}
.dtx-art .dtx-art__body .dtb-takeaways > p.dtb-label,
.dtx-art .dtx-art__body .dtb-takeaways > h2,
.dtx-art .dtx-art__body .dt-po__key > p.dt-po__keyh{
  display:flex;align-items:center;gap:10px;margin:0 0 10px;padding:0;
  font-family:var(--fb);font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;line-height:1.3;color:var(--g-text);
}
.dtx-art .dtx-art__body .dtb-takeaways > h2::before{content:none}
.dtx-art .dtx-art__body .dtb-takeaways > p.dtb-label::before,
.dtx-art .dtx-art__body .dtb-takeaways > h2::after,
.dtx-art .dtx-art__body .dt-po__key > p.dt-po__keyh::before{
  content:"";order:-1;flex:0 0 auto;width:30px;height:30px;border-radius:9px;
  background:var(--mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007A29' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 21h4'/%3E%3Cpath d='M12 3a6 6 0 0 0-3.5 10.9c.6.5 1 1.2 1 2.1h5c0-.9.4-1.6 1-2.1A6 6 0 0 0 12 3z'/%3E%3C/svg%3E") center/18px no-repeat;
}
.dtx-art .dtx-art__body .dtb-takeaways ul,
.dtx-art .dtx-art__body .dt-po__key ul{margin:0;padding:0;list-style:none;display:grid;gap:0}
.dtx-art .dtx-art__body .dtb-takeaways li,
.dtx-art .dtx-art__body .dt-po__key li{
  position:relative;margin:0;padding:10px 0 10px 2em;border-top:1px solid var(--line);
  font-size:16.5px;line-height:1.6;color:var(--ink-2);
}
.dtx-art .dtx-art__body .dtb-takeaways li:first-child,
.dtx-art .dtx-art__body .dt-po__key li:first-child{border-top:0}
.dtx-art .dtx-art__body .dtb-takeaways li::before,
.dtx-art .dtx-art__body .dt-po__key li::before{
  content:"";position:absolute;left:0;top:.85em;width:1.15em;height:1.15em;border-radius:999px;box-shadow:none;
  background:var(--g-bright) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B3D1E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/70% no-repeat;
}

/* before / after: new (.dtb-compare) and first-21 (.dt-po__ex) */
.dtx-art .dtx-art__body .dtb-compare,
.dtx-art .dtx-art__body .dt-po__ex{display:grid;gap:12px;margin:28px 0}
@media (min-width:640px){.dtx-art .dtx-art__body .dtb-compare{grid-template-columns:1fr 1fr}}
.dtx-art .dtx-art__body .dtb-compare > div,
.dtx-art .dtx-art__body .dt-po__exrow{
  position:relative;padding:16px 18px 16px 20px;border-radius:14px;font-size:16px;line-height:1.6;
  background:var(--mist-2);border:1px solid var(--line);
}
.dtx-art .dtx-art__body .dtb-compare .dtb-before,
.dtx-art .dtx-art__body .dt-po__exrow--no{background:var(--bad-soft);border-color:var(--bad-line);box-shadow:inset 4px 0 0 var(--bad)}
.dtx-art .dtx-art__body .dtb-compare .dtb-after,
.dtx-art .dtx-art__body .dt-po__exrow--yes{background:var(--mist);border-color:var(--mist-border);box-shadow:inset 4px 0 0 var(--g)}
.dtx-art .dtx-art__body .dtb-compare .dtb-label,
.dtx-art .dtx-art__body .dt-po__exlabel{
  display:flex;align-items:center;gap:6px;margin-bottom:6px;
  font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;line-height:1.3;
}
.dtx-art .dtx-art__body .dtb-before .dtb-label,
.dtx-art .dtx-art__body .dt-po__exrow--no .dt-po__exlabel{color:var(--bad)}
.dtx-art .dtx-art__body .dtb-after .dtb-label,
.dtx-art .dtx-art__body .dt-po__exrow--yes .dt-po__exlabel{color:var(--g-text)}
.dtx-art .dtx-art__body .dtb-before .dtb-label::before,
.dtx-art .dtx-art__body .dt-po__exrow--no .dt-po__exlabel::before{content:"\2715";font-size:12px}
.dtx-art .dtx-art__body .dtb-after .dtb-label::before,
.dtx-art .dtx-art__body .dt-po__exrow--yes .dt-po__exlabel::before{content:"\2713";font-size:13px}
.dtx-art .dtx-art__body .dt-po__ex p{margin:0;font-size:16px;line-height:1.6}

/* callouts */
.dtx-art .dtx-art__body .dtb-callout{
  margin:28px 0;padding:20px 22px;border-radius:var(--art-radius);font-size:16.5px;line-height:1.7;
  background:var(--mist-2);border:1px solid var(--line);border-left:4px solid var(--line-strong);
}
.dtx-art .dtx-art__body .dtb-callout > strong:first-child{
  display:block;margin-bottom:6px;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--g-dark);
}
.dtx-art .dtx-art__body .dtb-callout--tip{background:var(--mist);border-color:var(--mist-border);border-left-color:var(--g)}
.dtx-art .dtx-art__body .dtb-callout--tip > strong:first-child{color:var(--g-text)}
.dtx-art .dtx-art__body .dtb-callout--warn{background:var(--warm);border-color:var(--warm-line);border-left-color:#C99A1E}
.dtx-art .dtx-art__body .dtb-callout--warn > strong:first-child{color:var(--warm-text)}
.dtx-art .dtx-art__body .dtb-callout p:last-child{margin-bottom:0}

/* steps */
.dtx-art .dtx-art__body ol.dtb-steps{counter-reset:dtbstep;list-style:none;margin:0 0 1.4em;padding:0;display:grid;gap:14px}
.dtx-art .dtx-art__body ol.dtb-steps > li{
  counter-increment:dtbstep;position:relative;margin:0;padding:16px 18px 16px 64px;
  border-radius:14px;background:var(--white);border:1px solid var(--line);line-height:1.65;
}
.dtx-art .dtx-art__body ol.dtb-steps > li::before{
  content:counter(dtbstep,decimal-leading-zero);position:absolute;left:16px;top:14px;
  display:grid;place-items:center;width:34px;height:34px;border-radius:10px;
  background:var(--g-dark);color:var(--white);font-size:13px;font-weight:800;
}

/* checklists */
.dtx-art .dtx-art__body ul.dtb-checklist{
  list-style:none;margin:0 0 1.4em;padding:6px 18px;border-radius:var(--art-radius);background:var(--white);border:1px solid var(--line);
}
.dtx-art .dtx-art__body ul.dtb-checklist > li{position:relative;margin:0;padding:13px 0 13px 36px;border-bottom:1px dashed var(--line);line-height:1.6}
.dtx-art .dtx-art__body ul.dtb-checklist > li:last-child{border-bottom:0}
.dtx-art .dtx-art__body ul.dtb-checklist > li::before{
  content:"\2713";position:absolute;left:0;top:14px;width:22px;height:22px;border-radius:7px;
  display:grid;place-items:center;background:var(--g);color:var(--white);font-size:13px;font-weight:800;line-height:1;
}
.dtx-art .dtx-art__body ul.dtb-checklist--bad > li::before{content:"\2715";background:var(--bad)}

/* role-kit card */
.dtx-art .dtx-art__body .dtb-kit{
  display:grid;gap:18px;align-items:center;margin:36px 0;padding:18px;border-radius:20px;
  background:var(--white);border:1px solid var(--mist-border);box-shadow:0 22px 50px -36px rgba(11,61,30,.6);
}
@media (min-width:640px){.dtx-art .dtx-art__body .dtb-kit{grid-template-columns:210px 1fr;padding:20px}}
.dtx-art .dtx-art__body .dtb-kit img{display:block;width:100%;height:auto;border-radius:12px;background:var(--mist);border:1px solid var(--line)}
.dtx-art .dtx-art__body .dtb-kit h3{margin:0 0 6px;font-family:var(--fd);font-weight:700;font-size:21px;color:var(--g-dark)}
.dtx-art .dtx-art__body .dtb-kit p{margin:0 0 8px;font-size:15.5px;line-height:1.6;color:var(--slate)}
.dtx-art .dtx-art__body .dtb-kit .dtb-contents{margin-bottom:14px;font-size:13.5px;font-weight:700;line-height:1.55;color:var(--g-dark)}

/* buttons inside the article */
.dtx-art .dtx-art__body a.dtb-btn,.dtx-art .dtx-art__body a.dtb-btn:visited{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;
  background:var(--g-text);border:1px solid var(--g-text);color:var(--white);
  font-size:15px;font-weight:700;text-decoration:none;transition:background-color .2s ease,border-color .2s ease;
}
.dtx-art .dtx-art__body a.dtb-btn:hover,.dtx-art .dtx-art__body a.dtb-btn:focus-visible{background:var(--g-dark);border-color:var(--g-dark);color:var(--white)}
.dtx-art .dtx-art__body a.dtb-btn--ghost,.dtx-art .dtx-art__body a.dtb-btn--ghost:visited{background:var(--white);border-color:var(--line-strong);color:var(--g-dark)}
.dtx-art .dtx-art__body a.dtb-btn--ghost:hover{background:var(--g-dark);border-color:var(--g-dark);color:var(--white)}

/* content upgrade (free resource) */
.dtx-art .dtx-art__body .dtb-upgrade{
  position:relative;overflow:hidden;isolation:isolate;margin:36px 0;padding:26px 24px;border-radius:20px;
  background:var(--g-dark);color:var(--white);
}
.dtx-art .dtx-art__body .dtb-upgrade::after{
  content:"";position:absolute;z-index:-1;right:-60px;bottom:-80px;width:260px;height:220px;
  background:radial-gradient(closest-side,rgba(0,153,51,.6),transparent 72%);
}
.dtx-art .dtx-art__body .dtb-upgrade h3{margin:0 0 6px;font-family:var(--fd);font-weight:700;font-size:21px;color:var(--white)}
.dtx-art .dtx-art__body .dtb-upgrade p{margin:0 0 16px;font-size:15.5px;line-height:1.6;color:rgba(238,247,241,.86)}
.dtx-art .dtx-art__body .dtb-upgrade a.dtb-btn,.dtx-art .dtx-art__body .dtb-upgrade a.dtb-btn:visited{background:var(--g-bright);border-color:var(--g-bright);color:var(--g-deep)}
.dtx-art .dtx-art__body .dtb-upgrade a.dtb-btn:hover{background:var(--white);border-color:var(--white);color:var(--g-deep)}

/* tables: new (.dtb-table-wrap) and first-21 (.dt-po__tablewrap) */
.dtx-art .dtx-art__body .dtb-table-wrap,
.dtx-art .dtx-art__body .dt-po__tablewrap{
  position:relative;margin:28px 0;overflow-x:auto;-webkit-overflow-scrolling:touch;
  border-radius:16px;border:1px solid var(--line);
  background:
    linear-gradient(90deg,var(--white) 30%,rgba(255,255,255,0)) left center / 40px 100% no-repeat local,
    linear-gradient(270deg,var(--white) 30%,rgba(255,255,255,0)) right center / 40px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,rgba(11,61,30,.16),transparent) left center / 12px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%,rgba(11,61,30,.16),transparent) right center / 12px 100% no-repeat scroll,
    var(--white);
}
.dtx-art .dtx-art__body table{width:100%;min-width:540px;border-collapse:separate;border-spacing:0;font-size:15px;line-height:1.5;text-align:left;margin:0}
.dtx-art .dtx-art__body thead th{
  padding:13px 16px;background:var(--g-dark);color:var(--white);border:0;
  font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;vertical-align:bottom;
}
.dtx-art .dtx-art__body tbody th,.dtx-art .dtx-art__body tbody td{padding:13px 16px;vertical-align:top;border:0;border-top:1px solid var(--line);color:var(--ink-2)}
.dtx-art .dtx-art__body tbody th,.dtx-art .dtx-art__body tbody td:first-child{font-weight:800;color:var(--ink)}
.dtx-art .dtx-art__body tbody tr:nth-child(even) td{background:rgba(238,247,241,.45)}
.dtx-art .dtx-art__body tbody tr:hover td{background:var(--mist)}

/* FAQ: the site's own markup (details.dt-po__faq), inside .dtb-faq or not */
.dtx-art .dtx-art__body .dtb-faq{margin-top:2.4em}
.dtx-art .dtx-art__body details.dt-po__faq,
.dtx-art .dtx-art__body .dtb-faq details{
  margin:0 0 10px;border-radius:16px;background:var(--white);border:1px solid var(--line);
  transition:border-color .2s ease,box-shadow .2s ease;scroll-margin-top:var(--art-top);
}
.dtx-art .dtx-art__body details.dt-po__faq[open],
.dtx-art .dtx-art__body .dtb-faq details[open]{border-color:var(--mist-border);box-shadow:0 16px 36px -28px rgba(11,61,30,.5)}
.dtx-art .dtx-art__body details.dt-po__faq > summary,
.dtx-art .dtx-art__body .dtb-faq details > summary{
  display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;cursor:pointer;list-style:none;
  font-family:var(--fb);font-weight:800;font-size:17px;line-height:1.4;color:var(--ink);transition:color .2s ease;
}
.dtx-art .dtx-art__body details > summary::-webkit-details-marker{display:none}
.dtx-art .dtx-art__body details.dt-po__faq > summary::after,
.dtx-art .dtx-art__body .dtb-faq details > summary::after{
  content:"";flex:0 0 auto;width:30px;height:30px;border-radius:999px;color:var(--g-text);
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,
    var(--mist);
  transition:transform .3s var(--ease),background-color .2s ease,color .2s ease;
}
.dtx-art .dtx-art__body details.dt-po__faq[open] > summary::after,
.dtx-art .dtx-art__body .dtb-faq details[open] > summary::after{
  transform:rotate(45deg);color:var(--white);
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,
    var(--g-text);
}
.dtx-art .dtx-art__body details > summary:hover{color:var(--g-text)}
.dtx-art .dtx-art__body .dt-fq__a,
.dtx-art .dtx-art__body .dtb-faq details > p,
.dtx-art .dtx-art__body .dtb-faq details > div{padding:0 18px 18px}
.dtx-art .dtx-art__body .dtb-faq details > p{margin:0}
.dtx-art .dtx-art__body .dt-fq__a p,
.dtx-art .dtx-art__body .dtb-faq details p{margin:0 0 .8em;font-size:16.5px;line-height:1.7}
.dtx-art .dtx-art__body .dt-fq__a > :last-child{margin-bottom:0}

/* end CTA */
.dtx-art .dtx-art__body .dtb-cta{
  position:relative;overflow:hidden;isolation:isolate;margin:44px 0 0;padding:30px 26px;border-radius:22px;text-align:center;
  background:linear-gradient(180deg,var(--mist),var(--white));border:1px solid var(--mist-border);
}
.dtx-art .dtx-art__body .dtb-cta h2{margin:0 0 8px;padding:0;font-size:clamp(23px,2.4vw,28px)}
.dtx-art .dtx-art__body .dtb-cta h2::before{content:none}
.dtx-art .dtx-art__body .dtb-cta p{margin:0 auto 18px;max-width:52ch;font-size:16.5px;color:var(--slate)}

/* quotes */
/* quotes: in these guides a blockquote is nearly always a sample resume line,
   so it reads as a sample card, not a pull quote */
.dtx-art .dtx-art__body blockquote{
  margin:24px 0;padding:16px 20px;border:1px solid var(--mist-border);border-left:4px solid var(--g);
  border-radius:0 14px 14px 0;background:var(--mist-2);font-style:normal;quotes:none;
}
.dtx-art .dtx-art__body blockquote::before,.dtx-art .dtx-art__body blockquote::after{content:none}
.dtx-art .dtx-art__body blockquote p{margin:0 0 .6em;font-family:var(--fb);font-style:normal;font-size:16.5px;line-height:1.65;font-weight:500;color:var(--ink)}
.dtx-art .dtx-art__body blockquote p:last-child{margin-bottom:0}
.dtx-art .dtx-art__body blockquote em{font-style:normal}

/* author ------------------------------------------------------------------- */
.dtx-art .dtx-art__bio{
  display:grid;grid-template-columns:88px 1fr;gap:22px;align-items:start;
  margin-top:24px;padding:26px;border-radius:20px;background:var(--white);border:1px solid var(--line);
}
.dtx-art .dtx-art__bio .dtx-art__avatar{width:88px;height:88px;box-shadow:0 0 0 3px var(--white),0 0 0 5px var(--g)}
.dtx-art p.dtx-art__bio-k{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--slate)}
.dtx-art p.dtx-art__bio-n{margin-top:4px;font-family:var(--fd);font-weight:700;font-size:21px;line-height:1.2}
.dtx-art p.dtx-art__bio-n a,.dtx-art p.dtx-art__bio-n a:visited{color:var(--g-dark);text-decoration:none}
.dtx-art p.dtx-art__bio-n a:hover{color:var(--g-text)}
.dtx-art p.dtx-art__bio-r{margin-top:2px;font-size:13.5px;font-weight:700;color:var(--g-text)}
.dtx-art p.dtx-art__bio-b{margin:10px 0 8px;font-size:15px;line-height:1.65;color:var(--slate)}
.dtx-art p.dtx-art__bio-links{display:flex;flex-wrap:wrap;gap:4px 20px}

/* related -------------------------------------------------------------------- */
.dtx-art .dtx-art__related{padding-block:clamp(48px,6vw,84px);background:var(--mist);border-top:1px solid var(--mist-border)}
.dtx-art .dtx-art__related-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 18px;margin-bottom:26px}
.dtx-art h2.dtx-art__related-h{font-family:var(--fd);font-weight:700;font-size:clamp(27px,3vw,36px);letter-spacing:-.015em;color:var(--g-dark)}
.dtx-art .dtx-art__cards{margin-top:0}

/* ==========================================================================
   Cards (listing, hero, related)
   ========================================================================== */
.dtx .dtx-pcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(18px,2.2vw,26px);align-items:stretch}
.dtx article.dtx-pc{
  position:relative;display:flex;flex-direction:column;height:100%;border-radius:18px;overflow:hidden;
  background:var(--white);border:1px solid var(--line);box-shadow:0 14px 30px -26px rgba(11,61,30,.7);
  transition:border-color .24s var(--ease),transform .24s var(--ease),box-shadow .24s var(--ease);
}
.dtx article.dtx-pc[hidden]{display:none}
.dtx article.dtx-pc:hover,.dtx article.dtx-pc:focus-within{border-color:var(--g);transform:translateY(-3px);box-shadow:0 24px 44px -30px rgba(11,61,30,.75)}
.dtx .dtx-pc__fig{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(135deg,var(--g-dark),var(--g))}
.dtx .dtx-pc__fig img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .52s var(--ease)}
.dtx article.dtx-pc:hover .dtx-pc__fig img{transform:scale(1.04)}
.dtx .dtx-pc__body{display:flex;flex-direction:column;flex:1 1 auto;padding:20px 22px 22px}
.dtx .dtx-pc__chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:11px}
.dtx .dtx-pc__chip{
  display:inline-flex;padding:4px 10px;border-radius:999px;background:var(--mist);color:var(--g-text);
  font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
}
.dtx article.dtx-pc h3{font-family:var(--fd);font-weight:700;font-size:clamp(18px,1.4vw,20.5px);line-height:1.3;letter-spacing:-.01em}
.dtx article.dtx-pc h3 a,.dtx article.dtx-pc h3 a:visited{
  color:var(--g-dark);text-decoration:none;
  background:linear-gradient(currentColor,currentColor) 0 100% / 0 1.5px no-repeat;transition:background-size .3s var(--ease),color .2s ease;
}
.dtx article.dtx-pc h3 a::after{content:"";position:absolute;inset:0}
.dtx article.dtx-pc:hover h3 a{background-size:100% 1.5px;color:var(--g-text)}
.dtx article.dtx-pc h3 a:focus-visible{outline:none}
.dtx article.dtx-pc:focus-within{outline:2px solid var(--g-text);outline-offset:3px}
.dtx article.dtx-pc p{margin-top:10px;flex:1 1 auto;font-size:14.5px;line-height:1.58;color:#3D4742}
.dtx article.dtx-pc p.dtx-pc__meta{flex:0 0 auto;display:flex;align-items:center;gap:7px;margin-top:16px;font-size:13px;font-weight:600;color:var(--slate)}
.dtx .dtx-pc__meta svg{color:var(--g);flex:0 0 auto}

/* ==========================================================================
   The index
   ========================================================================== */
.dtx.dtx-hero{
  position:relative;overflow:hidden;padding-block:clamp(22px,3vw,34px) clamp(44px,6vw,80px);
  background:
    radial-gradient(55% 80% at 88% 10%,rgba(0,153,51,.12),transparent 70%),
    radial-gradient(40% 60% at 0% 100%,rgba(61,220,132,.12),transparent 70%),
    linear-gradient(180deg,var(--mist) 0%,var(--white) 100%);
}
.dtx .dtx-hero__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,72px);align-items:center;margin-top:clamp(22px,3vw,36px)}
.dtx .dtx-pill{
  display:inline-flex;align-items:center;gap:9px;height:32px;padding:0 14px;border-radius:999px;
  background:var(--white);border:1px solid var(--mist-border);
  font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--g-text);
}
.dtx .dtx-pill i{width:7px;height:7px;border-radius:999px;background:var(--g);box-shadow:0 0 0 4px rgba(0,153,51,.16)}
.dtx h1.dtx-hero__h1{
  margin-top:18px;font-family:var(--fd);font-weight:700;font-size:clamp(34px,4.8vw,60px);line-height:1.06;letter-spacing:-.025em;
  color:var(--g-dark);text-wrap:balance;
}
.dtx .dtx-mark{
  color:var(--g-text);
  background:linear-gradient(transparent 62%,rgba(61,220,132,.35) 62%,rgba(61,220,132,.35) 92%,transparent 92%);
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.dtx p.dtx-hero__lead{margin-top:20px;max-width:58ch;font-size:clamp(16.5px,1.5vw,19px);line-height:1.62;color:var(--slate)}
.dtx .dtx-hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.dtx .dtx-hero__feat{position:relative}
.dtx .dtx-hero__feat::before{
  content:"";position:absolute;inset:18px -18px -18px 18px;border-radius:22px;
  background:repeating-linear-gradient(135deg,rgba(0,153,51,.14) 0 2px,transparent 2px 12px);z-index:0;
}
.dtx p.dtx-hero__feat-k{
  position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;
  font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--g-text);
}
.dtx .dtx-hero__feat article.dtx-pc{z-index:1;box-shadow:0 30px 60px -36px rgba(11,61,30,.7)}
.dtx .dtx-hero__feat article.dtx-pc h3{font-size:clamp(20px,1.8vw,24px)}

.dtx.dtx-band{padding-block:clamp(48px,6vw,88px)}
.dtx.dtx-mist{background:var(--mist-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dtx .dtx-tool{padding-bottom:clamp(22px,2.6vw,30px)}
.dtx h2.dtx-tool__h{margin-bottom:clamp(16px,2vw,22px);font-family:var(--fd);font-weight:700;font-size:clamp(28px,2.8vw,38px);letter-spacing:-.02em;color:var(--g-dark)}
.dtx .dtx-tool__row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-bottom:16px}
.dtx .dtx-search{position:relative;flex:1 1 320px;min-width:0;display:flex;align-items:center}
.dtx .dtx-search svg{position:absolute;left:18px;color:var(--g-text);pointer-events:none}
.dtx input.dtx-search__in{
  width:100%;height:54px;margin:0;padding:0 18px 0 50px;border-radius:16px;
  background:var(--white);border:1px solid var(--line-strong);box-shadow:none;
  font-family:var(--fb);font-size:16px;color:var(--ink);transition:border-color .2s ease,box-shadow .2s ease;
}
.dtx input.dtx-search__in::placeholder{color:#6B7670;opacity:1}
.dtx input.dtx-search__in:hover{border-color:var(--g)}
.dtx input.dtx-search__in:focus{outline:none;border-color:var(--g-text);box-shadow:0 0 0 4px rgba(0,153,51,.16)}
.dtx p.dtx-tool__count{flex:0 0 auto;padding:10px 14px;border-radius:12px;background:var(--white);border:1px solid var(--line);font-size:13.5px;font-weight:700;color:var(--g-dark)}
.dtx .dtx-fchips{display:flex;flex-wrap:wrap;gap:8px}
.dtx button.dtx-fchip{
  appearance:none;height:42px;margin:0;padding:0 18px;border-radius:999px;cursor:pointer;
  background:var(--white);border:1px solid var(--line-strong);color:var(--ink-2);
  font-family:var(--fb);font-size:14px;font-weight:700;line-height:1;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s var(--ease);
}
.dtx button.dtx-fchip:hover{background:var(--white);border-color:var(--g-text);color:var(--g-text);transform:translateY(-1px)}
.dtx button.dtx-fchip.is-on,.dtx button.dtx-fchip.is-on:hover,.dtx button.dtx-fchip.is-on:focus{background:var(--g-dark);border-color:var(--g-dark);color:var(--white)}
.dtx button.dtx-fchip:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(0,153,51,.4)}
.dtx .dtx-empty{padding:clamp(26px,4vw,44px) 0;text-align:center;font-size:15.5px;color:var(--slate)}
.dtx .dtx-empty[hidden]{display:none}
.dtx .dtx-more{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:clamp(28px,3.4vw,40px)}
.dtx .dtx-more [hidden]{display:none}
.dtx p.dtx-more__end{font-size:13.5px;color:var(--slate)}

/* closing band */
.dtx.dtx-dark{position:relative;overflow:hidden;isolation:isolate;background:var(--g-dark);color:var(--white)}
.dtx.dtx-dark::before{
  content:"";position:absolute;z-index:-1;right:-10%;top:-40%;width:60%;height:180%;
  background:radial-gradient(closest-side,rgba(0,153,51,.5),transparent 72%);
}
.dtx .dtx-close{display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:24px 48px;align-items:center}
.dtx .dtx-tag{display:inline-flex;font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--g-bright)}
.dtx h2.dtx-close__h{margin-top:12px;font-family:var(--fd);font-weight:700;font-size:clamp(27px,3vw,40px);line-height:1.15;letter-spacing:-.02em;color:var(--white);text-wrap:balance}
.dtx p.dtx-close__b{margin-top:14px;max-width:60ch;font-size:16.5px;line-height:1.65;color:rgba(238,247,241,.84)}
.dtx .dtx-close__acts{display:flex;flex-wrap:wrap;gap:12px}

/* focus */
.dtx a:focus-visible,.dtx button:focus-visible,.dtx summary:focus-visible{outline:2px solid var(--g-text);outline-offset:3px;border-radius:10px}
.dtx .dtx-dark a:focus-visible,.dtx .dtx-art__cta a:focus-visible{outline-color:var(--g-bright)}

/* ==========================================================================
   Breakpoints
   ========================================================================== */
@media (max-width:1439.98px){
  .dtx-art{--art-rail:210px;--art-gap:32px}
  .dtx-art .dtx-art__cta{padding:20px 18px 18px}
  .dtx-art p.dtx-art__cta-h{font-size:18.5px}
  .dtx-art p.dtx-art__cta-b{font-size:13.5px}
  .dtx-art .dtx-art__lm{grid-template-columns:1fr;row-gap:8px}
  .dtx-art .dtx-art__lm-ic{grid-row:auto}
  .dtx-art .dtx-art__rail a.dtx-btn{font-size:13.5px;padding:0 12px}
  .dtx-art .dtx-art__rail a.dtx-btn svg{display:none}
}

/* no rails: contents, offer and sharing fold into the column */
@media (max-width:1239.98px){
  .dtx-art .dtx-art__grid{grid-template-columns:minmax(0,var(--art-col))}
  .dtx-art .dtx-art__rail{display:none}
  .dtx-art .dtx-art__main{grid-column:1}
  .dtx-art details.dtx-art__toc-m{display:block}
  .dtx-art .dtx-art__body aside.dtx-art__cta--inline{display:block}
}

@media (max-width:980px){
  .dtx .dtx-hero__grid{grid-template-columns:1fr}
  .dtx .dtx-hero__feat{max-width:560px}
  .dtx .dtx-close{grid-template-columns:1fr}
}

@media (max-width:760px){
  .dtx-art{--art-top:84px}
  .dtx-art .dtx-art__hero-w{text-align:left;align-items:flex-start}
  .dtx-art .dtx-art__crumbs ol{justify-content:flex-start}
  .dtx-art .dtx-art__crumbs [aria-current]{max-width:22ch}
  .dtx-art .dtx-art__eyebrow{justify-content:flex-start}
  .dtx-art h1.dtx-art__h1{max-width:none;font-size:clamp(29px,7.6vw,36px);line-height:1.14}
  .dtx-art p.dtx-art__dek{font-size:16.5px}
  .dtx-art .dtx-art__byline{align-self:stretch;justify-content:space-between;border-radius:18px;padding:10px 12px}
  .dtx-art figure.dtx-art__cover{margin-top:24px}

  .dtx-art .dtx-art__body{font-size:17px;line-height:1.72}
  .dtx-art .dtx-art__body h2{font-size:25px;margin-top:1.9em}
  .dtx-art .dtx-art__body h3{font-size:19px}
  .dtx-art .dtx-art__body .dtb-takeaways,
  .dtx-art .dtx-art__body .dt-po__key,
  .dtx-art .dtx-art__body .dtb-callout{padding:18px}
  .dtx-art .dtx-art__body figure,
  .dtx-art .dtx-art__body .dtb-figure{margin-inline:calc(var(--gut) * -1)}
  .dtx-art .dtx-art__body figure img{border-radius:0;border-inline:0}
  .dtx-art .dtx-art__body figcaption{padding-inline:var(--gut)}
  .dtx-art .dtx-art__body .dtb-kit figure,.dtx-art .dtx-art__body .dtb-kit img{margin-inline:0;border-radius:12px}
  .dtx-art .dtx-art__body a.dtb-btn,
  .dtx-art .dtx-art__body .dtx-art__cta a.dtx-btn{width:100%}
  .dtx-art .dtx-art__body ol.dtb-steps > li{padding:56px 16px 16px}
  .dtx-art .dtx-art__body ol.dtb-steps > li::before{top:14px}

  .dtx-art .dtx-art__share--bar{flex-direction:column;align-items:flex-start}
  .dtx-art .dtx-art__bio{grid-template-columns:1fr;gap:14px;padding:22px}
  .dtx-art .dtx-art__bio .dtx-art__avatar{width:72px;height:72px}

  .dtx .dtx-pcs{grid-template-columns:1fr;gap:14px}
  .dtx .dtx-hero__feat::before{inset:12px -8px -12px 12px}
  .dtx .dtx-hero__cta .dtx-btn{flex:1 1 auto}
  .dtx .dtx-tool__row{gap:12px}
  .dtx p.dtx-tool__count{order:3;width:100%;padding:0;border:0;background:none}
  .dtx .dtx-fchips{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);padding-bottom:4px;scrollbar-width:none}
  .dtx .dtx-fchips::-webkit-scrollbar{display:none}
  .dtx button.dtx-fchip{flex:0 0 auto;scroll-snap-align:start;height:40px;padding:0 15px;font-size:13.5px}
  .dtx input.dtx-search__in{height:50px;font-size:16px}
  .dtx .dtx-close__acts .dtx-btn{flex:1 1 auto}
}

@media (prefers-reduced-motion:reduce){
  .dtx *,.dtx *::before,.dtx *::after{transition:none !important;animation:none !important}
  .dtx-art-progress{display:none}
}

@media print{
  .dtx-art-progress,.dtx-art .dtx-art__rail,.dtx-art .dtx-art__share,.dtx-art details.dtx-art__toc-m,
  .dtx-art aside.dtx-art__cta,.dtx-art .dtx-art__related{display:none !important}
  .dtx-art .dtx-art__grid{display:block}
}