/* Dynamic Structure Systems: page-specific visualizations and article components. Shared Publications layout: publications.css. */
.dss-content {

  color-scheme:light;

  --bg:#ffffff;

  --surface:#ffffff;

  --subtle:#f6f6f6;

  --ink:#333333;

  --headline:#6d6d6d;

  --muted:#707070;

  --accent:#636363;

  --accent-dark:#4a4a4a;

  --border:#e3e3e3;

  --border-strong:#d0d0d0;

  --width:1140px;

  --reading:750px;

  --radius:12px;

}

.dss-content, .dss-content * {
  box-sizing:border-box
}

.dss-content a {
  color:var(--accent-dark);
  text-underline-offset:.19em;
  text-decoration-thickness:1px
}

.dss-content a:hover {
  color:#4b4b4b
}

.dss-content a:focus-visible, .dss-content button:focus-visible {
  outline:3px solid #adadad;
  outline-offset:4px;
  border-radius:3px
}



























.dss-content .breadcrumbs {
  font-size:.76rem;
  letter-spacing:.02em;
  color:var(--muted);
  padding-top:27px;
  padding-bottom:22px
}

.dss-content .breadcrumbs a {
  color:inherit;
  text-decoration:none
}

.dss-content .breadcrumbs a:hover {
  text-decoration:underline
}

.dss-content .breadcrumbs .sep {
  margin:0 10px;
  color:#c9c9c9
}

.dss-content .hero {
  padding:44px 0 63px;
  border-bottom:1px solid var(--border)
}

.dss-content .eyebrow {
  font-size:.74rem;
  font-weight:620;
  letter-spacing:.145em;
  text-transform:uppercase;
  color:var(--accent);
  margin:0 0 19px
}

.dss-content h1, .dss-content h2, .dss-content h3 {
  color:var(--headline);
  line-height:1.23;
  letter-spacing:-.025em
}

.dss-content h1 {
  font-size:clamp(2.4rem,4.45vw,4.2rem);
  font-weight:540;
  max-width:980px;
  margin:0
}

.dss-content .hero-subtitle {
  font-size:clamp(1.04rem,2vw,1.32rem);
  max-width:790px;
  color:#808080;
  line-height:1.52;
  margin:25px 0 29px;
  font-weight:390
}





.dss-content .hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:29px 0 0
}

.dss-content .button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:11px 18px;
  text-decoration:none;
  font-size:.85rem;
  font-weight:550;
  letter-spacing:.015em;
  border:1px solid var(--border-strong);
  border-radius:5px;
  gap:9px;
  transition:background .15s ease
}

.dss-content .button-primary {
  background:var(--accent-dark);
  border-color:var(--accent-dark);
  color:#ffffff
}

.dss-content .button-primary:hover {
  background:#4e4e4e;
  color:#ffffff
}

.dss-content .button-secondary {
  background:#ffffff;
  color:var(--accent-dark)
}

.dss-content .button-secondary:hover {
  background:var(--subtle)
}

.dss-content .layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 235px;
  gap:clamp(50px,7vw,100px);
  align-items:start;
  padding-top:66px;
  padding-bottom:80px
}

.dss-content .reading {
  max-width:var(--reading);
  min-width:0
}

.dss-content .reading section {
  margin-bottom:64px
}

.dss-content .reading section>h2 {
  font-size:clamp(1.6rem,2.3vw,2.15rem);
  font-weight:540;
  margin:0 0 21px
}

.dss-content .reading h3 {
  font-size:1.09rem;
  margin:0 0 11px;
  color:#717171;
  font-weight:630;
  letter-spacing:-.01em
}

.dss-content .reading p {
  margin:0 0 17px
}

.dss-content .lead {
  font-size:1.13rem;
  line-height:1.76;
  color:#717171
}

.dss-content .reading em {
  font-style:italic
}

.dss-content .kicker {
  font-size:.74rem;
  letter-spacing:.115em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:610;
  margin-bottom:9px!important
}







