/*==================================================
CARA MEMBACA RTP LIVE
==================================================*/

.cara-rtp-live{

padding:90px 20px;

background:
linear-gradient(135deg,#03152f 0%,#07285e 45%,#0d6efd 100%);

position:relative;

overflow:hidden;

}

.cara-rtp-live::before{

content:"";

position:absolute;

width:500px;

height:500px;

left:-200px;

top:-200px;

background:radial-gradient(circle,#33c7ff44,transparent);

}

.cara-rtp-live::after{

content:"";

position:absolute;

width:450px;

height:450px;

right:-150px;

bottom:-150px;

background:radial-gradient(circle,#007bff33,transparent);

}

.cara-rtp-container{

max-width:1250px;

margin:auto;

position:relative;

z-index:2;

}

.cara-heading{

text-align:center;

max-width:860px;

margin:auto;

margin-bottom:60px;

}

.cara-badge{

display:inline-block;

padding:10px 20px;

background:#00b8ff;

color:#fff;

border-radius:50px;

font-size:13px;

font-weight:700;

margin-bottom:20px;

}

.cara-heading h2{

font-size:42px;

font-weight:800;

color:#fff;

margin-bottom:20px;

}

.cara-heading p{

color:#d8e7ff;

line-height:1.9;

font-size:17px;

}

.cara-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

gap:25px;

margin-bottom:60px;

}

.cara-card{

background:rgba(255,255,255,.06);

backdrop-filter:blur(15px);

border:1px solid rgba(255,255,255,.12);

border-radius:22px;

padding:35px;

transition:.35s;

position:relative;

}

.cara-card:hover{

transform:translateY(-10px);

box-shadow:0 20px 45px rgba(0,0,0,.35);

border-color:#3dbdff;

}

.cara-number{

position:absolute;

right:20px;

top:18px;

font-size:36px;

font-weight:900;

color:#2ea7ff33;

}

.cara-icon{

font-size:48px;

margin-bottom:20px;

}

.cara-card h3{

color:#fff;

font-size:22px;

margin-bottom:15px;

}

.cara-card p{

color:#d6e6ff;

line-height:1.8;

font-size:15px;

}

.rtp-info-box{

display:grid;

grid-template-columns:2fr 1fr;

gap:35px;

background:rgba(255,255,255,.05);

padding:40px;

border-radius:25px;

border:1px solid rgba(255,255,255,.12);

margin-bottom:45px;

}

.info-left h3{

font-size:30px;

color:#fff;

margin-bottom:18px;

}

.info-left p{

color:#dce8ff;

line-height:1.9;

}

.info-right ul{

list-style:none;

padding:0;

margin:0;

}

.info-right li{

padding:14px 18px;

margin-bottom:12px;

border-radius:14px;

background:rgba(255,255,255,.06);

color:#fff;

font-weight:600;

}

.cara-cta{

text-align:center;

}

.btn-rtp{

display:inline-block;

padding:18px 42px;

border-radius:16px;

background:linear-gradient(90deg,#0094ff,#4fc3ff);

color:#fff;

font-weight:700;

text-decoration:none;

box-shadow:0 10px 30px rgba(0,145,255,.35);

transition:.3s;

}

.btn-rtp:hover{

transform:translateY(-4px);

}

@media(max-width:992px){

.rtp-info-box{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.cara-heading h2{

font-size:30px;

}

.cara-heading p{

font-size:15px;

}

.cara-card{

padding:25px;

}

.rtp-info-box{

padding:25px;

}

.info-left h3{

font-size:24px;

}

.btn-rtp{

width:100%;

}

}