/* ===========================================================================
   DC Brand Showcase — dc-trust-bar
   =========================================================================== */

.dc-brs,
.dc-brs *,
.dc-brs *::before,
.dc-brs *::after{
    font-family:'DM Sans','Poppins',system-ui,sans-serif;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    box-sizing:border-box;
}

.dc-brs{
    --brs-primary:#a0c040;
    --brs-dark:#2b2926;
    --brs-bg:#ffffff;
    --brs-muted:#7a726a;
    --brs-surface:#faf7f4;
    --brs-soft:#f6f3ef;
    --brs-border:rgba(43,41,38,0.08);
    --brs-border-strong:rgba(43,41,38,0.14);
}

/* ═════════ SECTION ═════════ */
.dc-brs{
    background:var(--brs-bg);
    padding:110px 0;
    position:relative;
    overflow:hidden;
}
.dc-brs .dc-brs__container{
    max-width:1400px;
    margin:0 auto;
    padding:0 40px;
}
.dc-brs .dc-brs__layout{
    display:grid;
    grid-template-columns:1fr 1.15fr;
    gap:72px;
    align-items:center;
    min-height:720px;
}

/* ═════════ LEFT — CONTENT ═════════ */
.dc-brs .dc-brs__content{
    position:relative;
    z-index:2;
    opacity:0;
    transform:translateX(-24px);
    transition:opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1);
}
.dc-brs.is-in .dc-brs__content{
    opacity:1;
    transform:translateX(0);
}

/* Eyebrow with flooring icon */
.dc-brs .dc-brs__eyebrow{
    display:inline-flex;
    align-items:center;
    gap:12px;
    margin-bottom:24px;
    color:var(--brs-dark);
}
.dc-brs .dc-brs__eyebrow-icon{
    display:inline-flex;
    width:28px;
    height:28px;
    color:var(--brs-primary);
    flex-shrink:0;
}
.dc-brs .dc-brs__eyebrow-icon svg{
    width:100%;
    height:100%;
    stroke:currentColor;
    fill:none;
    stroke-width:1.5;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank{
    opacity:0;
    transform:translateY(4px);
    transform-box:fill-box;
    transition:opacity .45s ease, transform .5s cubic-bezier(.22,1,.36,1);
}
.dc-brs.is-in .dc-brs__eyebrow-icon svg .fp-plank{
    opacity:1;
    transform:translateY(0);
}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank:nth-of-type(1){transition-delay:.28s;}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank:nth-of-type(2){transition-delay:.34s;}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank:nth-of-type(3){transition-delay:.40s;}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank:nth-of-type(4){transition-delay:.46s;}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank:nth-of-type(5){transition-delay:.52s;}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank:nth-of-type(6){transition-delay:.58s;}
.dc-brs .dc-brs__eyebrow-icon svg .fp-plank:nth-of-type(7){transition-delay:.64s;}
.dc-brs .dc-brs__eyebrow-text{
    font-size:11px;
    font-weight:800;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--brs-dark);
}

.dc-brs .dc-brs__title{
    margin:0 0 22px;
    font-size:clamp(34px, 4vw, 56px);
    font-weight:800;
    line-height:1.08;
    letter-spacing:-1px;
    color:var(--brs-dark);
}
.dc-brs .dc-brs__title strong{
    color:var(--brs-primary);
    font-weight:800;
}
.dc-brs .dc-brs__desc{
    margin:0 0 36px;
    font-size:17px;
    line-height:1.7;
    color:var(--brs-muted);
    max-width:520px;
}

/* Stat block */
.dc-brs .dc-brs__stat{
    display:inline-flex;
    align-items:center;
    gap:16px;
    padding:18px 24px;
    background:var(--brs-surface);
    border:1px solid var(--brs-border);
    border-radius:12px;
    margin-bottom:32px;
    position:relative;
    overflow:hidden;
}
.dc-brs .dc-brs__stat::before{
    content:'';
    position:absolute;
    top:0; bottom:0;
    left:0;
    width:3px;
    background:var(--brs-primary);
}
.dc-brs .dc-brs__stat-num{
    font-size:40px;
    font-weight:800;
    line-height:1;
    color:var(--brs-primary);
    letter-spacing:-1.5px;
    padding-left:8px;
}
.dc-brs .dc-brs__stat-label{
    font-size:12px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--brs-dark);
    line-height:1.4;
    max-width:140px;
}

