/* Unified cinematic case-study cards. */
.story-card.story-card{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;grid-row:auto;padding:0;background:#262a2d;color:#f7f4ee;border:1px solid #262a2d;overflow:hidden;align-self:stretch;min-width:0;transition:box-shadow .25s}
.story-card[hidden]{display:none!important}
.story-card.story-card:hover{box-shadow:0 12px 30px #0002}
.story-card .story-photo{position:relative;isolation:isolate;aspect-ratio:1.15;width:100%;overflow:hidden;border-radius:0;flex:none;background:#262a2d}
.story-card .story-photo>img{width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .7s ease}
.story-card:hover .story-photo>img{transform:scale(1.045)}
.story-card .story-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0003,transparent 24%,#0008 60%,#000e);z-index:0;pointer-events:none}
.story-card .story-photo .story-caption{position:absolute;z-index:1;left:22px;right:22px;bottom:23px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;color:#f7f4ee;text-align:left}
.story-card .story-caption .story-kicker{font-size:8px;line-height:1.4;text-transform:uppercase;letter-spacing:1.5px;color:#f7f4eeb3}
.story-card .story-photo .story-caption h3{font-size:clamp(23px,2vw,34px);font-weight:700;letter-spacing:-.04em;line-height:1.1;text-transform:uppercase;margin:0;padding:0;max-width:100%;color:#f7f4ee}
.story-card .story-caption p{font-size:12px;line-height:1.5;margin:0;color:#f7f4eedb;max-width:440px}
.story-card .story-link{font-size:10px;display:flex;gap:18px;align-items:center;border-bottom:1px solid #f7f4ee70;padding-bottom:5px;margin-top:3px;color:#f7f4ee}
.story-card .story-photo .label,.story-card .story-photo .portfolio-client{top:18px;left:20px;bottom:auto;right:auto;z-index:2;background:#262a2dcc;border:1px solid #f7f4ee55;border-radius:0;font-size:8px;line-height:1.4;letter-spacing:1.3px;text-transform:uppercase;padding:7px 10px;color:#f7f4ee;max-width:calc(100% - 90px)}
.story-card .story-photo .arrow,.story-card .story-photo .portfolio-arrow{position:absolute;top:16px;right:18px;bottom:auto;left:auto;width:40px;height:40px;border-radius:50%;font-size:25px;background:#f7f4ee;color:#262a2d;display:grid;place-items:center;z-index:2;transition:transform .25s}
.story-card:hover .story-photo .arrow,.story-card:hover .story-photo .portfolio-arrow{transform:rotate(45deg)}
.story-card .story-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;align-items:start;align-content:center;min-height:122px;width:100%;padding:23px 20px;margin:0;border-top:1px solid #f7f4ee28;color:#f7f4ee;flex:1;background:#262a2d}
.story-card .story-results>div{min-width:0;padding:0 12px;border-left:1px solid #f7f4ee30}
.story-card .story-results>div:first-child{padding-left:0;border:0}
.story-card .story-results>div:last-child{padding-right:0}
.story-card .story-results strong{display:block;color:#f7f4ee;font-size:clamp(23px,2.1vw,34px);font-weight:600;letter-spacing:-.04em;line-height:1.15;font-variant-numeric:tabular-nums;white-space:nowrap}
.story-card .story-results span{display:block;color:#f7f4eeb3;font-size:9px;line-height:1.5;margin-top:8px}
.story-card .story-delivery strong{font-size:14px;white-space:normal;line-height:1.35;letter-spacing:0}
.story-card .story-results:has(>div:only-child){grid-template-columns:1fr}
.story-card .story-results:has(>div:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.portfolio-featured,.portfolio-supporting,.portfolio-all{align-items:stretch;row-gap:28px}
.portfolio-featured .story-photo{aspect-ratio:1.45}
.portfolio-featured .story-caption h3{font-size:clamp(28px,2.7vw,46px)!important}
.portfolio-card .story-results{border-top:2px solid var(--orange,#ed6b32)}
.portfolio-card .story-link{border-color:var(--orange,#ed6b32)}
.portfolio-card .story-photo.cpl-brand-photo>img{height:56%;width:100%;padding:24px;object-fit:contain;object-position:center}
.portfolio-card .story-photo.cpl-brand-photo:after{background:linear-gradient(transparent 35%,#262a2d 65%)}
@media(max-width:1100px) and (min-width:601px){.story-card .story-photo{aspect-ratio:.95}.story-card .story-photo .story-caption{left:18px;right:18px}.story-card .story-results{padding:20px 16px}.story-card .story-results>div{padding:0 8px}}
@media(max-width:600px){.supporting-grid{grid-template-columns:1fr}.story-card .story-photo{aspect-ratio:1.15}.story-card .story-photo .story-caption h3{font-size:28px}.story-card .story-results strong{font-size:28px}.story-card .story-delivery strong{font-size:14px}.portfolio-featured .story-photo{aspect-ratio:1.15}}
@media(prefers-reduced-motion:reduce){.story-card,.story-card *{transition:none!important}.story-card:hover .story-photo>img,.story-card:hover .arrow,.story-card:hover .portfolio-arrow{transform:none}}