.dss-content .insights {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;
  margin-top:23px
}

.dss-content .insight {
  padding:22px 23px;
  border:1px solid var(--border);
  border-radius:8px;
  background:#ffffff
}

.dss-content .insight h3 {
  font-size:1.04rem;
  margin:0 0 8px
}

.dss-content .insight p {
  font-size:.94rem;
  color:#787878;
  line-height:1.62;
  margin:0
}

.dss-content .micro-label {
  display:inline-block;
  font-size:.7rem;
  letter-spacing:.1em;
  color:var(--accent);
  text-transform:uppercase;
  margin:0 0 14px;
  font-weight:650
}

.dss-content .diagram {
  margin-top:28px;
  border:1px solid var(--border);
  border-radius:9px;
  background:linear-gradient(180deg,#ffffff 0%,#ffffff 100%);
  padding:24px 23px 20px
}

.dss-content .diagram-main {
  max-width:470px;
  border:1px solid #d7d7d7;
  background:#f7f7f7;
  padding:15px 22px;
  text-align:center;
  margin:0 auto 24px;
  border-radius:6px;
  color:#575757;
  font-weight:600
}

.dss-content .diagram-main small {
  display:block;
  font-weight:400;
  line-height:1.4;
  color:#8d8d8d;
  margin-top:3px
}

.dss-content .diagram-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  position:relative
}

.dss-content .diagram-grid:before {
  content:"";
  height:15px;
  width:1px;
  position:absolute;
  top:-20px;
  left:50%;
  background:#d2d2d2
}

.dss-content .diagram-grid span {
  text-align:center;
  font-size:.79rem;
  font-weight:560;
  color:#7f7f7f;
  border:1px solid var(--border);
  background:#ffffff;
  padding:13px 6px;
  border-radius:5px
}

.dss-content figcaption {
  font-size:.75rem;
  color:var(--muted);
  line-height:1.52;
  margin-top:14px
}

.dss-content .comparison {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:24px 0
}

.dss-content .comparison>div {
  padding:23px 22px;
  border-radius:8px;
  border:1px solid var(--border)
}

.dss-content .comparison>div:first-child {
  background:#ffffff
}

.dss-content .comparison>div:last-child {
  background:#f8f8f8
}

.dss-content .comparison p {
  font-size:.94rem;
  color:#767676;
  margin:0
}





































.dss-content .sidebar {
  position:sticky;
  top:22px;
  padding-top:6px
}

.dss-content .sidebar>p {
  margin:0 0 17px;
  color:var(--muted);
  font-size:.75rem;
  letter-spacing:.11em;
  text-transform:uppercase;
  font-weight:700
}

.dss-content .sidebar nav {
  display:flex;
  flex-direction:column;
  border-left:1px solid var(--border);
  gap:0
}

.dss-content .sidebar nav a {
  color:#8e8e8e;
  text-decoration:none;
  font-size:.84rem;
  line-height:1.45;
  padding:10px 0 10px 17px;
  margin-left:-1px;
  border-left:2px solid transparent
}

.dss-content .sidebar nav a:hover {
  color:var(--accent-dark);
  border-left-color:#c9c9c9
}

.dss-content .sidebar .side-footnote {
  border-top:1px solid var(--border);
  margin-top:22px;
  padding-top:18px;
  color:var(--muted);
  font-size:.77rem;
  line-height:1.5
}



















@media (max-width:900px) {
  .dss-content .layout {
    grid-template-columns:minmax(0,1fr);
    gap:0;
    padding-top:51px
  }

  .dss-content .sidebar {
    display:none
  }

  .dss-content .reading {
    max-width:780px
  }

  

  

  

  .dss-content .hero {
    padding-top:28px;
    padding-bottom:50px
  }
}

