/* Three short, independent previews within the existing case-study system. */
html #projects-inner .teaser-case{display:block!important;width:100%;padding-block:32px 0;background:transparent;color:var(--ink)}
html #projects-inner .teaser-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(28px,4.5vw,64px);align-items:center}
html #projects-inner .teaser-art{min-width:0;margin:0;direction:ltr}
html #projects-inner .teaser-art .production-visual{position:relative;width:100%;height:auto;aspect-ratio:16/10;max-height:none;margin:0}
html #projects-inner .teaser-copy{min-width:0;text-align:start}
html #projects-inner .teaser-copy .teaser-eyebrow{margin:0 0 18px;color:var(--muted);font:400 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
html #projects-inner .teaser-copy h4{margin:0 0 20px;color:var(--ink);font:500 clamp(28px,3vw,42px)/1.12 var(--sans);letter-spacing:-.035em;text-wrap:balance}
html #projects-inner .teaser-copy .teaser-intro{max-inline-size:43ch;margin:0;color:var(--ink);font:400 17px/1.65 var(--sans);text-wrap:pretty}
html #projects-inner .teaser-scope{margin:28px 0 0;padding-block-start:18px;border-block-start:1px solid var(--line,#dadbd5)}
html #projects-inner .teaser-scope dt{margin:0 0 8px;color:var(--muted);font:400 11px/1.5 var(--mono)}
html #projects-inner .teaser-scope dd{margin:0;color:var(--ink);font:400 14px/1.65 var(--sans)}
html #projects-inner .teaser-image-toggle{display:inline-flex;align-items:center;gap:12px;min-height:44px;padding:8px 0;border:0;background:none;color:var(--ink);font:400 12px/1.5 var(--sans);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
html #projects-inner .teaser-image-toggle::after{content:'↔';text-decoration:none}
html #projects-inner .teaser-image-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
html #projects-inner details.project--teaser>summary .wl-case-stage{--case-stage-fill:30%}
html #work .teaser-preview{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;direction:ltr;pointer-events:none}
html #work .teaser-preview .production-visual{position:relative;width:100%;height:100%;margin:0;aspect-ratio:auto}
html #work .teaser-preview .production-visual img{width:100%;height:100%}
html #work .teaser-preview .galed-cover{object-fit:contain}
html #work .teaser-preview .gideon-cover{object-fit:cover}
html #work .teaser-preview .pushback-author{object-fit:cover}
html[dir=rtl] #projects-inner .teaser-copy h4{letter-spacing:normal}
html .motion-paused .teaser-art *,html .motion-paused .teaser-preview *{transition:none!important;animation:none!important}
@media(max-width:760px){html #projects-inner .teaser-layout{grid-template-columns:1fr;gap:24px}html #projects-inner .teaser-case{padding-block-start:24px}html #projects-inner .teaser-copy h4{font-size:30px;max-inline-size:23ch}html #projects-inner .teaser-copy .teaser-intro{font-size:16px;max-inline-size:52ch}html #projects-inner .teaser-scope{margin-top:22px}html #projects-inner .teaser-copy .teaser-eyebrow{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){html .teaser-art *,html .teaser-preview *{transition:none!important;animation:none!important}}