/* Extensions for the full production corpus, preserving the approved tokens. */
[data-dn2-page] .case-body .client-visual-notice,
[data-dn2-page] .proj-hero-media .client-visual-notice {
  color: #526170;
  font: 400 12px/1.5 Inter, sans-serif;
  letter-spacing: 0;
  margin: 0 0 14px;
  text-align: left;
}
[data-dn2-page] .proj-hero-media .client-visual-notice {
  padding: 12px 16px;
  margin: 0;
  background: #f3f5f7;
}
[data-dn2-page] .article-body-main { min-width: 0; }
[data-dn2-page] .article-body-main pre { overflow-x: auto; max-width: 100%; }
[data-dn2-page] .article-body-main table { display: block; max-width: 100%; overflow-x: auto; }
[data-dn2-page] .article-body-main img { max-width: 100%; height: auto; }
[data-dn2-page] .service-photo-copy p { min-height: 4.8em; }
[data-dn2-page] .proj-hero-media { aspect-ratio: auto; }
[data-dn2-page] .proj-hero-media img { height: auto; object-fit: contain; }
[data-dn2-page] .content-filters { flex-wrap: wrap; }
[data-dn2-page] .blog-tabs.content-filters { overflow: visible; }
[data-dn2-page] .content-filters a {
  border: 1px solid #cdd4dd;
  border-radius: 25px;
  background: #fff;
  color: var(--ink);
  padding: 10px 16px;
  min-height: 44px;
  font: 400 12px/1.5 Inter, sans-serif;
  text-decoration: none;
}
[data-dn2-page] .content-filters a[aria-current="page"] {
  background: #0a1628;
  border-color: #0a1628;
  color: #fff;
}
[data-dn2-page] .dn2-footer .footer-social {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin-top: 16px;
}
[data-dn2-page] .proj-proof + .proj-proof { margin-top: 12px; }
[data-dn2-page] .post[hidden] { display: none !important; }
[data-dn2-page] .reference-hero h1 { overflow-wrap: break-word; }
[data-dn2-page] .article-body-main ul, [data-dn2-page] .article-body-main ol { padding-inline-start: 2rem; }
@media(max-width:600px) {
  [data-dn2-page] .proj-proof { flex-wrap: wrap; border-radius: 20px; }
  [data-dn2-page] .proj-proof strong { white-space: normal; }
  [data-dn2-page] .article-body-main { overflow-wrap: anywhere; }
}

