/* Match the adjacent Home Offers copy-and-single-phone composition. */
.offers-working-case #perks-design{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,4vw,58px);align-items:center}
#perks-design>.feature-copy{max-width:none}
#perks-design>.perk-animation-art{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
#perks-design .perk-animation-art>.story-screen{grid-column:1/-1;width:calc((100% - 20px)/2);max-width:270px;justify-self:center}
#perks-design .perk-animation-art figcaption{margin:0 0 12px;color:#39474f}
#perks-design .perk-auto-screen{position:relative;overflow:hidden!important;aspect-ratio:9/19.5;background:white}
#perks-design .perk-auto-screen>.perk-layer{position:absolute;inset:0 auto auto 0;display:block;width:100%;height:auto;opacity:0;will-change:transform,opacity;border-radius:0;pointer-events:none}
#perks-design .perk-auto-screen>.is-active{opacity:1}
.perk-swipe{position:absolute;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%);opacity:0;pointer-events:none;z-index:2}
.perk-swipe-dot{position:absolute;inset:0;border-radius:50%;background:#579fa5}
.perk-swipe-halo{position:absolute;inset:-21px;border-radius:50%;background:radial-gradient(circle,#579fa5d9 0%,#579fa58c 32%,#579fa540 54%,transparent 75%);filter:blur(2px)}
.perk-animation-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px}.perk-animation-dots{display:flex;gap:4px}.perk-animation-dots button{width:32px;height:32px;padding:4px;border:0;border-radius:16px;display:grid;place-items:center;background:transparent;cursor:pointer}.perk-animation-dots span{display:block;width:7px;height:7px;border:1px solid #7a9198;border-radius:10px}.perk-animation-dots [aria-pressed=true] span{width:25px;background:#347d83;border-color:#347d83}.perk-animation-dots button:hover{background:#347d8310}.perk-animation-toggle{padding:4px 0;border:0;border-bottom:1px solid #7a919866;background:none;color:#586770;font:10px Arial;cursor:pointer}.perk-animation-controls button:focus-visible{outline:2px solid #347d83;outline-offset:3px}
@media(max-width:750px){.offers-working-case #perks-design{grid-template-columns:1fr;gap:26px}#perks-design>.perk-animation-art{grid-template-columns:1fr}#perks-design .perk-animation-art>.story-screen{width:100%}}
@media(prefers-reduced-motion:reduce){.perk-swipe{display:none}.perk-layer{will-change:auto!important}}