.motion-spotlight{position:relative;isolation:isolate;margin:40px 0 64px;border-radius:32px;overflow:hidden;background:#e8dafa;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr;min-height:530px;box-shadow:0 12px 48px #6750800a}
.motion-heading{padding:42px 16px 0 42px;z-index:1}
.motion-heading .eyebrow{font-size:.76rem;letter-spacing:.1em;margin:0 0 14px}
.motion-heading h2{font-size:clamp(2.25rem,4vw,3.5rem);line-height:1.07;margin:0;max-width:500px;letter-spacing:-.035em;overflow-wrap:anywhere}
.motion-stage{position:relative;grid-column:2;grid-row:1 / 3;align-self:center;aspect-ratio:9 / 10;line-height:0;overflow:hidden}
.motion-stage video{display:block;width:100%;height:100%;object-fit:cover;mask-image:linear-gradient(180deg,transparent,#000 12%,#000 84%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 84%,transparent)}
/* Fade the Scrub film into the section on all sides, including its poster.
   Keep the control outside the mask and the product centre fully opaque. */
.motion-scrub{box-shadow:none}
.motion-scrub .motion-stage video{
 mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 58%,rgba(0,0,0,.92) 70%,transparent 100%);
 -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 58%,rgba(0,0,0,.92) 70%,transparent 100%);
}
.motion-copy{padding:32px 42px 42px;align-self:end;z-index:1}
.motion-copy h3{font-size:1.4rem;line-height:1.25;margin:14px 0 8px;overflow-wrap:anywhere}
.motion-copy p{max-width:350px;margin:0 0 20px;font-size:1rem;line-height:1.5}
.motion-tag{display:inline-block;background:var(--lime,#dcff65);padding:9px 15px;border-radius:999px;font-size:.8rem;font-weight:650;line-height:1.25}
.motion-toggle{position:absolute;right:18px;bottom:18px;width:44px;height:44px;border-radius:50%;background:#ffffffdc;backdrop-filter:blur(8px);border:1px solid #fff;box-shadow:0 2px 12px #17152614;color:#191627;font-size:18px;line-height:1;cursor:pointer}
.motion-toggle:focus-visible{outline:3px solid #281a41;outline-offset:4px}
.motion-drawer{background:#eee4dd}
.motion-travel{background:#eee6f0}
@media(max-width:700px){
 .motion-spotlight{display:block;min-height:0;margin:32px 0 48px;border-radius:25px}
 .motion-heading{padding:26px 24px 0}
 .motion-heading .eyebrow{margin-bottom:10px;font-size:.69rem}
 .motion-heading h2{font-size:clamp(1.9rem,8.6vw,2.45rem);max-width:360px}
 .motion-stage{width:100%;aspect-ratio:9 / 10;margin:0}
 .motion-copy{padding:0 24px 28px;margin-top:-8px;position:relative;text-align:center}
 .motion-copy h3{font-size:1.2rem;margin-top:12px}
 .motion-copy p{font-size:.93rem;margin:8px auto 18px;max-width:300px}
 .motion-copy .btn{max-width:100%;font-size:.93rem;padding:13px 18px}
 .motion-toggle{right:15px;bottom:20px}
}
