/* Case reading only. Nearly square source images must fill both media columns;
   an odd source pixel must not activate the standalone portrait width here. */
#case-content .case-media-grid>.case-media,
#case-content .case-media-grid>.case-artboard{width:100%;max-width:none;min-width:0;margin:0}
#case-content .case-media-grid img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain}

/* Section titles use the secondary face while the hero and h3 drawing stay as
   authored. Native text keeps the shared word reveal and normal line wrapping. */
#case-content .case-template-copy h4{font:500 clamp(25px,2.7vw,37px)/1.3 'DM Sans',sans-serif;letter-spacing:-.025em;text-wrap:pretty;margin:0 0 28px}
#case-content .case-template-copy h4>.word-mask{display:inline-block}

#case-content .case-contributions,
#case-content .case-template-copy ul{list-style:none;padding:0;margin:0}
#case-content .case-contributions li,
#case-content .case-template-copy li{position:relative;padding-left:34px;margin:0 0 18px}
#case-content .case-contributions li{font:400 14px/1.6 'DM Sans',sans-serif;letter-spacing:-.01em;padding-top:2px}
#case-content .case-contributions li:last-child,
#case-content .case-template-copy li:last-child{margin-bottom:0}
#case-content .case-bullet-illustration{position:absolute;left:0;top:.12em;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;overflow:visible;pointer-events:none}
#case-content .case-contributions .case-bullet-illustration{top:0;width:23px;height:23px}

@media(max-width:700px){
 #case-content .case-contributions{margin:0 0 26px}
 #case-content .case-template-copy h4{font-size:26px;line-height:1.3;margin-bottom:24px}
}

/* Scenic case artifacts use a quiet, stationary device. Their source canvas
   and original image ratio remain intact; no mobile design is inferred. */
#case-content [data-case-device='laptop']{width:100%;max-width:none;box-sizing:border-box;padding:clamp(24px,4.6vw,66px) clamp(16px,4vw,58px);background:#e9e3da;overflow:hidden}
#case-content .case-device-laptop{display:block;position:relative;width:100%;max-width:1080px;margin:0 auto;padding-bottom:2.2%;filter:drop-shadow(0 17px 15px #26272322)}
#case-content .case-device-lid{display:block;position:relative;margin:0 3.3%;padding:clamp(7px,1.05vw,15px);padding-top:clamp(11px,1.55vw,22px);background:#242727;border:1px solid #5c6060;border-radius:clamp(9px,1.2vw,17px) clamp(9px,1.2vw,17px) 4px 4px}
#case-content .case-device-camera{position:absolute;top:clamp(3px,.48vw,7px);left:calc(50% - 1.5px);width:3px;height:3px;background:#101c20;border:1px solid #4b5252;border-radius:50%}
#case-content .case-device-screen{display:block;position:relative;isolation:isolate;overflow:hidden;background:#ece2d8;border-radius:2px}
#case-content .case-device-screen>img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain}
#case-content .case-device-base{position:absolute;left:0;right:0;bottom:0;display:block;height:3%;min-height:8px;background:linear-gradient(#d9d9d5 0%,#c2c3c0 45%,#969b99 100%);border-radius:1px 1px 50% 50%/1px 1px 85% 85%;box-shadow:0 1px 0 #777e7b}
#case-content .case-device-base:before{content:'';position:absolute;left:41%;top:0;width:18%;height:34%;background:#909693;border-radius:0 0 7px 7px}
/* Keep shared case-image rules out of the native source's absolute IMG slots. */
#case-content .case-device-screen>.project-live-preview-scenic{display:block;position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;border-radius:0;transform:none;opacity:1;visibility:visible;pointer-events:none}
#case-content .case-device-screen .project-live-preview-scenic img{position:absolute;max-width:none;max-height:none;border:0;border-radius:0;object-fit:fill}
@media(max-width:700px){
 #case-content [data-case-device='laptop']{padding:24px 10px 28px}
 #case-content .case-device-laptop{padding-bottom:2.4%;filter:drop-shadow(0 9px 8px #26272320)}
 #case-content .case-device-lid{margin-inline:2.5%;padding:5px;padding-top:10px;border-radius:8px 8px 3px 3px}
 #case-content .case-device-camera{top:3px;width:2px;height:2px;left:calc(50% - 1px)}
}

/* Case composition has distinct narrative roles. Shared atmosphere, header,
   reading reveals and the native source devices remain owned by the app. */
