.hero-case-feature{background:#fff}.hero-case-link{display:block;border-radius:inherit;overflow:hidden}.hero-case-stage{height:19rem;position:relative;overflow:hidden}.hero-case-slide{position:absolute;inset:0;display:flex;flex-direction:column;background:#fff;opacity:1;transition:opacity .2s ease,transform .2s ease}.hero-case-slide.is-entering{opacity:0;transform:translateY(7px)}.hero-case-slide.is-leaving{opacity:0;transform:translateY(-7px)}.hero-case-art{height:10rem;flex:none;display:flex;align-items:flex-end;padding:20px;background:#d4e7f3;overflow:hidden}.hero-case-art[data-color="1"]{background:#c4aaea}.hero-case-art[data-color="2"]{background:#e5dcef}.hero-case-art:has(img){padding:0}.hero-case-art img{display:block;width:100%;height:100%;object-fit:cover}.hero-case-art>span{font-size:1.6rem;font-weight:700;line-height:1.25;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.hero-case-body{padding:15px 16px 12px;display:flex;flex-direction:column;gap:10px;min-height:0}.hero-case-meta{font-size:.75rem;line-height:1.5;color:#666;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.hero-case-body h3{font-size:1rem;line-height:1.45;font-weight:600;margin:0;letter-spacing:-.02em;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}.hero-case-footer{display:block;border-top:1px solid #e5e5e8;padding:13px 48px 13px 16px;font-size:.8rem;line-height:1.5;white-space:nowrap}.hero-case-toggle{position:absolute;right:4px;bottom:2px;width:44px;height:44px;border:0;background:transparent;color:#161616;border-radius:10px;cursor:pointer;font-family:inherit;font-size:18px;display:flex;align-items:center;justify-content:center}.hero-case-toggle[hidden]{display:none}.hero-case-toggle:hover{background:#e9e3f4}.hero-case-toggle:focus-visible{outline:2px solid #7040bb;outline-offset:-4px}.hero-case-link:focus-visible{outline:3px solid #7040bb;outline-offset:-4px}.hero-case-link:hover .hero-case-footer{text-decoration:underline;text-underline-offset:4px}
@media(max-width:650px){.hero-case-feature{width:220px;left:calc(50% - 110px)}.hero-stage:has(.hero-case-feature){padding-top:385px}.hero-case-stage{height:18.75rem}.hero-case-art{height:9.5rem}.hero-case-footer{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.hero-case-feature,.hero-case-slide{transition:none}.hero-case-feature:hover{transform:rotate(-8deg)}}
.hero-case-art img.hero-case-logo{object-fit:contain;padding:22px}.hero-case-art img.logo-dark{background:#1c1c1f}.hero-case-art img.logo-light{background:#fff}

/* Keep the proposition and action ahead of the case on a phone. */
@media(max-width:650px){
  .hero-stage:has(.hero-case-feature){min-height:0;padding-top:0;gap:24px}
  .hero-case-feature{position:relative;left:auto;top:auto;align-self:center;margin:8px 0 12px;width:min(240px,80%);transform:rotate(-4deg)}
  .hero-case-feature:hover{transform:rotate(-4deg)}
  .hero-case-stage{height:18.75rem}
}
@media(prefers-reduced-motion:reduce){.hero-case-feature,.hero-case-feature:hover{transform:none}}

/* Center the card inside the left grid cell, with room for the service links. */
@media(min-width:651px){
  .hero-case-feature{left:25%;top:48px;width:clamp(200px,18vw,240px);margin-left:clamp(-120px,-9vw,-100px)}
  .hero-topics{flex-direction:row;flex-wrap:wrap;gap:8px;max-width:100%;padding-right:24px;padding-bottom:18px}
  .hero-topics a{min-width:0;padding:10px 16px}
  .hero-stage:has(.hero-case-feature){min-height:540px}
}
.hero-case-art{position:relative;align-items:center;justify-content:center}
.hero-case-art .hero-case-cover{position:absolute;inset:0;height:100%;object-fit:cover}
.hero-case-art .hero-brand-logo{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.hero-brand-logo img{width:100%;height:100%;object-fit:contain}
.hero-case-art .hero-brand-name{position:relative;padding:10px 14px;border-radius:9px;background:#ffffffed;color:#161616;font-size:1.2rem;text-align:center}