/* An editorial research instrument for the case studies. */
.cases-explore{padding-top:90px;padding-bottom:110px}
.cases-explore .section-head{border-color:#49616a}
.case-explorer{--cx-border:#8b9b9d;--cx-salmon:#ef806b;border:1px solid #607780;background:#122a34;color:#f7f7f2;box-shadow:18px 18px 0 rgba(4,18,25,.25)}
.case-explorer button{cursor:pointer}
.case-explorer button:focus-visible,.case-explorer summary:focus-visible,.case-explorer__screen:focus-visible,.case-explorer-dialog button:focus-visible,.case-explorer-dialog__stage:focus-visible{outline:3px solid #f39884;outline-offset:3px}
.case-explorer__selectors{display:flex;align-items:end;justify-content:space-between;gap:22px;padding:22px 26px;border-bottom:1px solid #59717a;background:#0d2029}
.case-explorer__selector{min-width:0}
.case-explorer__selector>span,.case-explorer__intro span,.case-explorer__navigation-head,.case-explorer__screen-top,.case-explorer__screen-bottom,.case-explorer__reading small,.case-explorer__inspection-head,.case-explorer-dialog__head small{display:block;font:700 10px/1.3 var(--mono);letter-spacing:.105em;text-transform:uppercase}
.case-explorer__selector>span{margin-bottom:10px;color:#f28b78}
.case-explorer .pill-group{display:flex;flex-wrap:wrap;gap:4px;border:0;padding:0}
.case-explorer .pill-group button{min-height:41px;border:1px solid #728891;background:transparent;color:#d3dddc;padding:10px 13px;font:700 10px/1.3 var(--mono);letter-spacing:.025em;text-transform:uppercase;transition:background .2s,border-color .2s,color .2s}
.case-explorer .pill-group button:hover{border-color:#ef806b;color:#fff}
.case-explorer .pill-group button[aria-pressed="true"]{background:#f9f5ec;border-color:#f9f5ec;color:#10232c}
.case-explorer .pill-group button:disabled{cursor:default;opacity:.7}
.case-explorer__intro{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(230px,.65fr);gap:35px;align-items:end;padding:35px 31px 37px;background:radial-gradient(ellipse at 85% -30%,rgba(239,128,107,.2),transparent 48%),#122a34}
.case-explorer__intro span{color:#f28b78;margin-bottom:14px}
.case-explorer__intro h3{margin:0;max-width:740px;font:400 clamp(31px,3vw,45px)/1.08 var(--editorial);letter-spacing:-.035em;text-wrap:balance}
.case-explorer__intro p{margin:0 0 3px;color:#c0d0cf;font-size:13px;line-height:1.65;max-width:360px}
.case-explorer__workspace{display:grid;grid-template-columns:minmax(230px,26%) minmax(0,1fr);border-top:1px solid #607780;min-width:0}
.case-explorer__navigation{min-width:0;background:#e9e5dc;color:#10232c;border-right:1px solid #899b9b}
.case-explorer__navigation-head{display:flex;justify-content:space-between;align-items:center;gap:10px;color:#39545a;padding:19px 18px 17px;border-bottom:1px solid #aab7b3}
.case-explorer__navigation-head span:last-child{color:#b4382e}
.case-explorer__scene-list{display:flex;flex-direction:column}
.case-explorer__scene{display:grid;grid-template-columns:72px minmax(0,1fr);gap:13px;align-items:center;min-width:0;min-height:93px;width:100%;border:0;border-bottom:1px solid #bac5c0;background:transparent;color:#18313b;text-align:left;padding:11px 14px 11px 18px;transition:background .22s,padding-left .22s,color .22s}
.case-explorer__scene:hover{background:#dcded6;padding-left:22px}
.case-explorer__scene.is-active{background:#f9f7f0;box-shadow:inset 5px 0 #c63d2f}
.case-explorer__scene img{display:block;width:72px;height:67px;object-fit:cover;object-position:center top;background:#fff;border:1px solid #b8c2bc}
.case-explorer__scene span{min-width:0}
.case-explorer__scene small{display:block;margin-bottom:5px;color:#a73b31;font:700 9px/1.2 var(--mono);letter-spacing:.07em;text-transform:uppercase}
.case-explorer__scene strong{display:block;font:700 14px/1.25 var(--display);letter-spacing:-.025em}
.case-explorer__scene:disabled{cursor:default}
.case-explorer__module-index{padding:0 18px 20px}
.case-explorer__module-index[hidden]{display:none}
.case-explorer__module-index summary{display:flex;justify-content:space-between;gap:10px;list-style:none;cursor:pointer;border-bottom:1px solid #aab7b3;padding:20px 0 13px;color:#1a3540;font:700 10px/1.25 var(--mono);text-transform:uppercase;letter-spacing:.06em}
.case-explorer__module-index summary::-webkit-details-marker{display:none}
.case-explorer__module-index summary span{font-size:19px;color:#bb3d31;line-height:.7}
.case-explorer__module-index[open] summary span{transform:rotate(45deg)}
.case-explorer__module-index p{color:#4d6469;font-size:11px;line-height:1.45;margin:12px 0 0}
.case-explorer__module-list{display:flex;flex-wrap:wrap;gap:6px;padding-top:14px}
.case-explorer__module-list button,.case-explorer__module-list span{display:inline-flex;align-items:center;min-height:29px;border:1px solid #aebbb5;background:transparent;color:#496269;padding:5px 7px;text-align:left;font:700 9px/1.25 var(--mono);letter-spacing:.015em}
.case-explorer__module-list button:hover,.case-explorer__module-list button.is-active{background:#c53a2e;border-color:#c53a2e;color:white}
.case-explorer__module-list span{background:#d7dbd4;color:#435a5f}
.case-explorer__content{min-width:0;background:#f8f7f2;color:#10232c}
.case-explorer__screen-top,.case-explorer__screen-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;background:#e9e5dc;color:#3e585e;padding:9px 17px;min-height:48px}
.case-explorer__screen-top{border-bottom:1px solid #aabbb6}
.case-explorer__screen-top>div{display:flex;gap:5px}
.case-explorer__screen-top button{width:34px;height:29px;border:1px solid #9daea9;color:#122a34;background:#f6f5ef;font-size:18px;line-height:1}
.case-explorer__screen-top button:hover{border-color:#c73b2e;background:#c73b2e;color:white}
.case-explorer__screen{height:565px;overflow:auto;overscroll-behavior:contain;background:#d4d9d6;scrollbar-color:#adbbb7 #e8e9e6;scrollbar-width:thin}
.case-explorer__screen img{display:block;width:max(100%,980px);height:auto;max-width:none;object-fit:initial;background:white}
.case-explorer__screen-bottom{border-top:1px solid #aabbb6;border-bottom:1px solid #aabbb6}
.case-explorer__screen-bottom>span{color:#435a5f}
.case-explorer__screen-bottom button{border:0;background:#bd3c2f;color:#fff;padding:10px 13px;font:700 10px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.case-explorer__screen-bottom button:hover{background:#8f2a23}
.case-explorer__screen-bottom button span{padding-left:8px}
.case-explorer__reading{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:28px;padding:28px 31px 30px;border-bottom:1px solid #bdc8c3}
.case-explorer__reading>div+div{border-left:1px solid #bdc8c3;padding-left:28px}
.case-explorer__reading small{color:#b73c30;margin-bottom:11px}
.case-explorer__reading h4{font:400 clamp(27px,2.5vw,38px)/1.05 var(--editorial);letter-spacing:-.035em;margin:0 0 12px;text-wrap:balance}
.case-explorer__reading p{font-size:13px;line-height:1.62;color:#475f64;margin:0}
.case-explorer__inspection{padding:21px 31px 26px;background:#ece9e1}
.case-explorer__inspection-head{display:flex;justify-content:space-between;gap:12px;color:#455d62;margin-bottom:13px}
.case-explorer__inspection-head span:last-child{font-weight:400;color:#4d6267;text-transform:none;letter-spacing:0}
.case-explorer__spot-list{display:flex;flex-wrap:wrap;gap:6px}
.case-explorer__spot{border:1px solid #aabbb6;background:#f8f7f2;color:#39535a;padding:10px 13px;font:700 10px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.03em}
.case-explorer__spot:hover{border-color:#b73c30}
.case-explorer__spot[aria-pressed="true"]{background:#162d37;border-color:#162d37;color:white}
.case-explorer__inspection p{min-height:1.4em;color:#536b6f;font-size:12px;line-height:1.5;margin:13px 0 0}

.case-explorer-dialog{position:fixed;inset:0;margin:auto;width:min(1360px,96vw);max-width:none;height:min(960px,94vh);max-height:none;padding:0;border:1px solid #8b9da0;color:#f5f5ed;background:#0f232d;box-shadow:0 28px 100px rgba(0,0,0,.56)}
.case-explorer-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.case-explorer-dialog::backdrop{background:rgba(3,13,18,.84);backdrop-filter:blur(5px)}
.case-explorer-dialog__head,.case-explorer-dialog__foot{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 18px}
.case-explorer-dialog__head{border-bottom:1px solid #5a7077}
.case-explorer-dialog__head small{color:#f28b78;margin-bottom:4px}
.case-explorer-dialog__head strong{font:400 25px/1.1 var(--editorial)}
.case-explorer-dialog__head>button{width:39px;height:39px;border:1px solid #7e9698;background:transparent;color:#fff;font:300 29px/1 var(--mono)}
.case-explorer-dialog__head>button:hover{background:#c33b2e;border-color:#c33b2e}
.case-explorer-dialog__stage{min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;background:#d4d9d6;scrollbar-color:#9db0aa #d4d9d6}
.case-explorer-dialog__stage img{display:block;height:auto;max-width:none;margin:0 auto;background:white}
.case-explorer-dialog__stage.is-fit img{max-width:100%;width:auto}
.case-explorer-dialog__foot{border-top:1px solid #5a7077}
.case-explorer-dialog__foot button{min-height:39px;border:1px solid #74898d;background:transparent;color:#fff;padding:8px 10px;font:700 10px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.035em}
.case-explorer-dialog__foot button:hover{background:#c43c30;border-color:#c43c30}
.case-explorer-dialog__zoom{display:flex;align-items:center;gap:5px}
.case-explorer-dialog__zoom output{min-width:58px;text-align:center;font:700 11px var(--mono);color:#e3ebea}

@media(max-width:1100px){
  .case-explorer__selectors{align-items:stretch;flex-wrap:wrap}
  .case-explorer__selector{flex:1 1 340px}
  .case-explorer__workspace{grid-template-columns:minmax(220px,27%) minmax(0,1fr)}
  .case-explorer__scene{grid-template-columns:59px minmax(0,1fr);gap:9px;padding-left:12px}
  .case-explorer__scene img{width:59px;height:58px}
}
@media(max-width:820px){
  .cases-explore{padding-top:73px;padding-bottom:85px}
  .case-explorer__intro{grid-template-columns:1fr;gap:14px}
  .case-explorer__workspace{display:block}
  .case-explorer__navigation{border-right:0;border-bottom:1px solid #879b99}
  .case-explorer__navigation-head{padding:14px 18px}
  .case-explorer__scene-list{display:flex;flex-direction:row;overflow-x:auto;scrollbar-width:thin}
  .case-explorer__scene{flex:0 0 190px;min-height:88px;border-right:1px solid #bac5c0;border-bottom:0;grid-template-columns:54px minmax(0,1fr);gap:8px;padding:10px}
  .case-explorer__scene img{width:54px;height:55px}
  .case-explorer__scene strong{font-size:13px}
  .case-explorer__scene.is-active{box-shadow:inset 0 -4px #c63d2f}
  .case-explorer__module-index{padding-bottom:0}
  .case-explorer__module-index summary{padding:13px 0}
  .case-explorer__module-list{padding-bottom:15px}
  .case-explorer__screen{height:520px}
  .case-explorer__screen img{width:max(100%,700px)}
}
@media(max-width:600px){
  .case-explorer{box-shadow:8px 8px 0 rgba(4,18,25,.25)}
  .case-explorer__selectors{padding:17px;gap:16px}
  .case-explorer__selector{flex-basis:100%}
  .case-explorer .pill-group button{font-size:9px;min-height:37px;padding:8px 9px}
  .case-explorer__intro{padding:27px 20px}
  .case-explorer__intro h3{font-size:31px}
  .case-explorer__screen{height:400px}
  .case-explorer__screen img{width:max(100%,560px)}
  .case-explorer__screen-top,.case-explorer__screen-bottom{padding:8px 11px;font-size:9px}
  .case-explorer__screen-bottom>span{max-width:150px;line-height:1.25}
  .case-explorer__reading{grid-template-columns:1fr;gap:20px;padding:26px 20px}
  .case-explorer__reading>div+div{border-left:0;border-top:1px solid #bdc8c3;padding:19px 0 0}
  .case-explorer__inspection{padding:20px}
  .case-explorer__inspection-head{display:block}
  .case-explorer__inspection-head span:last-child{display:block;margin-top:5px}
  .case-explorer-dialog{width:100vw;height:100dvh;border:0}
  .case-explorer-dialog__head,.case-explorer-dialog__foot{padding:10px}
  .case-explorer-dialog__head strong{font-size:21px}
  .case-explorer-dialog__foot>button{font-size:0;min-width:38px}
  .case-explorer-dialog__foot>button:first-child:after{content:'←';font-size:17px}
  .case-explorer-dialog__foot>button:last-child:after{content:'→';font-size:17px}
  .case-explorer-dialog__zoom{gap:2px}
  .case-explorer-dialog__zoom button{padding:6px;font-size:10px}
  .case-explorer-dialog__zoom output{min-width:45px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){.case-explorer__scene,.case-explorer .pill-group button{transition:none}}