@media (max-width:670px) {
  

  

  

  

  

  

  

  

  .dss-content .breadcrumbs {
    padding-top:19px;
    padding-bottom:8px;
    font-size:.74rem
  }

  .dss-content .hero {
    padding-top:29px;
    padding-bottom:40px
  }

  .dss-content h1 {
    font-size:clamp(2.18rem,10vw,3rem);
    letter-spacing:-.038em
  }

  .dss-content .hero-subtitle {
    font-size:1.09rem;
    margin:23px 0
  }

  

  

  

  .dss-content .hero-actions {
    flex-direction:column;
    align-items:stretch
  }

  .dss-content .button {
    min-height:47px
  }

  .dss-content .layout {
    padding-top:44px;
    padding-bottom:55px
  }

  .dss-content .reading section {
    margin-bottom:52px
  }

  .dss-content .reading section>h2 {
    font-size:1.7rem
  }

  .dss-content .lead {
    font-size:1.04rem
  }

  .dss-content .insights, .dss-content .comparison {
    grid-template-columns:1fr
  }

  .dss-content .diagram {
    padding:20px 16px
  }

  .dss-content .diagram-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px
  }

  .dss-content .diagram-grid:before {
    display:none
  }

  .dss-content .diagram-grid span {
    font-size:.77rem
  }

  

  

  

  
}

@media (prefers-reduced-motion:reduce) {
  .dss-content .button {
    transition:none
  }
}

@media print {
  .dss-content .site-header, .dss-content .site-footer, .dss-content .sidebar, .dss-content .hero-actions, .dss-content .breadcrumbs, .dss-content .skip {
    display:none!important
  }

  .dss-content .layout {
    display:block;
    padding-top:15px
  }

  .dss-content .reading {
    max-width:none
  }

  .dss-content .hero {
    padding:5px 0 20px
  }

  .dss-content h1 {
    font-size:25pt
  }

  .dss-content .insight, .dss-content .publication-panel, .dss-content .diagram {
    break-inside:avoid
  }
}

.dss-content .hero {
  position:relative;
  padding:54px 0 62px
}

.dss-content .hero:before {
  content:"";
  position:absolute;
  right:0;
  top:32px;
  width:min(23vw,250px);
  height:4px;
  background:linear-gradient(90deg,#d8d8d8,#8d8d8d);
  opacity:.8
}

.dss-content .hero h1 {
  font-size:clamp(2.85rem,5.2vw,4.65rem);
  max-width:880px;
  line-height:1.13
}

.dss-content .hero-subtitle {
  max-width:790px;
  font-size:clamp(1.15rem,2vw,1.47rem);
  font-weight:430;
  margin:23px 0 22px
}

.dss-content .hero-tagline {
  max-width:770px;
  color:#797979;
  font-size:1.07rem;
  line-height:1.7;
  margin:0 0 26px
}



.dss-content .reading section {
  margin-bottom:65px
}

.dss-content .reading section>h2 {
  font-size:clamp(1.8rem,2.8vw,2.35rem);
  max-width:770px
}

.dss-content .lead {
  font-size:1.16rem;
  line-height:1.75
}









.dss-content .insight {
  padding:23px 24px
}

.dss-content .insight p {
  line-height:1.65
}



















.dss-content .proof-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
  margin-top:18px
}

.dss-content .proof-item {
  border:1px solid var(--border);
  background:#ffffff;
  border-radius:8px;
  padding:21px 21px 19px
}

.dss-content .proof-item h3 {
  margin:0 0 10px;
  color:#6f6f6f
}

.dss-content .proof-item p {
  color:#7f7f7f;
  font-size:.9rem;
  line-height:1.6;
  margin-bottom:9px
}

.dss-content .proof-item a {
  font-size:.85rem;
  font-weight:600
}







.dss-content .closing-cta .button {
  min-height:45px
}

.dss-content .sidebar .side-key {
  border-top:1px solid var(--border);
  margin-top:25px;
  padding-top:19px;
  font-size:.9rem;
  color:#7c7c7c;
  line-height:1.55
}

.dss-content .sidebar .side-key strong {
  display:block;
  color:#585858;
  font-size:.98rem;
  margin-bottom:5px
}



