body[data-category="ai"] .case-layout{grid-template-columns:60% 40%;padding:40px 4%;gap:0}
body[data-category="ai"] .case-info{align-self:center;height:auto;max-height:100%;padding:20px 0 30px;overflow-y:auto}
body[data-category="ai"] .case-kicker{font-size:40px;text-align:right;max-width:365px;margin:auto}
body[data-category="ai"] .case-info h1{font-size:28px}
body[data-category="ai"] .case-description{max-width:440px;font-size:17px}
body[data-category="ai"] .case-year{margin-bottom:42px}
.model-choices{height:100%;min-height:0;display:flex;flex-direction:column;gap:20px;align-items:center}
.model-choice{padding:0;border:0;background:#eee;border-radius:30px;overflow:hidden;cursor:pointer;min-height:0;height:calc(50% - 10px);aspect-ratio: .65;max-width:100%;flex-shrink:1}
.model-choice video{width:100%;height:100%;object-fit:cover;display:block;transition:filter .4s}
.model-choice[aria-pressed="false"].inactive video{filter:grayscale(1)}
.model-choice:focus-visible{outline:3px solid #F47A93;outline-offset:4px}
.ai-presentation{grid-column:1;grid-row:1;height:100%;padding-right:20px;scrollbar-width:none}
.ai-presentation[hidden]{display:none}
.model-choices{grid-column:2;grid-row:1}
@media(max-width:700px){body[data-category="ai"] .case-layout{display:grid;grid-template-columns:60% 40%;height:calc(100dvh - 140px);min-height:500px;padding:25px 4%}body[data-category="ai"] .case-info h1{font-size:22px}body[data-category="ai"] .case-kicker{font-size:30px}body[data-category="ai"] .case-description{font-size:13px}body[data-category="ai"] .case-year{font-size:17px;margin-bottom:25px}body[data-category="ai"] .explore-block h2{font-size:17px}.model-choice{border-radius:22px}.ai-presentation{overflow-y:auto}.model-choices{gap:15px}}
/* Align the two model videos with the centre of the information column. */
body[data-category="ai"] .case-layout{grid-template-columns:46% 54%}
.model-choices{align-self:center;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center;position:relative;padding-left:15px}
.model-prompt{grid-column:1/-1;text-align:center;font-size:32px;line-height:1.2;margin:0 0 2px}
.model-prompt span{font-family:'Clarity City',sans-serif;margin-left:12px}
.model-choice{width:100%;height:auto;aspect-ratio:.65;max-height: min(54dvh,520px);justify-self:center}
@media(max-width:700px){body[data-category="ai"] .case-layout{grid-template-columns:46% 54%}.model-choices{gap:10px;padding-left:10px}.model-prompt{font-size:23px}.model-prompt span{margin-left:4px}.model-choice{border-radius:18px;max-height:45dvh}body[data-category="ai"] .case-info{padding-right:8px}}
/* Portrait cards match the supplied reference without cropping the video. */
.model-choice{width:min(100%,29.25dvh,292.5px);height:auto;aspect-ratio:9 / 16;max-height:none;border-radius:38px;background:#eee}
.model-choice video{object-fit:contain}
@media(max-width:700px){.model-choice{width:100%;aspect-ratio:9 / 16;max-height:none;border-radius:18px}}

@media(hover:hover) and (pointer:fine){
.model-choice{transition:transform .35s ease;transform-origin:center}
.model-choice:hover{transform:scale(1.035);z-index:1}
.model-choices:has(.model-choice:hover) .model-choice:not(:hover) video{filter:grayscale(1)}
.model-choices .model-choice:hover video{filter:grayscale(0)}
}
@media(prefers-reduced-motion:reduce){.model-choice{transition:none}.model-choice:hover{transform:none}}

/* Zoom only the second model footage; keep the card geometry unchanged. */
.model-choice[data-model="second"] video{transform:scale(1.17) translateY(-4%);transform-origin:center center}