.das-diagram{background-color:var(--das-blue);background-image:var(--diagram-paper);background-repeat:no-repeat;background-size:100% 100%;color:var(--das-sand);scroll-margin-top:24px}
.das-diagram__wrap{max-width:1280px;margin:0 auto;padding:54px max(24px,4vw) 40px}
.das-diagram__heading{display:flex;align-items:end;justify-content:space-between;gap:40px;padding-bottom:24px;border-bottom:1px solid rgba(235,226,209,.65)}
.das-diagram .das-diagram__heading h2{color:var(--das-sand);max-width:17ch;font-size:clamp(32px,3.7vw,48px)}
.das-diagram__heading p{max-width:31ch;margin:0;font-size:17px;line-height:1.5}
.das-diagram__layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:36px;align-items:center}
.das-diagram figure{margin:0}
.das-diagram__front{position:relative;height:600px;min-width:0}
.das-diagram .das-diagram__bag{position:absolute;right:-10px;top:0;width:76%;height:100%;object-fit:contain}
.das-diagram__leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.das-diagram svg path{stroke:currentColor;stroke-width:1.3;vector-effect:non-scaling-stroke;fill:none}
.das-diagram svg circle{fill:currentColor}
.das-diagram__leaders--mobile{display:none}
.das-diagram__callout{position:absolute;left:0;max-width:148px}
.das-diagram .das-diagram__callout h3,.das-diagram .das-diagram__inset h3{color:var(--das-sand);font-size:19px;line-height:1.2;letter-spacing:.015em;max-width:none}
.das-diagram__callout p{font-size:16px;line-height:1.4;margin:7px 0 0}
.das-diagram__callout--closure{top:50px}
.das-diagram__callout--canvas{top:445px}
.das-diagram__front>figcaption{position:absolute;bottom:0;left:28%;right:0;text-align:center;font-size:17px;font-weight:600;letter-spacing:.01em}
.das-diagram__inside{display:grid;grid-template-columns:1fr;gap:26px;padding:30px 0}
.das-diagram__inset{position:relative;max-width:340px;margin-left:auto!important;width:100%}
.das-diagram__inset-photo{height:160px;overflow:hidden;border:1px solid rgba(235,226,209,.7)}
.das-diagram .das-diagram__inset-photo img{width:100%;height:100%;object-fit:cover;object-position:center 58%}
.das-diagram__inset-leader{position:absolute;top:0;left:0;width:100%;height:215px;pointer-events:none}
.das-diagram__inset figcaption{padding-top:15px;padding-right:35px}
.das-diagram__inset figcaption p{font-size:16px;line-height:1.45;margin:8px 0 0;max-width:31ch}
.das-diagram .das-diagram__link{color:var(--das-sand);margin-top:18px;min-height:44px}
@media(min-width:1200px){.das-diagram__front{height:650px}.das-diagram__callout--closure{top:65px}.das-diagram__callout--canvas{top:485px}}
@media(max-width:749px){.das-diagram__wrap{padding:36px 24px 28px}.das-diagram__heading{display:block;padding-bottom:20px}.das-diagram .das-diagram__heading h2{font-size:32px;max-width:17ch}.das-diagram__heading p{font-size:16px;line-height:1.45;margin-top:16px;max-width:34ch}.das-diagram__layout{display:block}.das-diagram__front{height:430px;margin:12px -8px 24px!important}.das-diagram .das-diagram__bag{width:80%;right:-18px}.das-diagram__leaders--desktop{display:none}.das-diagram__leaders--mobile{display:block}.das-diagram__callout{max-width:112px}.das-diagram .das-diagram__callout h3{font-size:16px;line-height:1.2;letter-spacing:.01em}.das-diagram__callout p{font-size:14px;line-height:1.35}.das-diagram__callout--closure{top:18px}.das-diagram__callout--canvas{top:365px}.das-diagram__front>figcaption{font-size:15px;left:30%;bottom:0}.das-diagram__inside{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:0;margin-top:20px}.das-diagram__inset{max-width:none;margin:0!important}.das-diagram__inset-photo{height:138px}.das-diagram__inset-leader{height:185px}.das-diagram__inset figcaption{padding-top:14px;padding-right:10px}.das-diagram .das-diagram__inset h3{font-size:17px;line-height:1.2}.das-diagram__inset figcaption p{font-size:15px;line-height:1.4;margin-top:7px}.das-diagram__link{margin-top:26px!important}}
@media(max-width:749px){
 .das-diagram{background-image:var(--diagram-paper-mobile);background-repeat:no-repeat;background-size:100% 100%}
 .das-diagram__front{height:600px;margin:22px 0 30px!important}
 .das-diagram .das-diagram__bag{width:94%;height:450px;top:76px;right:3%}
 .das-diagram__callout{max-width:170px}
 .das-diagram .das-diagram__callout h3{font-size:18px}
 .das-diagram__callout p{font-size:16px;line-height:1.4}
 .das-diagram__callout--closure{top:0}
 .das-diagram__callout--canvas{top:535px}
 .das-diagram__front>figcaption{font-size:16px;left:auto;right:0;bottom:5px;max-width:130px;text-align:right}
 .das-diagram__inside{grid-template-columns:1fr;gap:34px;margin-top:0}
 .das-diagram__inset-photo{height:220px}
 .das-diagram__inset-leader{height:286px}
 .das-diagram__inset figcaption{padding-right:40px}
 .das-diagram .das-diagram__inset h3{font-size:18px}
 .das-diagram__inset figcaption p{font-size:16px;max-width:30ch}
}
@media(max-width:374px){.das-diagram__wrap{padding-left:20px;padding-right:20px}.das-diagram__inset-photo{height:200px}}
.das-diagram__layout{display:block}
.das-diagram__front{height:700px!important}
.das-diagram .das-diagram__bag{width:60%;right:20%}
.das-diagram__extra-leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.das-diagram__extra-leaders--mobile{display:none}
.das-diagram__callout--flap,.das-diagram__callout--loops,.das-diagram__callout--bottle{left:auto;right:0;max-width:170px}
.das-diagram__callout--flap{top:115px}.das-diagram__callout--loops{top:335px}.das-diagram__callout--bottle{top:465px}
.das-diagram__inside{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.das-diagram__inset{max-width:none}
.das-diagram__front>figcaption{left:20%;right:20%}
@media(max-width:749px){
 .das-diagram__front{height:780px!important}
 .das-diagram .das-diagram__bag{width:73%;height:470px;top:175px;right:auto;left:-6%}
 .das-diagram__callout--closure{top:0;max-width:170px}
 .das-diagram__callout--canvas{top:690px}
 .das-diagram__callout--flap,.das-diagram__callout--loops,.das-diagram__callout--bottle{max-width:110px}
 .das-diagram__callout--flap{top:120px}.das-diagram__callout--loops{top:400px}.das-diagram__callout--bottle{top:555px}
 .das-diagram__front>figcaption{left:auto;right:0;bottom:6px}
 .das-diagram__inside{grid-template-columns:1fr}
 .das-diagram__extra-leaders--desktop{display:none}.das-diagram__extra-leaders--mobile{display:block}
}