@media (max-width:670px) {
  .dss-content .hero:before {
    display:none
  }

  .dss-content .hero h1 {
    font-size:clamp(2.35rem,10vw,3.3rem)
  }

  .dss-content .hero-subtitle {
    font-size:1.15rem
  }

  .dss-content .hero-tagline {
    font-size:1rem
  }

  .dss-content .outcome-strip, .dss-content .proof-grid {
    grid-template-columns:1fr
  }

  

  
}

.dss-content .inversion-section {
  scroll-margin-top:30px
}

.dss-content .inversion-visual {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:28px 0 25px
}

.dss-content .inversion-track {
  padding:24px 23px 22px;
  border:1px solid var(--border);
  border-radius:8px;
  min-width:0
}

.dss-content .inversion-old {
  background:#ffffff
}

.dss-content .inversion-new {
  background:#f7f7f7;
  border-color:#dddddd
}

.dss-content .inversion-label {
  display:block;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.105em;
  color:#8c8c8c;
  font-weight:700;
  margin-bottom:17px
}

.dss-content .inversion-new .inversion-label {
  color:#575757
}

.dss-content .inversion-steps {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px;
  margin-bottom:17px;
  flex-wrap:nowrap
}

.dss-content .inversion-steps span {
  font-size:clamp(.79rem,1.22vw,.97rem);
  color:#808080;
  font-weight:650;
  line-height:1.25
}

.dss-content .inversion-new .inversion-steps span {
  color:#565656
}

.dss-content .inversion-steps b {
  color:#bcbcbc;
  font-size:1.03rem;
  font-weight:400
}

.dss-content .inversion-new .inversion-steps b {
  color:#a1a1a1
}

.dss-content .inversion-track p {
  font-size:.89rem;
  line-height:1.58;
  margin:0;
  color:#828282
}

.dss-content .inversion-bridge {
  border-left:3px solid #a5a5a5;
  padding:12px 0 12px 18px;
  color:#717171;
  font-size:1.02rem;
  line-height:1.66;
  margin:19px 0 28px!important
}





.dss-content .inversion-benefit .micro-label {
  margin-bottom:8px
}







@media (max-width:670px) {
  .dss-content .inversion-visual {
    grid-template-columns:1fr;
    gap:12px
  }

  .dss-content .inversion-track {
    padding:22px 20px
  }

  .dss-content .inversion-steps span {
    font-size:clamp(.86rem,3.5vw,1rem)
  }

  .dss-content .inversion-bridge {
    font-size:.98rem
  }
}

@media print {
  .dss-content .inversion-track, .dss-content .inversion-benefit {
    break-inside:avoid
  }
}









.dss-content .advantage .micro-label {
  font-size:.69rem;
  margin-bottom:12px
}





@media (max-width:900px) {
  
}

@media (max-width:670px) {
  
}

@media print {
  
}

.dss-content .living-section {
  scroll-margin-top:30px
}

.dss-content .identity-pivot {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px;
  margin:27px 0 29px
}

.dss-content .identity-side {
  padding:24px 23px 23px;
  border:1px solid var(--border);
  border-radius:8px;
  background:#ffffff
}

.dss-content .identity-side.future {
  background:#f7f7f7;
  border-color:#dddddd
}

.dss-content .identity-side .micro-label {
  margin-bottom:10px
}

.dss-content .identity-side h3 {
  font-size:1.06rem;
  margin:0 0 11px
}

.dss-content .identity-side p {
  font-size:.94rem;
  color:#7b7b7b;
  line-height:1.67;
  margin:0
}

.dss-content .intelligence-loop {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:11px;
  margin:27px 0 20px
}

.dss-content .intelligence-stage {
  border-top:2px solid #adadad;
  background:#f9f9f9;
  padding:21px 18px 22px
}

.dss-content .intelligence-stage .micro-label {
  margin-bottom:8px;
  font-size:.68rem
}

.dss-content .intelligence-stage h3 {
  font-size:1rem;
  line-height:1.4;
  margin:0 0 9px
}

