/*-----  wrapper : hide overflow  -------------------------------------------*/
.drc-wrapper{
    overflow:hidden;
    width:100%;
}

/*-----  each row : flex container, always 6 logos  -------------------------*/
.drc-row{
    display:flex;
    width:max-content;           /* let content decide width */
    animation-timing-function:linear;
    animation-iteration-count:infinite;
}

/*-----  logo cell : exactly 1/6 of viewport  -------------------------------*/
.drc-slide{
    flex:0 0 calc(100vw / 6);    /* 6 logos visible */
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px;
    box-sizing:border-box;
}



/*-----  movement  ----------------------------------------------------------*/
@keyframes scrollLeft{
    0%{transform:translateX(0);}
    100%{transform:translateX(-50%);}
}
@keyframes scrollRight{
    0%{transform:translateX(-50%);}
    100%{transform:translateX(0);}
}

/*-----  top row : left → right  -------------------------------------------*/
.drc-row-top{
    animation-name:scrollLeft;
    animation-duration:30s;   /* tweak speed here */
}

/*-----  bottom row : right → left  ----------------------------------------*/
.drc-row-bottom{
    animation-name:scrollRight;
    animation-duration:30s;
}


/*-----  logo cell : bigger square box  -------------------------------------*/
.drc-slide{
    flex:0 0 calc(100vw / 6);          /* still 6 per viewport */
    height:120px;                     /* ↑↑ HEIGHT YOU WANT */
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px;
    box-sizing:border-box;
}

/*-----  image fills the whole height, keeps ratio  -------------------------*/
.drc-slide img{
    width:auto;                        /* let height rule dominate */
    padding:20px;                  /* never overflow horizontally */
    object-fit:contain;
}

/*================  PHONE  =================*/
@media (max-width:600px){
    /* 3 logos per viewport */
    .drc-slide{ flex:0 0 calc(100vw / 3); }

    /* optional: bigger height on small screens if you want */
    .drc-slide{ width:auto;
	height:auto;
	padding:2px;}   /* ← tweak or remove */
}