#case-content .case-heading{grid-template-columns:minmax(0,1fr)}
#case-content .case-template-section{--case-rule:#fff5df38}
#case-content .case-template-section[data-case-layout='process']{display:block;padding:clamp(38px,5.8vw,80px) 6%;background:#0b2136}
#case-content [data-case-layout='process']>h3{margin:0 0 34px;font-size:clamp(28px,3.3vw,42px)}
#case-content [data-case-layout='process'] .case-template-copy{min-width:0}
#case-content [data-case-layout='process'] .case-prose{max-width:62ch;margin-bottom:24px}
#case-content [data-case-layout='process'] .case-prose p{font-size:clamp(17px,1.5vw,20px);line-height:1.6}
#case-content .case-template-copy .case-process-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(30px,5vw,72px);list-style:none;padding:0;margin:0}
#case-content .case-process-grid>li{min-width:0;max-width:none;margin:0;padding:25px 0 29px;border-top:1px solid var(--case-rule);font:400 clamp(18px,1.65vw,22px)/1.55 'DM Sans',sans-serif;letter-spacing:-.018em}

#case-content .case-template-section[data-case-layout='challenge']{display:block;--case-rule:#07182d30;background:#f0ebdf;color:#07182d;padding:clamp(40px,6.2vw,88px) 6%}
#case-content [data-case-layout='challenge']>h3{margin:0 0 32px}
#case-content [data-case-layout='challenge'] .case-template-copy{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px 48px}
#case-content [data-case-layout='challenge'] .case-template-copy>h4{grid-column:1/-1;max-width:23ch;font:500 clamp(30px,4.25vw,58px)/1.16 'DM Sans',sans-serif;letter-spacing:-.035em;margin:0;text-wrap:pretty}
#case-content [data-case-layout='challenge'] .case-prose{grid-column:2;max-width:54ch;border-top:1px solid var(--case-rule);padding-top:26px}
#case-content [data-case-layout='challenge'] .case-prose p{font-size:clamp(18px,1.7vw,23px);line-height:1.6;letter-spacing:-.015em}

#case-content .case-template-section[data-case-layout='solution']{grid-template-columns:minmax(140px,.72fr) minmax(0,2fr);gap:clamp(28px,4vw,58px);padding:clamp(42px,6vw,84px) 6%;background:#07182d}
#case-content [data-case-layout='solution'] .case-template-copy>h4{font-size:clamp(29px,3.4vw,46px);line-height:1.25;max-width:25ch;margin-bottom:34px}
#case-content [data-case-layout='solution'] .case-prose{max-width:60ch}
#case-content [data-case-layout='solution'] .case-prose p{font-size:clamp(18px,1.7vw,23px);line-height:1.65}
#case-content .case-template-copy .case-decision-list>li{margin:0;max-width:none;padding:23px 0 25px 38px;border-top:1px solid var(--case-rule)}
#case-content .case-decision-list .case-bullet-illustration{top:25px;width:22px;height:22px}

/* Authored source windows remove empty portrait background, never the device,
   adjacent illustration or graphic artwork. Source files are unchanged. */
#case-content .case-media[data-media-presentation='framed']{width:100%;max-width:none;margin-inline:0}
#case-content .case-media-frame{display:grid;place-items:center;width:100%;aspect-ratio:4/3;box-sizing:border-box;background:var(--case-media-field,#e9e3da);overflow:hidden}
#case-content .case-media-crop{position:relative;display:block;height:100%;max-width:100%;aspect-ratio:var(--case-crop-ratio);overflow:hidden}
#case-content .case-media-crop>img{position:absolute;display:block;left:var(--case-image-left);top:var(--case-image-top);width:var(--case-image-width);height:var(--case-image-height);max-width:none;max-height:none;object-fit:fill}

#case-content .case-ending{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:24px;padding-inline:2%;background:transparent}
#case-content .case-ending .case-outro-link{min-width:0;font-size:clamp(18px,2vw,24px)!important;white-space:nowrap}
#case-content .case-ending [data-all-projects]{margin-left:auto;text-align:right}

@media(max-width:700px){
 #case-content .case-template-copy .case-process-grid{grid-template-columns:minmax(0,1fr)}
 #case-content [data-case-layout='process']>h3{margin-bottom:26px}
 #case-content .case-process-grid>li{padding:22px 0 25px;font-size:19px;line-height:1.6}
 #case-content [data-case-layout='challenge'] .case-template-copy{display:block}
 #case-content [data-case-layout='challenge'] .case-template-copy>h4{font-size:clamp(29px,7vw,38px);line-height:1.2;margin-bottom:28px}
 #case-content [data-case-layout='challenge'] .case-prose{max-width:none;padding-top:24px}
 #case-content .case-template-section[data-case-layout='solution']{display:block}
 #case-content [data-case-layout='solution']>h3{margin-bottom:26px}
 #case-content [data-case-layout='solution'] .case-template-copy>h4{font-size:28px;line-height:1.3;margin-bottom:28px}
 #case-content .case-decision-list .case-bullet-illustration{top:25px}
 #case-content .case-media-frame{aspect-ratio:4/3}
 #case-content .case-ending{min-height:140px;gap:16px;padding:28px 0 38px}
}
