.rc-cis{
display:grid;
grid-template-columns: 1.1fr 1fr;
align-items:start;
gap:48px;
}
@media (max-width: 1024px){
.rc-cis{ grid-template-columns:1fr; }
}
.rc-cis__heading{
font-weight:800;
text-transform:uppercase;
line-height:1.05;
font-size: clamp(28px, 3vw, 54px);
}
.rc-cis__divider{
margin: 24px 0 28px;
height: 2px;
width: 180px;
background: rgba(0,0,0,.8);
}
.rc-cis__grid{
display:grid;
grid-template-columns: 1fr 1fr;
gap: 18px;
}
.rc-cis__card{
display:block;
padding:22px;
background: rgba(0,0,0,.04);
text-decoration:none;
color: inherit;
position: relative;
transition: transform .2s ease, background-color .2s ease;
}
.rc-cis__card:hover{
transform: translateY(-2px);
} .rc-cis__card:hover{
background: transparent;
}
.rc-cis__card:hover::before,
.rc-cis__card:hover::after{
content:"";
position:absolute;
left:0;
width:100%;
height:2px;
background:#111;
}
.rc-cis__card:hover::before{ top:0; }
.rc-cis__card:hover::after{ bottom:0; }
.rc-cis__kpi{
font-size: 40px;
font-weight: 800;
line-height: 1;
margin-bottom: 10px;
}
.rc-cis__desc{
font-size: 12px;
text-transform: uppercase;
letter-spacing: .04em;
line-height: 1.25;
opacity: .9;
} .rc-cis__visual{
position:relative;
width:100%;
height:420px;
overflow:visible;
} .rc-cis__stack{
position:absolute;
inset:0;
background-image: var(--rc-cis-img);
background-size: cover;
background-position: center;
pointer-events:none;
background-color:#fff;
box-shadow: 0 10px 30px rgba(0,0,0,.18);
opacity: 1;
}
.rc-cis__stack.layer-1{
transform: translate(22px, 12px);
opacity:.55;
}
.rc-cis__stack.layer-2{
transform: translate(44px, 24px);
opacity:.35;
}
.rc-cis__stack.layer-3{
transform: translate(66px, 36px);
opacity:.20;
} .rc-cis__img-main{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
opacity:1;
transform: scale(1);
transition: opacity .22s ease, transform .35s ease;
box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
.rc-cis__visual.is-switching .rc-cis__img-main{
opacity:0.9;
transform: scale(1.01);
}