/* =======================
SECTION
======================= */

#kpUniqueBlock01{
height:100vh;
display:flex;
align-items:center;
}

/* BOX */

#kpUniqueBlock01 .kp-box{
max-width:1600px;
width:100%;
margin:auto;
background:#f1f0ea;
border-radius:40px;
display:flex;
overflow:hidden;
height:90vh;
}

/* LEFT */

#kpUniqueBlock01 .kp-left{
width:40%;
padding:30px;
overflow-y:auto;
}

/* RIGHT */

#kpUniqueBlock01 .kp-right{
width:60%;
display:flex;
align-items:center;
justify-content:center;
}

#kpUniqueBlock01 .kp-right img,
#kpUniqueBlock01 .kp-right video{
width:100%;
height:100%;
object-fit:contain;
}

/* =======================
ACCORDION
======================= */

#kpUniqueBlock01 .kp-accordion{
background: linear-gradient(102deg, #DBB98F 68%, #B08A68 100%);
border-radius:20px;
margin-bottom:12px;
overflow:hidden;
border:none;
box-shadow: 0 8px 18px rgba(176, 138, 104, 0.35);
transition: all .3s ease;
}

/* HOVER EFFECT */

#kpUniqueBlock01 .kp-accordion:hover{
transform: translateY(-2px);
box-shadow: 0 12px 25px rgba(176, 138, 104, 0.45);
}

/* HEAD */

#kpUniqueBlock01 .kp-head{
padding:14px 18px;
display:flex;
justify-content:space-between;
align-items:center;
cursor:pointer;
font-size:14px;
font-weight:500;
color:#ffffff;
}

/* BODY */

#kpUniqueBlock01 .kp-body{
max-height:0;
overflow:hidden;
padding:0 18px;
transition:max-height .4s ease,padding .3s ease;
font-size:13px;
color:#ffffff;
line-height:1.6;
}

/* =======================
ACTIVE
======================= */

#kpUniqueBlock01 .kp-accordion.active{
background:#ffffff;
box-shadow:
0 12px 30px rgba(0,0,0,0.15),
0 6px 12px rgba(0,0,0,0.08);
}

/* GOLD TEXT */

#kpUniqueBlock01 .kp-accordion.active .kp-head{
background: linear-gradient(120deg,#BF953F,#FCF6BA,#B38728,#FBF5B7,#AA771C);
-webkit-background-clip:text;
background-clip:text;
-webkit-text-fill-color:transparent;
font-weight:800;
}

/* BODY TEXT */

#kpUniqueBlock01 .kp-accordion.active .kp-body{
max-height:180px;
padding:12px 18px 18px;
color:#5a4326;
font-size:14px;
}

/* PLUS */

#kpUniqueBlock01 .kp-plus{
transition:.3s;
font-weight:700;
color:#ffffff;
}

#kpUniqueBlock01 .kp-accordion.active .kp-plus{
transform:rotate(45deg);
color:#b38728;
}

/* SCROLL */

#kpUniqueBlock01 .kp-left::-webkit-scrollbar{
width:6px;
}

#kpUniqueBlock01 .kp-left::-webkit-scrollbar-thumb{
background:#b9b1a7;
border-radius:10px;
}

/* ==========================
TABLET
========================== */

@media (max-width:1024px){

#kpUniqueBlock01{
height:auto;
padding:40px 20px;
}

#kpUniqueBlock01 .kp-box{
flex-direction:column;
height:auto;
}

#kpUniqueBlock01 .kp-right{
width:100%;
height:420px;
order:1;
}

#kpUniqueBlock01 .kp-left{
width:100%;
order:2;
padding:25px;
}

}

/* ==========================
MOBILE
========================== */

@media (max-width:768px){

#kpUniqueBlock01{
padding:30px 15px;
}

#kpUniqueBlock01 .kp-box{
border-radius:25px;
}

#kpUniqueBlock01 .kp-right{
height:320px;
}

#kpUniqueBlock01 .kp-left{
padding:20px;
}

#kpUniqueBlock01 .kp-head{
font-size:14px;
padding:14px 16px;
}

}

/* ==========================
SMALL MOBILE
========================== */

@media (max-width:480px){

#kpUniqueBlock01 .kp-right{
height:260px;
}

#kpUniqueBlock01 .kp-head{
font-size:13px;
}

#kpUniqueBlock01 .kp-body{
font-size:12px;
}

}