/* ==========================================================================
 * Skin "wc_ecommerce_brdigital" — HERO full-bleed da BR Impressão Digital.
 * Mecânica do carrossel em slide.base.css. Chamar FORA de .container.
 * Cores só das variáveis da paleta (primary = navy da marca, success = verde do CTA),
 * com o fallback da paleta padrão da BR. Sem pílula: o sobretítulo é texto com fio.
 * ========================================================================== */
.wcslide--br {
    --br-s-navy: var(--bs-primary-rgb, 30, 42, 90);
    --br-s-green: var(--bs-success, #188f42);
    --br-s-green-rgb: var(--bs-success-rgb, 24, 143, 66);
    --br-s-ink: 6, 10, 26;
    width: 100%;
    margin: 0;
    background: rgb(var(--br-s-ink));
    color: #fff;
    overflow: hidden;
}

/* ---- Palco ---- */
.wcslide--br .wcslide-media {
    height: clamp(440px, 60vh, 620px);
    background: rgb(var(--br-s-ink));
}
.wcslide--br .wcslide-media img {
    transform: scale(1.04);
    transition: transform 7s var(--wcs-ease);
}
.wcslide--br .wcslide-slide.is-active .wcslide-media img { transform: scale(1.1); }
/* Navy da marca por cima da foto, do lado do texto; a foto respira à direita. */
.wcslide--br .wcslide-shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(var(--br-s-navy), .94) 0%, rgba(var(--br-s-navy), .78) 28%, rgba(var(--br-s-navy), .28) 54%, rgba(var(--br-s-navy), 0) 74%),
        linear-gradient(90deg, rgba(var(--br-s-ink), .45) 0%, rgba(var(--br-s-ink), 0) 55%),
        linear-gradient(0deg, rgba(var(--br-s-ink), .45) 0%, rgba(var(--br-s-ink), 0) 34%);
}

