/* A functional portrait media viewport, on the portfolio's shared light paper. */
.art-case[data-case=kia] .case-heading{grid-template-columns:1fr 1fr;align-items:end;margin:2.25rem 0 1.5rem}
.art-case[data-case=kia] .case-heading h1{font-size:clamp(2rem,3.5vw,3.75rem);line-height:1.08}
.art-case[data-case=kia] .case-introduction{max-width:28rem;justify-self:end}
.art-case[data-case=kia] .case-introduction>p{font-size:1rem}
.art-case[data-case=kia] .case-category,.art-case[data-case=kia] .case-watch,.art-case[data-case=kia] .case-caption-line{display:none}
.art-case[data-case=kia] .original-story{margin:0 auto;padding-bottom:3rem}
.social-reader{--social-height:clamp(400px,66svh,650px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,25rem) minmax(0,1fr);gap:clamp(1.5rem,4vw,4.5rem);align-items:start;padding:1.75rem 0 3rem}
.social-reader [hidden]{display:none!important}
.social-intro{padding-top:3rem}
.social-kicker{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--case-accent);margin:0 0 1.5rem}
.social-intro h2{font-family:Manrope,Arial,sans-serif;font-weight:500;font-size:clamp(2rem,3.35vw,3.8rem);line-height:1.08;letter-spacing:-.055em;margin:0 0 2rem}
.social-intro h2 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--case-accent);letter-spacing:-.04em}
.social-format{font-size:.875rem;line-height:1.7;margin:0 0 2rem}
.social-instruction{max-width:19rem;font-size:.875rem;line-height:1.65;color:var(--case-muted);margin:0 0 1.25rem}
.social-skip{display:inline-flex;align-items:center;min-height:44px;color:var(--case-accent);font-size:.875rem;text-underline-offset:.3em}
.social-skip:hover{text-decoration:underline}
.social-device{min-width:0;max-width:25rem;width:100%;justify-self:center}
.social-device-head{display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:1rem .75rem;font-size:.75rem;line-height:1.4;color:var(--case-accent)}
.social-device-head>span:first-child{font-size:.875rem;font-weight:700;color:var(--case-ink)}
.social-device-head>span:first-child>span{font-size:.75rem;font-weight:400}
.social-viewport{position:relative;outline-offset:6px}
.social-reader .social-slide{position:relative;margin:0 0 2rem;min-width:0;scroll-margin:0}
.social-slide video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:#151713;border:0}
.social-slide figcaption{display:flex;gap:1rem;justify-content:space-between;padding:.75rem 0;font-size:.8125rem;line-height:1.5;color:var(--case-muted)}
.social-slide figcaption>a{white-space:nowrap;color:var(--case-accent);text-underline-offset:.25em}
.social-alias{position:absolute;inset:0 auto auto 0;width:0;height:0}
.social-reader[data-enhanced=true] .social-device{width:min(100%,calc(var(--social-height)*9/16 + 1rem + 2px));padding:.5rem;border:1px solid #c9c8bf;border-radius:2rem;background:#eae9e1;box-shadow:0 2px 0 #ceccc1,0 18px 32px -24px #26251966}
.social-reader[data-enhanced=true] .social-viewport{height:auto;aspect-ratio:9/16;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scrollbar-width:none;overscroll-behavior-y:auto;touch-action:pan-y pinch-zoom;background:var(--case-paper)}
.social-reader[data-enhanced=true] .social-viewport::-webkit-scrollbar{display:none}
.social-reader[data-enhanced=true] .social-slide{height:100%;margin:0;scroll-snap-align:start;scroll-snap-stop:always}
.social-reader[data-enhanced=true] .social-slide video{width:100%;height:100%;min-height:0;aspect-ratio:auto;object-fit:contain}
.social-reader[data-enhanced=true] .social-slide figcaption{display:none}
.social-current{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem;padding:.9rem .5rem .25rem;font-size:.75rem;line-height:1.5}
.social-current>a{color:var(--case-accent);white-space:nowrap;text-underline-offset:.25em}
.social-device-controls{display:flex;align-items:center;justify-content:center;gap:1.5rem;padding:.65rem .5rem .25rem}
.social-device-controls button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--case-line);background:var(--case-paper);color:var(--case-accent);font:inherit;font-size:1.5rem;border-radius:50%;cursor:pointer}
.social-device-controls button:hover:not([aria-disabled=true]){background:#deddd3}
.social-device-controls button[aria-disabled=true]{opacity:.35;cursor:default}
.social-device-controls [data-social-status]{min-width:4rem;text-align:center;font-size:.875rem;font-variant-numeric:tabular-nums;color:var(--case-accent)}
.social-reader :focus-visible{outline:2px solid var(--case-accent);outline-offset:4px}
.social-index{padding-top:1rem;min-width:0}
.social-index>p{font-size:1.125rem;font-family:Georgia,'Times New Roman',serif;font-style:italic;color:var(--case-accent);margin:0 0 1rem}
.social-index>p>span{font:400 .75rem 'DM Sans',Arial,sans-serif;margin-left:.4rem}
.social-index ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--case-line)}
.social-index a{display:grid;grid-template-columns:1.5rem minmax(0,1fr) auto;align-items:baseline;gap:.75rem;min-height:44px;padding:.75rem .2rem;border-bottom:1px solid var(--case-line);font-size:.8125rem;line-height:1.4;text-decoration:none}
.social-index-number{color:var(--case-accent);font-variant-numeric:tabular-nums}
.social-index time{font-size:.75rem;color:var(--case-muted);font-variant-numeric:tabular-nums}
.social-index a[aria-current=true]{color:var(--case-accent);border-bottom-color:var(--case-accent)}
.social-index a:hover{background:#e9e8df}
.social-index a[aria-current=true]>span:nth-child(2){text-decoration:underline;text-underline-offset:.3em}
.social-notes{scroll-margin-top:6rem}
.social-notes .case-process{margin-bottom:0}
@media(min-width:1101px){.social-reader[data-enhanced=true]{grid-template-columns:minmax(0,1fr) minmax(0,min(25rem,41svh)) minmax(0,1fr)}}
@media(max-width:1100px){
 .social-reader{grid-template-columns:minmax(0,1fr) minmax(0,24rem);gap:2rem}
 .social-intro{grid-column:1;padding-top:1.5rem}
 .social-device{grid-column:2;grid-row:1/3}
 .social-index{grid-column:1;padding-top:0}
 .social-intro h2{font-size:clamp(2.5rem,5vw,3.5rem);margin-bottom:1.25rem}
 .social-format{margin-bottom:1rem}
 .social-instruction{margin-bottom:.25rem}
 .social-reader{--social-height:clamp(400px,65svh,620px)}
}
@media(max-width:700px){
 .art-case[data-case=kia] .case-heading{grid-template-columns:1fr;gap:1rem;margin:1.5rem 0 .5rem}
 .art-case[data-case=kia] .case-heading h1{font-size:clamp(2rem,8vw,3rem)}
 .art-case[data-case=kia] .case-introduction{justify-self:start}
 .social-reader{display:flex;flex-direction:column;align-items:stretch;gap:1.5rem;padding:.75rem 0 2rem}
 .social-intro{padding:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem 1rem;align-items:baseline}
 .social-kicker{grid-column:1/-1;margin:0;font-size:.75rem}
 .social-intro h2{font-size:clamp(2rem,8vw,2.9rem);margin:.5rem 0}
 .social-format{text-align:right;margin:0;font-size:.75rem}
 .social-instruction{grid-column:1/-1;max-width:28rem;margin:0}
 .social-skip{grid-column:1/-1;justify-self:start}
 .social-device{align-self:center}
 .social-reader[data-enhanced=true] .social-device{border-radius:1.5rem}
 .social-reader{--social-height:clamp(370px,65svh,620px)}
 .social-index{padding-top:.75rem}
 .social-index a{font-size:.875rem}
 .social-slide figcaption{font-size:.75rem}
}
@media(prefers-reduced-motion:reduce){.social-viewport{scroll-behavior:auto}}