/* Case-study schemas: live HTML nodes over an inline SVG, scaled by container width. */
[data-dn2-page] .cs-schema {
  position: relative; width: 100%; aspect-ratio: 1.6; container-type: size;
  background: #f3f5f7; overflow: hidden; color: #0a1628;
}
/* cqw resolves against the nearest ancestor container, so type is set on the children. */
[data-dn2-page] .cs-schema :is(.cs-node, .cs-band, .cs-legend, .cs-pill) {
  font: 500 max(9px, 2.5cqw)/1.25 Inter, sans-serif; letter-spacing: .03em; text-transform: uppercase;
}
[data-dn2-page] .cs-lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; }
[data-dn2-page] .cs-node {
  position: absolute; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 0 .6cqw; background: #fff; border: 1px solid #cdd4dd; border-radius: 1.2cqw; text-align: center;
}
[data-dn2-page] .cs-key::before { content: ""; width: 2.4cqw; height: 2.4cqw; margin-bottom: .9cqw; border-radius: 50%; background: #b9fc80; }
[data-dn2-page] .cs-alt { border-color: #1d8ef0; }
[data-dn2-page] .cs-lane.cs-alt { border-color: #1d8ef0; }
[data-dn2-page] .cs-schema .cs-band {
  position: absolute; box-sizing: border-box; display: flex; align-items: center; gap: 2cqw; padding: 0 1.6cqw;
  border: 1px dashed #8a97a6; border-radius: 1cqw; color: #526170; font-size: max(8px, 2.1cqw);
}
[data-dn2-page] .cs-band i {
  flex: 1; height: 1.1cqw;
  background: repeating-linear-gradient(90deg, #8a97a6 0 .9cqw, transparent .9cqw 2.2cqw);
}
[data-dn2-page] .cs-schema .cs-legend { position: absolute; display: flex; flex-direction: column; gap: 1.2cqw; color: #526170; font-size: max(8px, 2.1cqw); }
[data-dn2-page] .cs-legend span { display: flex; align-items: center; gap: 1.2cqw; }
[data-dn2-page] .cs-legend b { width: 2cqw; height: 2cqw; border-radius: 50%; border: 1px solid #0a1628; }
[data-dn2-page] .cs-lime { background: #b9fc80; }
[data-dn2-page] .cs-blue { background: #1d8ef0; }
[data-dn2-page] .cs-schema .cs-pill {
  position: absolute; box-sizing: border-box; display: flex; align-items: center; justify-content: center;
  border: 1px solid #cdd4dd; border-radius: 99px; background: #fff; color: #526170; font-size: max(8px, 2.1cqw);
}
[data-dn2-page] .cs-panel { align-items: stretch; justify-content: flex-start; padding: 1.8cqw 1.6cqw; }
[data-dn2-page] .cs-panel > span { text-align: left; }
[data-dn2-page] .cs-bars { flex: 1; display: flex; align-items: flex-end; gap: 1.6cqw; margin-top: 1.4cqw; border-bottom: 1px solid #cdd4dd; }
[data-dn2-page] .cs-bar { flex: 1; display: block; background: #0a1628; border-radius: .5cqw .5cqw 0 0; transform-origin: bottom; }
[data-dn2-page] .cs-b1 { height: 38%; } [data-dn2-page] .cs-b2 { height: 64%; background: #1d8ef0; }
[data-dn2-page] .cs-b3 { height: 50%; } [data-dn2-page] .cs-b4 { height: 82%; background: #b9fc80; box-shadow: inset 0 0 0 1px #0a1628; }
@media (prefers-reduced-motion: no-preference) {
  [data-dn2-page] .cs-bar { animation: cs-grow 5s ease-in-out infinite alternate; }
  [data-dn2-page] .cs-b2 { animation-delay: -1s; } [data-dn2-page] .cs-b3 { animation-delay: -2s; } [data-dn2-page] .cs-b4 { animation-delay: -3s; }
  @keyframes cs-grow { from { transform: scaleY(.82); } to { transform: scaleY(1); } }
  [data-dn2-page] .cs-lane-old, [data-dn2-page] .cs-g-old { animation: cs-old 12s ease-in-out infinite; }
  [data-dn2-page] .cs-lane-new, [data-dn2-page] .cs-g-new { animation: cs-new 12s ease-in-out infinite; }
  [data-dn2-page] .cs-pill { animation: cs-pill 12s ease-in-out infinite; }
  [data-dn2-page] .cs-p2 { animation-delay: -8s; } [data-dn2-page] .cs-p3 { animation-delay: -4s; }
  @keyframes cs-old { 0%,60% { opacity: 1; } 68%,94% { opacity: .3; } 100% { opacity: 1; } }
  @keyframes cs-new { 0%,26% { opacity: .3; } 34%,94% { opacity: 1; } 100% { opacity: .3; } }
  @keyframes cs-pill { 0%,30% { background: #b9fc80; border-color: #0a1628; color: #0a1628; } 34%,100% { background: #fff; border-color: #cdd4dd; color: #526170; } }
}
@media (prefers-reduced-motion: reduce) {
  [data-dn2-page] .cs-dot { display: none; }
  [data-dn2-page] .cs-p1 { background: #b9fc80; border-color: #0a1628; color: #0a1628; }
}
[data-dn2-page] .case-thumb.case-thumb-schema { background: #f3f5f7; position: relative; }
[data-dn2-page] .case-thumb.case-thumb-schema .cs-schema { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
[data-dn2-page] .proj-hero-media:has(.cs-schema) { aspect-ratio: auto; background: #f3f5f7; border: 1px solid #dce2e8; box-shadow: none; }

/* Case-study detail blocks */
[data-dn2-page] .proj-main h3 { font-size: 19px; line-height: 1.4; margin: 28px 0 6px; }
[data-dn2-page] .cs-list { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
[data-dn2-page] .cs-list li { position: relative; padding-left: 28px; }
[data-dn2-page] .cs-list li::before { content: ""; position: absolute; left: 0; top: .78em; width: 10px; height: 10px; border-radius: 50%; background: #b9fc80; box-shadow: 0 0 0 1px #0a1628; }
[data-dn2-page] .cs-steps { counter-reset: cs; list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 0; }
[data-dn2-page] .cs-steps li { counter-increment: cs; position: relative; padding: 14px 0 14px 56px; border-top: 1px solid #dce2e8; }
[data-dn2-page] .cs-steps li:last-child { border-bottom: 1px solid #dce2e8; }
[data-dn2-page] .cs-steps li::before {
  content: counter(cs); position: absolute; left: 0; top: 15px; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font: 500 13px/1 Inter, sans-serif; color: #0a1628; background: #b9fc80;
}
[data-dn2-page] .cs-steps strong { display: block; font-weight: 600; color: #0a1628; }
[data-dn2-page] .proj-card .cs-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
[data-dn2-page] .proj-card .cs-tags li { font: 400 12px/1.4 Inter, sans-serif; padding: 5px 10px; border: 1px solid #cdd4dd; border-radius: 99px; background: #fff; }