/* ---- Legenda dentro do .container do tema ---- */
.wcslide--br .wcslide-caption {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
}
.wcslide--br .wcslide-caption > .container { width: 100%; }
.wcslide--br .wcslide-br-inner {
    max-width: 600px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.wcslide--br .wcslide-kicker {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin: 0 0 1rem;
    color: rgba(255, 255, 255, .8);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.wcslide--br .wcslide-kicker::before {
    content: "";
    flex: 0 0 28px;
    height: 2px;
    border-radius: 2px;
    background: var(--br-s-green);
}
.wcslide--br .wcslide-title {
    margin: 0 0 1rem;
    color: #fff;
    font-size: clamp(2rem, 1.15rem + 2.6vw, 3.4rem);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -.025em;
    text-wrap: balance;
    text-shadow: 0 4px 28px rgba(var(--br-s-ink), .35);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.wcslide--br .wcslide-desc {
    margin: 0 0 1.75rem;
    max-width: 34rem;
    color: rgba(255, 255, 255, .88);
    font-size: clamp(1rem, .92rem + .35vw, 1.15rem);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---- CTAs: orçamento (verde sólido) + link do slide (contorno) ---- */
.wcslide--br .wcslide-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .8rem;
}
.wc-shop .wcslide--br .wcslide-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    min-height: 54px;
    padding: 0 1.5rem;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform .18s var(--wcs-ease), box-shadow .18s var(--wcs-ease), background .18s var(--wcs-ease), color .18s var(--wcs-ease), border-color .18s var(--wcs-ease);
}
.wcslide--br .wcslide-cta .icon { font-size: 1.15rem; transition: transform .2s var(--wcs-ease); }
.wc-shop .wcslide--br .wcslide-cta:not(.wcslide-cta--ghost) {
    background: var(--br-s-green);
    color: #fff;
    box-shadow: 0 14px 30px rgba(var(--br-s-green-rgb), .38);
}
.wc-shop .wcslide--br .wcslide-cta:not(.wcslide-cta--ghost):hover {
    color: #fff;
    filter: brightness(1.07);
    transform: translateY(-2px);
    box-shadow: 0 18px 38px rgba(var(--br-s-green-rgb), .48);
}
.wc-shop .wcslide--br .wcslide-cta--ghost {
    background: transparent;
    color: #fff;
    border: 1.5px solid rgba(255, 255, 255, .6);
}
.wc-shop .wcslide--br .wcslide-cta--ghost:hover {
    background: #fff;
    border-color: #fff;
    color: rgb(var(--br-s-navy));
    transform: translateY(-2px);
}
.wcslide--br .wcslide-cta--ghost:hover .icon { transform: translateX(3px); }

/* ---- Revelação em cascata do slide ativo ---- */
.wcslide--br .wcslide-br-inner > * { opacity: 0; transform: translateY(18px); }
.wcslide--br .wcslide-slide.is-active .wcslide-br-inner > * {
    animation: wcslide-br-rise .65s cubic-bezier(.2, .7, .2, 1) forwards;
}
.wcslide--br .wcslide-slide.is-active .wcslide-br-inner > *:nth-child(1) { animation-delay: .12s; }
.wcslide--br .wcslide-slide.is-active .wcslide-br-inner > *:nth-child(2) { animation-delay: .22s; }
.wcslide--br .wcslide-slide.is-active .wcslide-br-inner > *:nth-child(3) { animation-delay: .32s; }
.wcslide--br .wcslide-slide.is-active .wcslide-br-inner > *:nth-child(4) { animation-delay: .42s; }
@keyframes wcslide-br-rise { to { opacity: 1; transform: none; } }

/* ---- Setas ---- */
.wcslide--br .wcslide-nav {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 1.5rem;
    border: 1px solid rgba(255, 255, 255, .28);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    transition: opacity .25s var(--wcs-ease), background .2s var(--wcs-ease), color .2s var(--wcs-ease);
}
.wcslide--br:hover .wcslide-nav,
.wcslide--br .wcslide-nav:focus-visible { opacity: 1; }
.wcslide--br .wcslide-nav:hover { background: #fff; color: rgb(var(--br-s-navy)); }
.wcslide--br .wcslide-prev { left: clamp(10px, 1.6vw, 24px); }
.wcslide--br .wcslide-next { right: clamp(10px, 1.6vw, 24px); }

/* ---- Dots em traço ---- */
.wcslide--br .wcslide-dots { bottom: clamp(1rem, 2.2vw, 1.6rem); gap: .55rem; }
.wcslide--br .wcslide-dot {
    width: 22px;
    height: 4px;
    border-radius: 4px;
    background: rgba(255, 255, 255, .4);
    transition: width .25s var(--wcs-ease), background .25s var(--wcs-ease);
}
.wcslide--br .wcslide-dot:hover { background: rgba(255, 255, 255, .75); }
.wcslide--br .wcslide-dot.is-active { width: 40px; background: #fff; }

/* ---- Barra de progresso do autoplay ---- */
.wcslide--br .wcslide-progress {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    height: 3px;
    background: rgba(255, 255, 255, .12);
}
.wcslide--br .wcslide-progress > span {
    display: block;
    height: 100%;
    width: 100%;
    transform-origin: left center;
    transform: scaleX(0);
    background: var(--br-s-green);
}
/* nome fixo: o slide.wc.js aplica "wcslide-progress <intervalo>ms linear" na barra */
@keyframes wcslide-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---- Tablet ---- */
@media (max-width: 1024px) {
    .wcslide--br .wcslide-media { height: clamp(400px, 54vh, 520px); }
    .wcslide--br .wcslide-br-inner { max-width: 520px; }
}

/* ---- Celular: retrato, texto embaixo sobre o navy ---- */
@media (max-width: 640px) {
    .wcslide--br .wcslide-media { height: min(142vw, 620px); }
    .wcslide--br .wcslide-shade {
        background:
            linear-gradient(0deg, rgba(var(--br-s-navy), .97) 6%, rgba(var(--br-s-navy), .8) 34%, rgba(var(--br-s-navy), .2) 62%, rgba(var(--br-s-navy), 0) 78%),
            linear-gradient(0deg, rgba(var(--br-s-ink), .35) 0%, rgba(var(--br-s-ink), 0) 50%);
    }
    .wcslide--br .wcslide-caption { align-items: flex-end; padding-bottom: 2.6rem; }
    .wcslide--br .wcslide-kicker { margin-bottom: .7rem; }
    .wcslide--br .wcslide-title { font-size: clamp(1.75rem, 1.2rem + 3vw, 2.2rem); margin-bottom: .7rem; }
    .wcslide--br .wcslide-desc { font-size: .98rem; margin-bottom: 1.25rem; -webkit-line-clamp: 3; }
    .wcslide--br .wcslide-actions { width: 100%; gap: .55rem; }
    /* lado a lado quando cabem; senão cada um ocupa a linha toda */
    .wc-shop .wcslide--br .wcslide-cta { flex: 1 1 auto; min-height: 50px; padding: 0 1rem; font-size: .95rem; }
    .wcslide--br .wcslide-nav { display: none; }
    .wcslide--br .wcslide-dots { bottom: .9rem; }
}

/* ---- Reduz movimento: sem ken burns nem cascata ---- */
@media (prefers-reduced-motion: reduce) {
    .wcslide--br .wcslide-media img,
    .wcslide--br .wcslide-slide.is-active .wcslide-media img { transition: none; transform: none; }
    .wcslide--br .wcslide-br-inner > *,
    .wcslide--br .wcslide-slide.is-active .wcslide-br-inner > * { opacity: 1; transform: none; animation: none; }
    .wcslide--br .wcslide-progress { display: none; }
}