/* DT360 ABOUT 1.2.5 | Desktop / tablet layout. Loaded with media >=821px. */
@media (min-width:821px) {
 .dt360-about-system { max-width:590px; justify-self:end; }
 .dt360-about-system-scene { height:615px; }
 .dt360-about-system-layers { position:absolute; inset:0; }
 .dt360-about-system-layer { position:absolute; left:2%; width:96%; height:250px; display:grid; place-items:center; }
 .dt360-about-system-layer--business { top:0; z-index:3; }
 .dt360-about-system-layer--process { top:180px; z-index:2; }
 .dt360-about-system-layer--technology { top:360px; z-index:1; }
 /* Information is positioned on the exposed front half of each plane. */
 .dt360-about-layer-label { display:grid; grid-template-columns:64px 1px max-content; grid-template-rows:auto auto; column-gap:16px; row-gap:4px; align-items:center; justify-items:start; text-align:left; justify-self:center; width:max-content; max-width:88%; transform:translateY(0); }
 .dt360-about-layer-label::before { content:""; grid-column:2; grid-row:1 / span 2; align-self:stretch; width:1px; min-height:60px; background:var(--dt360-ds-lavender); opacity:.85; }
 .dt360-about-layer-label .dt360-ds-h3 { grid-column:3; grid-row:1; margin:0; font-size:28px; }
 .dt360-about-layer-label .dt360-about-icon { grid-column:1; grid-row:1 / span 2; width:64px; height:64px; stroke:var(--dt360-ds-white); stroke-width:1.9; filter:drop-shadow(0 0 5px var(--dt360-ds-lavender)); }
 .dt360-about-layer-label .dt360-ds-note { grid-column:3; grid-row:2; max-width:100%; font-size:15px; }
}

@media (min-width:821px) and (max-width:1100px) {
 .dt360-about-system-scene { height:565px; }
 .dt360-about-system-layer { height:230px; }
 .dt360-about-system-layer--process { top:165px; }
 .dt360-about-system-layer--technology { top:330px; }
 .dt360-about-layer-label { width:max-content; max-width:88%; column-gap:10px; row-gap:3px; transform:translateY(0); grid-template-columns:46px 1px max-content; }
 .dt360-about-layer-label::before { min-height:46px; }
 .dt360-about-layer-label .dt360-about-icon { width:46px; height:46px; }
 .dt360-about-layer-label .dt360-ds-h3 { font-size:25px; }
 .dt360-about-layer-label .dt360-ds-note { font-size:14.5px; }
}

/* S03 LANDKARTE: desktop map and in-place detail area; no section height changes on selection. */
@media (min-width:1101px) {
 .dt360-about-s03-intro { grid-column:span 2; }
 .dt360-about-s03-person { grid-column:span 1; }
}
@media (min-width:1280px) {
 .dt360-about-s03-intro { grid-column:span 2; }
 .dt360-about-s03-person { grid-column:span 1; }
 .dt360-about-s03-map { grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr); }
 .dt360-about-responsibility[data-map-ready="true"][data-map-mode="inline"] .dt360-about-s03-map { height:clamp(500px,35vw,540px); }
 .dt360-about-responsibility[data-map-ready="true"] .dt360-about-s03-map-nav { grid-template-rows:repeat(3,minmax(0,1fr)); }
 .dt360-about-s03-map-pair { align-self:stretch; min-height:0; }
}
