[data-company-depth]{position:relative;isolation:isolate;min-width:0;max-width:640px}
[data-company-depth]:not(.company-depth-availability){width:100%;max-width:100%;aspect-ratio:4/3}
.brand-experience .br-visual[data-company-depth]{margin-inline:auto}
[data-company-depth]:not(.company-depth-availability)>svg{position:absolute;inset:0;width:100%;height:100%}
.company-depth-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;opacity:0;transition:opacity .35s ease}
[data-company-depth][data-depth-ready=true]>.company-depth-canvas{opacity:1}
[data-company-depth][data-depth-ready=true]>svg{visibility:hidden;opacity:0}
.company-depth-availability{width:100%;max-width:none;height:240px;margin:0 auto 14px}
.company-depth-controls{display:flex;justify-content:flex-end;width:100%;margin:12px 0 0}
.company-depth-controls[hidden]{display:none}
.company-depth-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:7px 12px;border:1px solid #16355b21;border-radius:24px;color:#526781;background:#ffffff35;font:400 13px/1.5 var(--body,Arial,sans-serif);cursor:pointer;transition:color .2s,border-color .2s}
.company-depth-toggle:hover{color:#0e5bd6;border-color:#0e5bd660}
.company-depth-toggle:focus-visible{outline:2px solid #0e5bd6;outline-offset:4px}
@media(max-width:760px){.company-depth-availability{height:200px}.company-depth-toggle{min-height:40px}.company-depth-controls{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.company-depth-canvas,.company-depth-toggle{transition:none}}
/* The optional motion control sits beside the study, outside the reading grid. */
.br-hero .company-depth-controls{position:absolute;right:6.5vw;bottom:90px;width:auto;margin:0}
.practical-hero:has([data-company-depth]){position:relative}
.practical-hero .company-depth-controls{position:absolute;right:0;bottom:20px;width:auto;margin:0}
@media(max-width:760px){.br-hero .company-depth-controls{bottom:90px;right:6.5vw}.practical-hero .company-depth-controls{bottom:8px}}
@media(min-width:761px){.br-hero .company-depth-controls{right:calc(6.5vw + 42px)}}
/* Larger reading labels flow naturally below the scene on a phone. */
@media(max-width:760px){
 .brand-experience .br-hero{padding-bottom:40px}
 .br-hero .company-depth-controls{position:static;grid-column:1/-1;justify-self:end;order:3;width:auto;margin:12px 0 0}
 .brand-experience .br-hero .br-hero-legend{position:static;grid-column:1/-1;order:4;margin:20px 0 0}
}

/* Reserve the final control footprint before its enhancement module arrives. */
.company-depth-controls[data-company-motion-placeholder][data-motion-state=pending]{visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){.company-depth-controls[data-company-motion-placeholder][data-motion-state=pending]{display:none}}