/* CTA */
.dc-brs .dc-brs__cta{
    display:inline-flex;
    align-items:center;
    gap:14px;
    padding:17px 32px;
    background:var(--brs-dark);
    color:#fff;
    text-decoration:none;
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    border-radius:100px;
    transition:all .4s cubic-bezier(.2,.8,.2,1);
    position:relative;
    overflow:hidden;
}
.dc-brs .dc-brs__cta::before{
    content:'';
    position:absolute;
    inset:0;
    background:var(--brs-primary);
    transform:translateX(-100%);
    transition:transform .45s cubic-bezier(.2,.8,.2,1);
    z-index:0;
}
.dc-brs .dc-brs__cta:hover::before{transform:translateX(0);}
.dc-brs .dc-brs__cta-text,
.dc-brs .dc-brs__cta-icon{
    position:relative;
    z-index:1;
}
.dc-brs .dc-brs__cta-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    transition:transform .4s cubic-bezier(.2,.8,.2,1), background .3s;
}
.dc-brs .dc-brs__cta:hover .dc-brs__cta-icon{
    transform:translateX(4px);
    background:rgba(255,255,255,.22);
}

/* ═════════ RIGHT — VISUAL (overlapping panels) ═════════ */
.dc-brs .dc-brs__visual{
    position:relative;
    width:100%;
    height:680px;
    opacity:0;
    transform:translateX(24px);
    transition:opacity 1s cubic-bezier(.22,1,.36,1) .2s, transform 1s cubic-bezier(.22,1,.36,1) .2s;
}
.dc-brs.is-in .dc-brs__visual{
    opacity:1;
    transform:translateX(0);
}

/* Decorative ambient glow */
.dc-brs .dc-brs__visual::before{
    content:'';
    position:absolute;
    top:40%;
    left:50%;
    width:520px;
    height:520px;
    transform:translate(-50%,-50%);
    background:radial-gradient(circle, rgba(160,192,64,.09), transparent 65%);
    pointer-events:none;
    z-index:0;
}

/* Panel card */
.dc-brs .dc-brs__panel{
    position:absolute;
    background:#fff;
    border:1px solid var(--brs-border);
    border-radius:14px;
    padding:18px;
    box-shadow:
        0 24px 60px -20px rgba(43,41,38,.22),
        0 10px 24px -12px rgba(43,41,38,.14);
    transform:rotate(var(--brs-rot, 0deg)) translateY(20px);
    opacity:0;
    animation:_dcBrsPanelIn .9s cubic-bezier(.2,.8,.2,1) forwards;
    transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease;
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    background:rgba(255,255,255,.96);
}
.dc-brs .dc-brs__panel:hover{
    transform:rotate(0deg) translateY(-6px);
    box-shadow:
        0 32px 70px -18px rgba(43,41,38,.28),
        0 14px 30px -10px rgba(160,192,64,.18);
    z-index:20 !important;
}
@keyframes _dcBrsPanelIn{
    0%   { opacity:0; transform:rotate(0deg) translateY(40px) scale(.92); }
    100% { opacity:1; transform:rotate(var(--brs-rot, 0deg)) translateY(0) scale(1); }
}
/* Top-left pink corner accent */
.dc-brs .dc-brs__panel::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:40px;
    height:2px;
    background:var(--brs-primary);
    border-radius:14px 0 0 0;
}

/* Panel header */
.dc-brs .dc-brs__panel-head{
    display:flex;
    flex-direction:column;
    gap:14px;
}
.dc-brs .dc-brs__panel-head-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}
.dc-brs .dc-brs__panel-logo{
    max-width:160px;
    max-height:56px;
    width:auto;
    height:auto;
    object-fit:contain;
    object-position:left center;
    opacity:1;
    transition:transform .4s ease;
}
.dc-brs .dc-brs__panel:hover .dc-brs__panel-logo{
    transform:scale(1.04);
}
.dc-brs .dc-brs__panel-badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 11px;
    background:rgba(160,192,64,.08);
    color:var(--brs-primary);
    font-size:9px;
    font-weight:800;
    letter-spacing:.18em;
    text-transform:uppercase;
    border-radius:100px;
    border:1px solid rgba(160,192,64,.16);
    white-space:nowrap;
}
.dc-brs .dc-brs__panel-badge::before{
    content:'';
    width:5px;
    height:5px;
    border-radius:50%;
    background:var(--brs-primary);
    animation:_dcBrsPulse 2s ease-in-out infinite;
}
@keyframes _dcBrsPulse{
    0%,100%{opacity:1; transform:scale(1);}
    50%    {opacity:.4; transform:scale(1.4);}
}

