/* Economic System Design — visual pillar page */
.vj-esd-page{overflow:clip}
.vj-esd-hero{padding-block:clamp(6rem,9vw,8.5rem) clamp(5rem,7vw,6.5rem);border-block-end:1px solid var(--vj-color-border-default)}
.vj-esd-hero__grid{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(30rem,.94fr);gap:clamp(4rem,8vw,8rem);align-items:center}
.vj-esd-hero__copy{max-inline-size:54rem}
.vj-esd-hero h1{max-inline-size:52rem;margin:.75rem 0 1.35rem;font-size:clamp(3rem,5vw,5.25rem);line-height:1.08;letter-spacing:var(--vj-track-fa);font-weight:600}
.vj-esd-hero__lead{max-inline-size:48rem;margin:0;color:var(--vj-color-text-secondary);font-size:clamp(1.08rem,1.35vw,1.25rem);line-height:2}
.vj-esd-hero__actions{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap;margin-block-start:2rem}
.vj-esd-hero__meta{display:flex;flex-wrap:wrap;gap:.55rem;margin-block-start:2rem}
.vj-esd-hero__meta span{padding:.42rem .78rem;border:1px solid var(--vj-color-border-default);border-radius:999px;color:var(--vj-color-text-muted);font-size:.78rem}
.vj-esd-hero__visual{display:grid;place-items:center;min-block-size:34rem}
.vj-esd-system-diagram{position:relative;inline-size:min(34rem,100%);aspect-ratio:1;border:1px solid var(--vj-color-border-default);border-radius:50%}
.vj-esd-system-diagram:before,.vj-esd-system-diagram:after{content:"";position:absolute;border:1px solid rgb(146 90 61 / 20%);border-radius:50%;inset:16%}.vj-esd-system-diagram:after{inset:32%;border-color:rgb(146 90 61 / 34%)}
.vj-esd-system-diagram__node{position:absolute;z-index:2;display:grid;place-items:center;min-inline-size:7.6rem;min-block-size:3.25rem;padding:.65rem .85rem;background:#fff;border:1px solid var(--vj-color-border-default);border-radius:999px;box-shadow:0 14px 35px rgb(23 23 23 / 6%);text-align:center;font-size:.8rem;font-weight:600}
.vj-esd-system-diagram__node--core{inline-size:9rem;block-size:9rem;inset-inline-start:50%;inset-block-start:50%;transform:translate(-50%,-50%);border-radius:50%;background:#171717;color:#fff;border-color:#171717;font-size:.86rem}
.vj-esd-system-diagram__node--resources{inset-inline-start:50%;inset-block-start:-1rem;transform:translateX(-50%)}
.vj-esd-system-diagram__node--actors{inset-inline-end:-1rem;inset-block-start:27%}
.vj-esd-system-diagram__node--incentives{inset-inline-end:0;inset-block-end:10%}
.vj-esd-system-diagram__node--flows{inset-inline-start:50%;inset-block-end:-1rem;transform:translateX(-50%);min-inline-size:9.6rem}
.vj-esd-system-diagram__node--rules{inset-inline-start:-1rem;inset-block-end:10%}
.vj-esd-system-diagram__line{position:absolute;z-index:1;block-size:1px;inline-size:31%;background:rgb(146 90 61 / 50%);transform-origin:left center}
.vj-esd-system-diagram__line--1{inset-inline-start:41%;inset-block-start:30%;transform:rotate(-58deg)}
.vj-esd-system-diagram__line--2{inset-inline-start:57%;inset-block-start:38%;transform:rotate(-5deg)}
.vj-esd-system-diagram__line--3{inset-inline-start:61%;inset-block-start:63%;transform:rotate(32deg)}
.vj-esd-system-diagram__line--4{inset-inline-start:43%;inset-block-start:70%;transform:rotate(62deg)}
.vj-esd-system-diagram__line--5{inset-inline-start:34%;inset-block-start:63%;transform:rotate(-28deg)}
.vj-esd-system-diagram__loop{position:absolute;inset-inline:20%;inset-block-end:4%;text-align:center;color:var(--vj-color-brand-accent);font-size:.72rem;font-weight:700}
.vj-esd-section{padding-block:clamp(5rem,7vw,7rem)}
.vj-esd-section--muted{background:var(--vj-color-bg-muted);border-block:1px solid var(--vj-color-border-default)}
.vj-esd-section__rail{display:flex;align-items:center;gap:.65rem;margin-block-end:1.2rem}.vj-esd-section__rail span{color:var(--vj-color-text-muted);font-size:.78rem;font-weight:700}
.vj-esd-definition{display:grid;grid-template-columns:10rem minmax(0,1fr);gap:clamp(2.5rem,6vw,6rem)}
.vj-esd-definition__body h2,.vj-esd-section__head h2{max-inline-size:58rem;margin:.4rem 0 1rem;font-size:clamp(2.2rem,4.4vw,4rem);line-height:1.17;font-weight:600}
.vj-esd-definition__statement{max-inline-size:64rem;margin:0;font-size:clamp(1.45rem,2.3vw,2rem);line-height:1.75;font-weight:500}
.vj-esd-definition__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem 3rem;margin-block-start:2.25rem;padding-block-start:1.5rem;border-block-start:2px solid var(--vj-color-brand-accent)}
.vj-esd-definition__grid p{margin:0;color:var(--vj-color-text-secondary);line-height:1.95}
.vj-esd-section__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(20rem,.68fr);gap:3rem;align-items:end;margin-block-end:2.3rem}.vj-esd-section__head>p{max-inline-size:36rem;margin:0;color:var(--vj-color-text-secondary);line-height:1.95}
.vj-esd-component-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--vj-color-border-default);border:1px solid var(--vj-color-border-default)}
.vj-esd-component-card{min-block-size:17rem;padding:1.6rem;background:#fff}.vj-esd-component-card span,.vj-esd-problem-card>span,.vj-esd-output-card>span{color:var(--vj-color-brand-accent);font-size:.72rem;font-weight:700}.vj-esd-component-card h3{margin:.65rem 0 .5rem;font-size:1.32rem;line-height:1.4}.vj-esd-component-card p{margin:0;color:var(--vj-color-text-secondary);line-height:1.9}
.vj-esd-flows{background:#f2efe9;border-block:1px solid var(--vj-color-border-default)}.vj-esd-flows__grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(3rem,8vw,8rem);align-items:center}.vj-esd-flows__copy h2{max-inline-size:46rem;margin:.55rem 0 1rem;font-size:clamp(2.3rem,4.3vw,3.8rem);line-height:1.18}.vj-esd-flows__copy>p{max-inline-size:40rem;color:var(--vj-color-text-secondary);line-height:1.95}.vj-esd-flows__note{padding-block-start:1rem;border-block-start:1px solid var(--vj-color-border-default);font-size:.92rem}
.vj-esd-flow-model{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:0;align-items:center;min-block-size:22rem}.vj-esd-flow-model__stage{position:relative;display:grid;place-items:center;min-block-size:6rem;padding:.7rem;border:1px solid var(--vj-color-border-default);background:#fff;border-radius:999px;text-align:center;font-size:.8rem;font-weight:600;z-index:2}.vj-esd-flow-model__stage:not(:last-of-type):after{content:"→";position:absolute;inset-inline-end:-1.3rem;color:var(--vj-color-brand-accent);font-size:1.3rem}.vj-esd-flow-model__feedback{grid-column:1/-1;justify-self:center;margin-block-start:3rem;padding:.55rem .9rem;border-radius:999px;background:#171717;color:#fff;font-size:.78rem}
.vj-esd-problem-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--vj-color-border-default);border:1px solid var(--vj-color-border-default)}
.vj-esd-problem-card{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:1rem;min-block-size:11.5rem;padding:1.45rem;background:#fff}.vj-esd-problem-card h3{margin:.55rem 0 .4rem;font-size:1.15rem;line-height:1.55}.vj-esd-problem-card p{margin:0;color:var(--vj-color-text-secondary);line-height:1.82}
.vj-esd-method-section{background:#171717;color:#f8f7f4}.vj-esd-section__head--dark>p{color:rgb(248 247 244 / 72%)}
.vj-esd-method{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-block:1px solid rgb(255 255 255 / 12%)}.vj-esd-method:before{content:"";position:absolute;inset-inline:4%;inset-block-start:3.75rem;height:1px;background:linear-gradient(90deg,transparent,rgb(207 182 165 / 40%),transparent)}.vj-esd-method__step{position:relative;min-block-size:15.5rem;padding:1.25rem 1rem;border-inline-start:1px solid rgb(255 255 255 / 12%)}.vj-esd-method__step:first-child{border-inline-start:0}.vj-esd-method__step:after{content:"";position:absolute;inset-block-start:3.52rem;inset-inline-start:50%;inline-size:.62rem;block-size:.62rem;border:2px solid #cfb6a5;background:#171717;border-radius:50%;transform:translateX(-50%)}.vj-esd-method__step span{color:#cfb6a5;font-size:.72rem;font-weight:700}.vj-esd-method__step strong{display:block;margin-block-start:5.9rem;font-size:.98rem;line-height:1.65}
.vj-esd-output-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.vj-esd-output-card{min-block-size:15rem;padding:1.55rem;border:1px solid var(--vj-color-border-default);background:#fff;border-radius:1rem}.vj-esd-output-card h3{margin:.75rem 0 .5rem;font-size:1.22rem}.vj-esd-output-card p{margin:0;color:var(--vj-color-text-secondary);line-height:1.85}
.vj-esd-knowledge{background:#f2efe9;border-block:1px solid var(--vj-color-border-default)}.vj-esd-knowledge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.vj-esd-knowledge-grid a{display:flex;min-block-size:16rem;flex-direction:column;justify-content:space-between;padding:1.55rem;border:1px solid var(--vj-color-border-default);border-radius:1rem;background:#fff;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.vj-esd-knowledge-grid a:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgb(23 23 23 / 7%);border-color:#beb6ad}.vj-esd-knowledge-grid span{color:var(--vj-color-brand-accent);font-size:.72rem;font-weight:700}.vj-esd-knowledge-grid h3{margin:.7rem 0 .45rem;font-size:1.35rem}.vj-esd-knowledge-grid p{margin:0;color:var(--vj-color-text-secondary);line-height:1.8}.vj-esd-knowledge-grid b{align-self:flex-start;color:var(--vj-color-brand-accent);font-size:.88rem}
.vj-esd-cta{padding-block:clamp(5rem,7vw,7rem);background:#171717;color:#f8f7f4}.vj-esd-cta__inner{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem}.vj-esd-cta h2{max-inline-size:60rem;margin:.6rem 0 .8rem;font-size:clamp(2.2rem,4.4vw,4rem);line-height:1.17}.vj-esd-cta p:not(.vj-eyebrow){max-inline-size:40rem;margin:0;color:rgb(248 247 244 / 70%);line-height:1.9}.vj-esd-cta__actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;flex:0 0 auto}.vj-esd-cta .vj-arrow-link{color:#f8f7f4}
@media (max-width:1050px){.vj-esd-hero__grid,.vj-esd-flows__grid{grid-template-columns:1fr}.vj-esd-hero__visual{max-inline-size:34rem;justify-self:center}.vj-esd-component-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vj-esd-output-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vj-esd-method{grid-template-columns:repeat(3,minmax(0,1fr))}.vj-esd-method__step:nth-child(4){border-inline-start:0}.vj-esd-cta__inner{align-items:flex-start;flex-direction:column}}
@media (max-width:720px){.vj-esd-hero{padding-block:4rem 3.5rem}.vj-esd-hero h1{font-size:2.8rem}.vj-esd-definition{grid-template-columns:1fr}.vj-esd-definition__grid{grid-template-columns:1fr}.vj-esd-section__head{grid-template-columns:1fr}.vj-esd-component-grid,.vj-esd-problem-grid,.vj-esd-output-grid,.vj-esd-knowledge-grid{grid-template-columns:1fr}.vj-esd-system-diagram{inline-size:min(24rem,100%)}.vj-esd-system-diagram__node{min-inline-size:6rem;font-size:.72rem}.vj-esd-system-diagram__node--core{inline-size:7.3rem;block-size:7.3rem}.vj-esd-flow-model{grid-template-columns:1fr;gap:.85rem}.vj-esd-flow-model__stage{min-block-size:4.2rem}.vj-esd-flow-model__stage:not(:last-of-type):after{content:"↓";inset-inline-end:auto;inset-block-end:-1.25rem;inset-block-start:auto}.vj-esd-method{grid-template-columns:1fr}.vj-esd-method:before{display:none}.vj-esd-method__step{min-block-size:8rem;border-inline-start:0;border-block-end:1px solid rgb(255 255 255 / 12%)}.vj-esd-method__step:after{inset-block-start:2.2rem;inset-inline-start:1rem;transform:none}.vj-esd-method__step strong{margin-block-start:2rem;margin-inline-start:1.45rem}.vj-esd-cta__actions{width:100%}}

/* v0.36 — final desktop polish: clarity, hierarchy and rhythm */
.vj-esd-hero__copy{max-inline-size:49rem}
.vj-esd-hero h1{max-inline-size:47rem;line-height:1.05;margin-block-end:1.05rem}
.vj-esd-hero__lead{max-inline-size:42rem;line-height:1.9}
.vj-esd-system-diagram{background:radial-gradient(circle at center,rgba(23,23,23,.035),transparent 48%)}
.vj-esd-system-diagram__line{background:linear-gradient(90deg,rgba(146,90,61,.68),rgba(146,90,61,.18));height:2px}
.vj-esd-system-diagram__loop{padding:.4rem .7rem;background:rgba(255,255,255,.78);border:1px solid rgba(146,90,61,.14);border-radius:999px;backdrop-filter:blur(4px)}
.vj-esd-section{padding-block:clamp(4.6rem,6vw,6rem)}
.vj-esd-component-card{min-block-size:15.5rem;padding:1.75rem 1.65rem;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.vj-esd-component-card:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(23,23,23,.07)}
.vj-esd-component-card--featured{background:#171717;color:#f8f7f4}
.vj-esd-component-card--featured p{color:rgba(248,247,244,.72)}
.vj-esd-component-card--featured span{color:#cfb6a5}
.vj-esd-problem-card{position:relative;grid-template-columns:2.2rem minmax(0,1fr) auto;min-block-size:9.6rem;padding:1.35rem 1.45rem;transition:background .18s ease,box-shadow .18s ease}
.vj-esd-problem-card:hover{background:#fcfbf8;box-shadow:inset 0 0 0 1px rgba(146,90,61,.18)}
.vj-esd-problem-card:after{content:"↗";align-self:end;color:var(--vj-color-brand-accent);font-size:.9rem;font-weight:600}
.vj-esd-problem-card h3{font-size:1.1rem;line-height:1.5}
.vj-esd-method{isolation:isolate}
.vj-esd-method__step{min-block-size:14rem;padding-inline:1.15rem}
.vj-esd-method__step strong{font-size:1rem;line-height:1.6}
.vj-esd-method__step:before{content:"";position:absolute;inset-inline:0;inset-block-end:0;height:2px;background:transparent;transition:background .2s ease}
.vj-esd-method__step:hover:before{background:#cfb6a5}
.vj-esd-output-card{min-block-size:13.5rem;padding:1.5rem 1.45rem;transition:transform .18s ease,box-shadow .18s ease}
.vj-esd-output-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(23,23,23,.06)}
.vj-esd-knowledge-grid a{min-block-size:14.5rem;padding:1.55rem 1.5rem}
.vj-esd-knowledge-grid a:hover{transform:translateY(-3px)}
.vj-esd-cta{padding-block:clamp(4.6rem,6vw,6rem)}
.vj-esd-cta h2{max-inline-size:54rem}

@media (max-width:1050px){
  .vj-esd-hero h1{max-inline-size:48rem}
  .vj-esd-problem-card{grid-template-columns:2.2rem minmax(0,1fr) auto}
}
