/* Keep every control outside the photo: clear faces and full products. */
.brand-hero.hero-carousel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0;aspect-ratio:auto;background:#fff;border:1px solid #dfe3eb;border-radius:20px;box-shadow:0 16px 44px #21233a0c;overflow:hidden}
.hero-carousel .hero-carousel-stage{position:relative;inset:auto;grid-column:1/-1;grid-row:1;aspect-ratio:1;width:100%;background:#f5f5f6;overflow:hidden}
.hero-carousel .hero-carousel-slide{object-fit:contain;transform:none;transition:opacity .48s ease}
.hero-carousel .hero-carousel-actions{position:static;transform:none;grid-column:2;grid-row:2;align-self:center;justify-self:end;margin:10px 12px 0 4px}
.hero-carousel .hero-carousel-toggle{width:40px;height:40px;flex-shrink:0}
.hero-carousel .hero-carousel-toggle{background:#21233a;color:#fff;box-shadow:0 3px 8px #21233a22}
.hero-carousel .hero-carousel-dots{position:static;transform:none;grid-column:1;grid-row:2;align-self:center;justify-self:start;display:flex;flex-wrap:wrap;gap:0;margin:10px 0 0 12px;padding:0;max-width:288px;background:none;box-shadow:none;border-radius:0}
.hero-carousel .hero-carousel-dots button{position:relative;flex:0 0 24px;width:24px;height:24px;border:0;border-radius:6px;background:transparent}
.hero-carousel .hero-carousel-dots button::after{content:'';position:absolute;inset:8px;border-radius:50%;background:#aeb1bb;transition:background .2s ease,transform .2s ease}
.hero-carousel .hero-carousel-dots button[aria-selected=true]{width:24px;background:transparent}
.hero-carousel .hero-carousel-dots button[aria-selected=true]::after{background:var(--vv-navy);transform:scale(1.2)}
.brand-hero.hero-carousel figcaption{position:static;grid-column:1/-1;grid-row:3;margin:0;padding:16px 18px 20px;gap:12px;background:#fff;border-radius:0;font-size:14px;line-height:1.5}
.brand-hero.hero-carousel figcaption b{font-size:19px;line-height:1.3}
.brand-hero.hero-carousel figcaption a{flex:0 0 44px;display:grid;place-items:center;background:#f7f8fa}
@media(max-width:420px){.hero-carousel .hero-carousel-dots{max-width:144px;margin-left:8px}.hero-carousel .hero-carousel-actions{margin-right:8px}.hero-carousel .hero-carousel-toggle{width:36px;height:40px}.brand-hero.hero-carousel figcaption{padding:14px;font-size:13px}}
@media(prefers-reduced-motion:reduce){.hero-carousel .hero-carousel-slide{transition:none}}