…
Self-contained: scoped to #d2-master-sec. The copy side uses the landing's own colours
(CSS vars with fallbacks); the picture side is always dark. Wire the two buttons' hrefs. -->
-<section id="d2-master-sec" aria-label="Master: a team of AI agents">
+<section id="d2-master-sec" aria-labelledby="d2ms-h">
<style>
#d2-master-sec{padding:40px 16px}
…
#d2-master-sec .ok{border:1px solid #3a3f4a;border-radius:6px;padding:0 7px;color:#46c48e}
#d2-master-sec .pk{color:#a8abb2;font-size:12px;padding:2px 4px}
+#d2-master-sec{padding-bottom:0!important}
</style>
-<div class="card" style="display:block">
- <div class="pic"><div class="dark">
- <div class="tabs" role="tablist" aria-label="How a Master team works">
- <button role="tab" data-i="0">Agents</button><button role="tab" data-i="1">Imagine</button><button role="tab" data-i="2">Build</button><button role="tab" data-i="3">Feedback</button><button role="tab" data-i="4">Manage</button><button role="tab" data-i="5">Release</button>
- </div>
- <div class="body" role="tabpanel" aria-live="polite"></div>
- </div></div>
-</div>
-<script>
-(function(){
-var root=document.getElementById('d2-master-sec'); if(!root) return;
-var DIAG='<svg viewBox="0 0 480 250" role="img" aria-label="You, the pipeline, and the designer, coder, tester and guardian agents; the coder sends design calls to the designer and the tester sends bugs to the coder"><defs><marker id="d2ms-arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="6" markerHeight="6" orient="auto"><path d="M0 0L10 5L0 10z" fill="#8a8f99"/></marker></defs><g font-family="system-ui,sans-serif">'+
-'<rect x="10" y="94" width="72" height="54" rx="10" fill="#3a2a0e" stroke="#f2b84b"/><text x="46" y="126" text-anchor="middle" fill="#eceae4" font-size="13" font-weight="700">You</text>'+
-'<rect x="124" y="16" width="110" height="216" rx="12" fill="none" stroke="#6b707a" stroke-dasharray="5 4"/><text x="179" y="36" text-anchor="middle" fill="#eceae4" font-size="12" font-weight="700">Pipeline</text>'+
-'<rect x="136" y="50" width="86" height="40" rx="8" fill="#1f2229" stroke="#454b57"/><text x="179" y="74" text-anchor="middle" fill="#eceae4" font-size="11" font-weight="700">New</text>'+
-'<rect x="136" y="106" width="86" height="40" rx="8" fill="#1f2229" stroke="#454b57"/><text x="179" y="130" text-anchor="middle" fill="#eceae4" font-size="11" font-weight="700">Working</text>'+
-'<rect x="136" y="162" width="86" height="40" rx="8" fill="#1f2229" stroke="#454b57"/><text x="179" y="186" text-anchor="middle" fill="#eceae4" font-size="11" font-weight="700">Review</text>'+
-'<g stroke="#8a8f99" stroke-width="1.3" fill="none" marker-end="url(#d2ms-arrow)"><path d="M82 114H122"/><path d="M124 134H84"/><path d="M179 90V104"/><path d="M179 146V160"/><path d="M234 64H274"/><path d="M276 118H236"/><path d="M276 178H236"/></g>'+
-'<text x="332" y="30" text-anchor="middle" fill="#eceae4" font-size="12" font-weight="700">AI Agents</text><rect x="276" y="40" width="112" height="44" rx="10" fill="#23265a" stroke="#9296f5"/><text x="332" y="67" text-anchor="middle" fill="#eceae4" font-size="12" font-weight="700">Designer</text>'+
-'<rect x="276" y="96" width="112" height="44" rx="10" fill="#23265a" stroke="#9296f5"/><text x="332" y="123" text-anchor="middle" fill="#eceae4" font-size="12" font-weight="700">Coder</text>'+
-'<rect x="276" y="152" width="112" height="44" rx="10" fill="#23265a" stroke="#9296f5"/><text x="332" y="179" text-anchor="middle" fill="#eceae4" font-size="12" font-weight="700">Tester</text>'+
-'<rect x="276" y="206" width="112" height="34" rx="10" fill="#10291f" stroke="#46c48e" stroke-dasharray="4 3"/><text x="332" y="228" text-anchor="middle" fill="#eceae4" font-size="11" font-weight="700">Guardian</text>'+
-'<text x="103" y="108" text-anchor="middle" fill="#a8abb2" font-size="9">direct</text><text x="103" y="148" text-anchor="middle" fill="#a8abb2" font-size="9">review</text></g><defs><marker id="d2ms-a3" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="6" markerHeight="6" orient="auto"><path d="M0 0L10 5L0 10z" fill="#c7a6ff"/></marker></defs><g stroke="#c7a6ff" stroke-width="1.4" fill="none" marker-end="url(#d2ms-a3)"><path d="M390 112 C 414 108, 414 70, 392 64"/><path d="M390 168 C 414 164, 414 126, 392 122"/></g><g font-family="system-ui,sans-serif" font-size="10" fill="#c7a6ff"><text x="418" y="86">design</text><text x="418" y="97">calls</text><text x="418" y="142">bugs</text><text x="418" y="153">found</text></g></svg>';
-var MAP='<svg class="pm" viewBox="0 0 360 96" role="img" aria-label="You, designer, coder and guardian, with open items per role"><defs><marker id="d2ms-a2" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="6" markerHeight="6" orient="auto"><path d="M0 0L10 5L0 10z" fill="#8a8f99"/></marker></defs><g font-family="system-ui,sans-serif">'+
-'<g stroke="#8a8f99" stroke-width="1.3" fill="none" marker-end="url(#d2ms-a2)"><path d="M62 44H112"/><path d="M152 44H202"/><path d="M242 44H292"/></g>'+
-'<rect x="72" y="10" width="20" height="14" rx="7" fill="#3a3f4a"/><text x="82" y="21" text-anchor="middle" fill="#eceae4" font-size="11">3</text>'+
-'<rect x="160" y="10" width="20" height="14" rx="7" fill="#1f6b4c"/><text x="170" y="21" text-anchor="middle" fill="#eceae4" font-size="11">1</text>'+
-'<rect x="184" y="10" width="20" height="14" rx="7" fill="#8a5a00"/><text x="194" y="21" text-anchor="middle" fill="#eceae4" font-size="11">1</text>'+
-'<circle cx="40" cy="44" r="20" fill="#3a2a0e" stroke="#f2b84b" stroke-width="1.5"/><text x="40" y="48" text-anchor="middle" fill="#f2b84b" font-size="11">you</text>'+
-'<circle cx="132" cy="44" r="20" fill="#5b5fd6"/><text x="132" y="48" text-anchor="middle" fill="#eceae4" font-size="12">D</text>'+
-'<circle cx="222" cy="44" r="20" fill="#2f9a6f"/><text x="222" y="48" text-anchor="middle" fill="#eceae4" font-size="12">C</text>'+
-'<circle cx="312" cy="44" r="20" fill="none" stroke="#8a8f99" stroke-dasharray="4 3"/><text x="312" y="48" text-anchor="middle" fill="#a8abb2" font-size="12">G</text>'+
-'<text x="40" y="80" text-anchor="middle" fill="#f2b84b" font-size="11">2 for you</text><text x="132" y="80" text-anchor="middle" fill="#9296f5" font-size="11">designer · up</text>'+
-'<text x="222" y="80" text-anchor="middle" fill="#46c48e" font-size="11">coder · working</text><text x="312" y="80" text-anchor="middle" fill="#a8abb2" font-size="11">guardian</text></g></svg>';
-function R(c,l,t,m,ok){return '<div class="row"><span class="ps '+c+'">'+l+'</span><div class="t"><div>'+t+'</div><div class="m">'+m+'</div></div>'+(ok?'<span class="ok" aria-label="Close">✓</span>':'')+'</div>';}
-var MANAGE=MAP+'<div class="rows">'+R('ps-rv','Review','Design calls: waitlist cap 50, offers expire at midnight','P-14 · coder → you',1)+R('ps-ip','In progress','Waitlist: offer a freed seat to the next person','P-13 · designer → coder')+R('ps-wt','Waiting','Payment provider key, put it in the vault','P-16 · coder → you',1)+R('ps-nw','New','Speaker badges with QR check-in','P-15 · you → designer')+'<div class="pk">▸ Parked (2)</div></div><a class="try" href="https://d2master.aiputty.com/pipeline">Open the pipeline on d2master</a>';
-function M(c,w,t){return '<div class="msg '+c+'"><div class="who">'+w+'</div>'+t+'</div>';}
-var RELEASE=M('you','You','Looks good. Release it.')+'<div style="margin:10px 0;padding:12px 14px;border:1px solid #454b57;border-radius:12px;background:#1f2229;color:#eceae4"><div style="font-weight:700;margin-bottom:2px">Release 3 items?</div><div style="font-size:12px;color:#a8abb2;margin-bottom:8px">Full suite, then deploy.</div><div style="font-size:13px;line-height:1.55;border-top:1px solid #33373f;padding-top:6px"><div><span style="color:#9296f5;font-family:ui-monospace,monospace">P-12</span> Waitlist: written up, three behaviours, five tests</div><div><span style="color:#9296f5;font-family:ui-monospace,monospace">P-13</span> Waitlist: offer a freed seat to the next person</div><div><span style="color:#9296f5;font-family:ui-monospace,monospace">P-14</span> Design calls: cap of 50, offers expire at midnight</div></div><div style="margin-top:10px;display:flex;gap:8px"><span style="background:#5b5fd6;color:#fff;border-radius:999px;padding:4px 14px;font-size:13px;font-weight:700">Release</span><span style="border:1px solid #454b57;border-radius:999px;padding:4px 14px;font-size:13px">Cancel</span></div></div>'+M('ag','Dispatcher','Released v1.4: the full suite passed, it\'s deployed, and the live checks are green. Shipped: P-12, P-13 and P-14.')+'<a class="try" href="https://d2master.aiputty.com/pipeline">Open the pipeline on d2master</a>';
-var T=[DIAG,
-M('you','You → designer','Sessions sell out fast. Add a waitlist: when a seat frees up, offer it to the next person for 24 hours.')+M('ag','Designer','Written up for your review as P-12: the waitlist in the spec (three behaviours), how it works, and five design tests. One question: should people see their place in line?')+'<a class="try" href="https://d2master.aiputty.com">Try it on d2master</a>',
-M('you','You → coder','You are the coder on northconf. Work the pipeline.')+M('ag','Coder','Took P-13, the waitlist. Built it, ran the tests (5 of 5 pass), deployed a preview. Two details came up in the build; sending them to the designer.'),
-M('ag','Coder → designer','Built P-13. Settled in the build: a waitlist holds 50 people per session, and an offer expires at midnight instead of after 24 hours. Design calls: P-14.')+M('gd','Designer → you','The coder capped waitlists at 50 and changed the offer to expire at midnight. I\'d keep the cap and go back to 24 hours. OK?')+M('you','You','Keep both as the coder built them.'),
-MANAGE,
+<div class="wrap"><div class="lp-top" style="margin:0">
+ <h2 id="d2ms-h">Work at the speed of thought.</h2>
+ <p class="who">Set up your team of AI agents, point them, and step in any time.</p>
+ <div class="cta"><a class="primary" href="https://d2master.aiputty.com" data-wire="see-it-live">See it live</a><a href="/sso/login?next=/home%3Flevel%3Dmaster" data-wire="start-master">Start a Master project</a></div>
+ </div>
+</div></div>
-RELEASE];
-var body=root.querySelector('.body'),bs=[].slice.call(root.querySelectorAll('.tabs button'));
-function show(i){body.innerHTML=T[i];bs.forEach(function(b,j){b.setAttribute('aria-selected',j===i?'true':'false')});}
-bs.forEach(function(b){b.addEventListener('click',function(){show(+b.getAttribute('data-i'))});});
-show(0);
-})();
-</script>
</section>
…