.dmu-story{--ink:#20211f;--muted:#65665f;--line:#d8d9d2;--paper:#f6f5ef;color:var(--ink);background:var(--paper);padding-top:64px;font-size:18px;line-height:1.75}
.story-shell{width:min(1180px,calc(100% - 48px));margin-inline:auto}
.story-breadcrumb{display:flex;flex-wrap:wrap;gap:12px;padding-block:24px;font-size:13px;color:var(--muted)}
.dmu-story a{text-underline-offset:4px}.dmu-story p a,.story-more a{text-decoration:underline}.dmu-story a:hover{color:var(--primary)}
.story-kicker{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--primary);margin:0 0 22px}
.dmu-story h1,.dmu-story h2,.dmu-story h3{letter-spacing:-.035em;font-weight:400;line-height:1.1;margin:0 0 22px;text-wrap:balance}
.dmu-story h1{font-size:clamp(42px,5.6vw,76px)}.dmu-story h2{font-size:clamp(30px,3.5vw,48px)}.dmu-story h3{font-size:25px}
.dmu-story p{margin:0 0 22px}.story-lead{font-size:clamp(20px,2vw,25px);line-height:1.55;max-width:780px}.story-small{font-size:14px;color:var(--muted)}
.story-section{padding-block:68px;border-top:1px solid var(--line)}.story-copy{max-width:760px}.story-copy p:last-child{margin-bottom:0}
.story-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}.story-photo{margin:0;min-width:0}.story-photo img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none;-webkit-touch-callout:none}.story-photo figcaption{font-size:14px;line-height:1.55;color:var(--muted);margin-top:12px}
.story-note{border-left:3px solid var(--primary);padding:22px 28px;background:#eeede6}.story-note p:last-child{margin:0}.story-list{padding-left:22px}.story-list li{margin-bottom:14px}
.story-end{padding-block:50px;border-top:1px solid var(--line)}.story-end p{max-width:760px}.story-more{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:35px;font-size:16px}.story-more a{border-top:1px solid var(--line);padding-top:15px}
.story-table-wrap{overflow-x:auto}.story-table{width:100%;border-collapse:collapse;font-size:16px;text-align:left}.story-table th,.story-table td{vertical-align:top;padding:20px 16px;border-bottom:1px solid var(--line);min-width:145px}.story-table th{font-weight:600}.story-table thead{background:#eae9e1}
/* 1 — a photographic street essay, with a narrow reading column. */
.street-hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:45px;align-items:center;padding-block:28px 65px}.street-hero .story-photo img{aspect-ratio:4/5;object-fit:cover}.street-chapter{display:grid;grid-template-columns:130px minmax(0,760px);gap:45px;padding-block:40px;border-top:1px solid var(--line)}.street-chapter>span{font-size:64px;color:#b5b6ae;line-height:1}.street-inset{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding-block:60px}
/* 2 — a side-by-side comparison board. */
.compare-story{background:#fff}.compare-title{text-align:center;max-width:900px;margin:25px auto 50px}.compare-title .story-lead{margin-inline:auto}.compare-board{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line)}.compare-panel{padding:28px;background:#f5f4ee}.compare-panel+ .compare-panel{border-left:1px solid var(--line);background:#eef1eb}.compare-panel img{aspect-ratio:4/3;object-fit:cover}.compare-panel h2{font-size:32px;margin-top:30px}.compare-verdict{display:grid;grid-template-columns:1fr 1fr 1fr;gap:32px;padding-block:50px}.compare-verdict article{border-top:3px solid var(--primary);padding-top:24px}
/* 3 — a materials desk with an inventory, editorial labels and an open folder. */
.kit-title{padding:42px 0 55px;max-width:900px}.kit-inventory{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding-bottom:65px}.kit-inventory article{padding:24px;background:#fff;border-top:5px solid #cc2114;min-height:230px}.kit-inventory span{font-size:12px;letter-spacing:.1em;color:var(--muted)}.kit-inventory h2{font-size:26px;margin:35px 0 15px}.kit-inventory p{font-size:16px}.kit-folder{background:#e9e6db;padding:36px;display:grid;grid-template-columns:1.25fr .75fr;gap:38px}.kit-folder .story-photo{align-self:center}.kit-files{font-family:monospace;font-size:14px;line-height:2.1;padding:25px;background:#fff;overflow-wrap:anywhere}
/* 4 — a meeting notebook, with questions down one edge. */
.meeting-story{background:#fff}.meeting-title{padding-block:45px 60px;border-bottom:4px solid var(--primary)}.meeting-title h1{max-width:850px}.meeting-row{display:grid;grid-template-columns:1fr 1.6fr;gap:65px;padding-block:48px;border-bottom:1px solid var(--line)}.meeting-row .story-kicker{margin-bottom:14px}.meeting-row h2{font-size:32px}.meeting-row .answer{max-width:680px}.meeting-evidence{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}.meeting-evidence img{aspect-ratio:4/3;object-fit:cover}.meeting-delivery{background:#f4f3ee;padding:30px;margin-top:30px}
/* 5 — a dark web architecture guide with a screen and a content tree. */
.web-story{--ink:#f1f1e9;--muted:#b7b9b1;--line:#454841;--paper:#20231f}.web-story .story-kicker{color:#ff927f}.web-title{display:grid;grid-template-columns:1.2fr .8fr;gap:55px;padding-block:45px 60px;align-items:end}.web-tree{background:#2d312a;border:1px solid #565b50;padding:28px;font-size:16px}.web-tree ul{padding-left:22px;list-style:none;border-left:1px solid #727969}.web-tree li{padding:8px 0}.web-screen{border:1px solid #5c6255;padding:10px;border-radius:14px;background:#30362a}.web-screen figcaption{padding:10px}.web-spec{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.web-spec article{padding-top:24px;border-top:1px solid #7c8870}.web-story .story-note{background:#30352d;border-color:#ff927f}.web-story .story-table thead{background:#30352d}.web-story a:hover{color:#ff927f}
/* 6 — a customer route, alternating signs, questions and next steps. */
.journey-title{padding-block:40px 45px;max-width:900px}.journey-banner img{aspect-ratio:16/7;object-fit:cover}.journey-route{border-left:2px solid #c5c7bc;margin:60px 0 60px 22px;padding-left:48px}.journey-stop{position:relative;padding-bottom:58px;max-width:900px}.journey-stop:last-child{padding-bottom:0}.journey-stop:before{content:'';position:absolute;width:16px;height:16px;border-radius:50%;background:var(--primary);left:-57px;top:9px}.journey-stop h2{font-size:36px}.journey-stop .story-kicker{margin-bottom:14px}.journey-two{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:28px}.journey-two article{padding:24px;background:#fff}.journey-audit{display:grid;grid-template-columns:.7fr 1.3fr;gap:55px}
@media(max-width:800px){.street-hero,.street-inset,.story-split,.kit-folder,.meeting-row,.web-title,.journey-audit{grid-template-columns:1fr;gap:28px}.street-hero .story-photo img{aspect-ratio:4/3}.kit-inventory{grid-template-columns:1fr 1fr}.compare-board{grid-template-columns:1fr}.compare-panel+ .compare-panel{border-left:0;border-top:1px solid var(--line)}.compare-verdict,.web-spec{grid-template-columns:1fr}.street-chapter{grid-template-columns:55px 1fr;gap:20px}.street-chapter>span{font-size:38px}.story-more{grid-template-columns:1fr}.story-section{padding-block:45px}.web-title h1{max-width:650px}}
@media(max-width:480px){.story-shell{width:calc(100% - 32px)}.dmu-story{font-size:17px}.dmu-story h1{font-size:42px}.kit-inventory,.journey-two{grid-template-columns:1fr}.kit-inventory article{min-height:0}.kit-inventory h2{margin-top:20px}.kit-folder,.compare-panel{padding:20px}.journey-route{margin-left:8px;padding-left:26px}.journey-stop:before{left:-35px}.journey-banner img{aspect-ratio:4/3}.meeting-row{padding-block:35px}.story-breadcrumb{font-size:12px}.story-table th,.story-table td{padding:14px}}