.dc-brs .dc-brs__panel-info{
    display:flex;
    flex-direction:column;
    gap:3px;
    padding-bottom:14px;
    border-bottom:1px solid var(--brs-border);
}
.dc-brs .dc-brs__panel-name{
    font-size:16px;
    font-weight:800;
    color:var(--brs-dark);
    letter-spacing:-.3px;
    line-height:1.2;
}
.dc-brs .dc-brs__panel-name--lg{font-size:18px;}
.dc-brs .dc-brs__panel-loc{
    font-size:11px;
    font-weight:600;
    color:var(--brs-muted);
    letter-spacing:.04em;
}

/* Sub-brands in panel */
.dc-brs .dc-brs__panel-brands{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin-top:14px;
}
.dc-brs .dc-brs__panel-sub{
    display:flex;
    align-items:center;
    gap:10px;
    padding:8px 10px;
    background:var(--brs-soft);
    border-radius:8px;
    font-size:12px;
    font-weight:600;
    color:var(--brs-dark);
    transition:all .3s ease;
}
.dc-brs .dc-brs__panel-sub:hover{
    background:rgba(160,192,64,.06);
}
.dc-brs .dc-brs__panel-sub img{
    width:22px;
    height:22px;
    object-fit:contain;
    object-position:center;
    flex-shrink:0;
    filter:grayscale(100%);
    opacity:.8;
}
.dc-brs .dc-brs__panel-sub-initial{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:22px;
    height:22px;
    border-radius:50%;
    background:var(--brs-primary);
    color:#fff;
    font-size:10px;
    font-weight:800;
    flex-shrink:0;
}
.dc-brs .dc-brs__panel-sub-loc{
    margin-left:auto;
    font-size:10px;
    color:var(--brs-muted);
    font-weight:500;
}

/* Floating accent badge */
.dc-brs .dc-brs__float-badge{
    position:absolute;
    bottom:-10px;
    right:10%;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:12px 20px;
    background:var(--brs-dark);
    color:#fff;
    font-size:12px;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
    border-radius:100px;
    box-shadow:0 16px 40px -12px rgba(43,41,38,.4), 0 0 0 1px rgba(160,192,64,.2);
    z-index:12;
    opacity:0;
    transform:translateY(20px) scale(.9);
    animation:_dcBrsFloatIn .9s cubic-bezier(.34,1.56,.64,1) 1.2s forwards;
}
.dc-brs .dc-brs__float-badge svg{
    color:var(--brs-primary);
    flex-shrink:0;
}
@keyframes _dcBrsFloatIn{
    to{opacity:1; transform:translateY(0) scale(1);}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
    .dc-brs *,
    .dc-brs *::before,
    .dc-brs *::after{
        animation-duration:.01ms !important;
        transition-duration:.01ms !important;
    }
}

/* ═════════ RESPONSIVE ═════════ */
@media (max-width:1200px){
    .dc-brs .dc-brs__layout{
        gap:48px;
        min-height:640px;
    }
    .dc-brs .dc-brs__visual{height:620px;}
}
@media (max-width:1024px){
    .dc-brs{padding:80px 0;}
    .dc-brs .dc-brs__layout{
        grid-template-columns:1fr;
        gap:64px;
        min-height:auto;
    }
    .dc-brs .dc-brs__visual{
        height:560px;
        max-width:640px;
        margin:0 auto;
    }
}
@media (max-width:768px){
    .dc-brs{padding:64px 0;}
    .dc-brs .dc-brs__container{padding:0 20px;}
    .dc-brs .dc-brs__visual{height:480px;}
    .dc-brs .dc-brs__panel{padding:14px;}
    .dc-brs .dc-brs__panel-name{font-size:14px;}
    .dc-brs .dc-brs__panel-logo{max-height:28px;}
    .dc-brs .dc-brs__stat-num{font-size:32px;}
    .dc-brs .dc-brs__stat{padding:14px 20px;}
    .dc-brs .dc-brs__float-badge{
        right:50%;
        transform:translateX(50%) translateY(20px) scale(.9);
        font-size:10px;
        padding:10px 16px;
    }
    @keyframes _dcBrsFloatIn{
        to{opacity:1; transform:translateX(50%) translateY(0) scale(1);}
    }
}
@media (max-width:520px){
    .dc-brs .dc-brs__visual{height:420px;}
    .dc-brs .dc-brs__panel{padding:12px;}
    .dc-brs .dc-brs__panel-brands{gap:6px;}
    .dc-brs .dc-brs__panel-sub{padding:6px 8px; font-size:11px;}
}