/* Mesma composicao na loja e no editor. Celular primeiro, sem recortar a imagem. */
.rb-banner-host{container-type:inline-size;container-name:rbhero;min-width:0}
.rb-banner{position:relative;display:flex;flex-direction:column;isolation:isolate;overflow:hidden;background:#10121a;color:#fff;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}
.rb-banner *{box-sizing:border-box;min-width:0}
.rb-banner-media{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#f7f7f8}
.rb-banner .hero-free-layer{position:relative;inset:auto;display:flex;flex-direction:column;gap:16px;padding:24px 22px 12px}
.rb-banner .hero-free-layer:empty{display:none}
.rb-banner .hero-el{position:relative;left:auto;top:auto;width:100%;height:auto;margin:0;padding:0;color:var(--el-color,#fff);font-family:var(--el-font,Arial,sans-serif);font-weight:var(--el-weight,700);font-size:clamp(15px,var(--el-size,17px),20px);line-height:1.5;opacity:var(--el-opacity,1);white-space:pre-wrap;overflow-wrap:break-word;text-shadow:none;z-index:1}
.rb-banner .hero-el-title{font-size:clamp(26px,calc(var(--el-size,52px) * .65),38px);line-height:1.12;letter-spacing:-.025em}
.rb-banner .hero-el{max-width:100%}
.rb-banner .hero-el-badge{width:fit-content;max-width:100%;font-size:11px;line-height:1.45;background:var(--el-bg,rgba(236,0,140,.25));border:1px solid #ffffff38;border-radius:999px;padding:7px 12px;text-transform:uppercase;letter-spacing:.06em}
.rb-banner .hero-el[class*=hero-el-shape_]{display:none}
.rb-banner-actions{display:flex;flex-wrap:wrap;gap:10px;padding:12px 22px 26px;position:relative;z-index:2}
.rb-banner-actions a,.rb-banner-actions span{display:flex;align-items:center;justify-content:center;min-height:46px;flex:1 1 140px;max-width:100%;padding:11px 16px;border:1px solid #ffffff70;border-radius:12px;color:#fff;text-decoration:none;font:600 14px/1.35 Arial,Helvetica,sans-serif;text-align:center;overflow-wrap:anywhere}
.rb-banner-actions :first-child{background:#ec008c;border-color:#ec008c}
.rb-banner-actions :not(:first-child){background:transparent;box-shadow:none}
.rb-banner-actions a,.rb-banner-actions span{box-shadow:none}
.rb-banner-actions a:focus-visible{outline:3px solid #68def1;outline-offset:3px}
@container rbhero (min-width:601px){
 .rb-banner{aspect-ratio:16/9;display:block;background:#111827}
 .rb-banner-media{position:absolute;inset:0;height:100%;aspect-ratio:auto;object-fit:cover;background:#111827}
 .rb-banner::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.08))}
 .rb-banner .hero-free-layer{position:absolute;inset:0;display:block;padding:0;z-index:1}
 .rb-banner .hero-el{position:absolute;left:var(--x);top:var(--y);width:var(--w);font-size:var(--el-size);line-height:1.12;white-space:pre-wrap;overflow-wrap:break-word}
 .rb-banner .hero-el-title{line-height:1.04;letter-spacing:normal}
 .rb-banner .hero-el-text{line-height:1.5}
 .rb-banner .hero-el-badge{width:auto;max-width:var(--w);font-size:var(--el-size);padding:9px 14px;line-height:1.12}
 .rb-banner .hero-el[class*=hero-el-shape_]{display:block;height:var(--h);background:var(--el-bg);border-radius:var(--el-radius);padding:0;color:transparent;z-index:0}
 .rb-banner .hero-el.hero-el-shape_circle{border-radius:999px}
 .rb-banner .hero-el.hero-el-shape_line{height:max(2px,var(--h))}
 .rb-banner-actions{position:absolute;left:4%;right:4%;bottom:6%;padding:0}
 .rb-banner-actions a,.rb-banner-actions span{flex:0 1 auto;min-width:140px}
}
.store-hero-slider .store-hero-track{height:auto;min-height:0;max-height:none}
.store-hero-slider .hero-slide.rb-banner-host{display:none;position:relative;inset:auto;height:auto;min-height:0;max-height:none;padding:0;background:none;grid-template-columns:none}
.store-hero-slider .hero-slide.rb-banner-host.active{display:block}
.store-hero-slider .hero-nav{width:44px;height:44px;border-radius:12px;background:#09101b8c;font-size:30px;top:24%;}
.store-hero-slider .hero-dots{position:relative;left:auto;bottom:auto;transform:none;justify-content:center;gap:4px;padding:2px 12px;background:#10121a}
.store-hero-slider .hero-dots button{width:44px;height:44px;position:relative;background:transparent;border-radius:0}
.store-hero-slider .hero-dots button::after{content:"";position:absolute;left:17px;top:17px;width:10px;height:10px;border-radius:50%;background:#ffffff70}
.store-hero-slider .hero-dots button.active::after{background:#ec008c}
@media(prefers-reduced-motion:reduce){.store-hero-slider .hero-slide{transition:none}}