.dss-content .intelligence-stage p {
  font-size:.89rem;
  line-height:1.63;
  color:#7d7d7d;
  margin:0
}







@media (max-width:670px) {
  .dss-content .identity-pivot, .dss-content .intelligence-loop {
    grid-template-columns:1fr
  }

  .dss-content .identity-side {
    padding:21px 19px
  }

  .dss-content .intelligence-stage {
    padding:20px 18px
  }

  
}

@media print {
  .dss-content .identity-side, .dss-content .intelligence-stage, .dss-content .living-thesis {
    break-inside:avoid
  }
}







.dss-content a, .dss-content a:hover {
  color:var(--accent-dark)
}

.dss-content a:focus-visible, .dss-content button:focus-visible {
  outline-color:#8e8e8e
}

.dss-content .hero:before {
  background:linear-gradient(90deg,#e2e2e2,#8e8e8e);
  opacity:.65
}

.dss-content .eyebrow, .dss-content .kicker, .dss-content .micro-label, .dss-content .panel-label {
  color:#666666
}

.dss-content .hero-subtitle, .dss-content .hero-tagline {
  color:#585858
}

.dss-content .button-primary {
  background:#4c4c4c;
  border-color:#4c4c4c;
  color:#fff
}

.dss-content .button-primary:hover {
  background:#363636;
  color:#fff
}

.dss-content .button-secondary {
  color:#484848;
  background:#fff
}



.dss-content .diagram {
  background:linear-gradient(180deg,#fff 0%,#f8f8f8 100%)
}

.dss-content .diagram-main {
  background:#f1f1f1;
  border-color:#d0d0d0;
  color:#4c4c4c
}

.dss-content .diagram-grid:before {
  background:#c8c8c8
}





.dss-content .inversion-old, .dss-content .identity-side {
  background:#f8f8f8
}

.dss-content .inversion-new, .dss-content .identity-side.future {
  background:#f2f2f2;
  border-color:#dbdbdb
}

.dss-content .inversion-bridge, .dss-content .dominance-statement, .dss-content .living-thesis {
  border-left-color:#a5a5a5
}

.dss-content .advantage, .dss-content .intelligence-stage {
  background:#f7f7f7;
  border-color:#e4e4e4
}

.dss-content .intelligence-stage {
  border-top-color:#b2b2b2
}











.dss-content .lead, .dss-content .reading .lead {
  color:#545454
}

.dss-content .identity-side p, .dss-content .intelligence-stage p, .dss-content .inversion-track p, .dss-content .advantage p, .dss-content .domain p, .dss-content .proof-item p, .dss-content .insight p, .dss-content .comparison p, .dss-content .outcome p, .dss-content .concept p, .dss-content .publication-panel p, .dss-content .closing-cta p, .dss-content .offer-panel p, .dss-content .segment p, .dss-content .inversion-benefit p, .dss-content .dominance-statement p, .dss-content .living-thesis p {
  color:#555555
}

.dss-content .identity-side h3, .dss-content .intelligence-stage h3, .dss-content .proof-item h3, .dss-content .outcome strong, .dss-content .inversion-benefit h3 {
  color:#4c4c4c
}

.dss-content .sidebar nav a, .dss-content .source-note, .dss-content .living-source, .dss-content .inversion-source {
  color:#666666
}


 /* DSS editorial integration v0.36.1 — the ONLY chromatic accent is
   the production wordmark blue, #A6CAEC.  Body text, labels, and links
   use neutral ink for legibility; no substitute dark-blue shade. */
.dss-content {

  --logo-blue:var(--blue, #A6CAEC);

  --accent:var(--logo-blue);

  --accent-dark:#34383b;

  --headline:var(--grey, #A6A6A6);

  --ink:#25292d;

  --muted:#62676a;

  --border:var(--line, #e4e6e7);

  color-scheme:light;

  font-family:var(--font, "Geist",system-ui,sans-serif);

  line-height:1.64;

  font-size:16px;

  width:100%;
  max-width:1140px;
  margin:0 auto;
  padding:0 32px;

}

.dss-content a {
  color:var(--accent-dark);
  text-decoration-color:var(--logo-blue)
}

.dss-content a:hover {
  color:#25292d;
  text-decoration-color:var(--logo-blue)
}

.dss-content a:focus-visible,.dss-content button:focus-visible {
  outline-color:var(--logo-blue)
}

.dss-content .hero h1 {
  color:var(--headline);
  font-weight:400
}

.dss-content .hero-subtitle {
  color:#33383d
}

.dss-content .hero:before {
  background:var(--logo-blue);
  opacity:1
}

 /* Small print remains neutral for readable contrast against white. */
.dss-content .eyebrow,.dss-content .kicker,.dss-content .micro-label,
.dss-content .publication-panel .panel-label {
  color:#52575b
}

.dss-content .eyebrow {
  border-left:3px solid var(--logo-blue);
  padding-left:11px
}

.dss-content .kicker {
  border-left:3px solid var(--logo-blue);
  padding-left:10px
}

.dss-content .button-primary,.dss-content .button-primary:hover {

  background:var(--logo-blue);
  border-color:var(--logo-blue);
  color:#25292d;

}

.dss-content .button-primary:hover {
  box-shadow:0 0 0 2px #25292d
}

.dss-content .button-secondary {
  color:#34383b;
  background:#fff;
  border-color:#c6c9cc
}

.dss-content .button-secondary:hover {
  color:#25292d;
  background:#f7f7f7
}

.dss-content .concept,.dss-content .offer-panel,.dss-content .inversion-bridge,
.dss-content .dominance-statement,.dss-content .living-thesis {
  border-left-color:var(--logo-blue)
}

.dss-content .outcome,.dss-content .intelligence-stage {
  border-top-color:var(--logo-blue)
}

.dss-content .sidebar nav a:hover {
  color:#25292d;
  border-left-color:var(--logo-blue)
}







 /* Navigation remains the shared site navigation. Keep the current item
   understated and consistent with Home > Brand. */
@media(max-width:670px) {
  .dss-content {
    padding-left:21px;
    padding-right:21px
  }
}


 /* v0.39 — Align article heading typography with existing KQ/NEO/Research pages.
   Reference: site.css .depth-heading h1 / .depth-bottom h2.
   No new colors, no layout/navigation/content changes. */
.dss-content .hero h1 {
  font-size:clamp(38px,4.1vw,61px);
  font-weight:400;
  letter-spacing:-.047em;
  line-height:1.13
}

.dss-content .hero-subtitle {
  font-size:18px;
  font-weight:400;
  letter-spacing:-.015em;
  line-height:1.5
}

.dss-content .reading section>h2 {
  font-size:28px;
  font-weight:400;
  letter-spacing:-.025em;
  line-height:1.26
}

.dss-content .reading h3 {
  font-size:18px;
  font-weight:500;
  letter-spacing:-.015em
}



@media(max-width:670px) {

  .dss-content .hero h1 {
    font-size:clamp(38px,9vw,49px)
  }

  .dss-content .hero-subtitle {
    font-size:16px
  }

  .dss-content .reading section>h2 {
    font-size:27px
  }

  

}


 /* v0.42 — minimal brand-style alignment, retaining the v0.40 page layout. */
.dss-content .hero h1 {
  color:var(--grey, #A6A6A6)
}

.dss-content .hero h1 .dss-title-dot {
  color:var(--blue, #A6CAEC)
}

.dss-content .eyebrow {
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  color:var(--grey, #A6A6A6);
  border-left:0;
  padding-left:0
}

.dss-content .hero-subtitle {
  color:#63696d;
  font-size:16px;
  font-weight:400;
  letter-spacing:normal;
  line-height:1.5;
  margin-top:20px
}

@media(max-width:670px) {
  .dss-content .hero-subtitle {
    font-size:15px;
    margin-top:15px
  }
}