/* ================= GOOGLE FONT ================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&display=swap');


/* =========================
WRAPPER
========================= */

.kg-wrapper{
width:100%;
display:flex;
justify-content:center;
padding:80px 20px;
background:linear-gradient(180deg,#faf8f3,#f3eee7);
position:relative;
overflow:hidden;
font-family:'Cormorant Garamond',serif;
}

/* BACKGROUND VECTOR */

.kg-wrapper:before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:url("https://demo.kginnovation.in/wp-content/uploads/2026/03/Vector-scaled.jpg") center/cover no-repeat;
opacity:.10;
z-index:0;
}

/* CORNER DESIGN FIXED */

.kg-wrapper:after{
content:"";
position:absolute;
top:0;
right:0;
width:200px;
height:200px;
background:#efe8df;
border-bottom-left-radius:200px;
z-index:1;
}

/* BOTTOM CORNER */

.corner-bottom{
position:absolute;
bottom:0;
left:0;
width:200px;
height:200px;
background:#efe8df;
border-top-right-radius:200px;
z-index:1;
}

/* =========================
BOX
========================= */

.kg-product-box{
width:100%;
max-width:1100px;
background:#fff;
padding:60px;
border-radius:20px;
box-shadow:0 20px 60px rgba(0,0,0,0.08);
position:relative;
z-index:2;
}

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

.kg-accordion-item{
margin-bottom:20px;
border-radius:14px;
background:#fff;
box-shadow:0 8px 25px rgba(0,0,0,0.05);
border:1px solid #f0e7db;
overflow:hidden;
}

.kg-accordion-title{
display:flex;
justify-content:space-between;
align-items:center;
cursor:pointer;
padding:22px 30px;
font-size:22px;
font-weight:600;
color:#7d5e40;
letter-spacing:2px;
text-transform:uppercase;
}

.kg-icon{
width:28px;
height:28px;
background:#caa278;
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:18px;
border-radius:50%;
transition:.4s;
}

.kg-accordion-item.active .kg-icon{
transform:rotate(45deg);
}

.kg-accordion-content{
max-height:0;
overflow:hidden;
transition:max-height .5s ease;
padding:0 30px;
}

.kg-accordion-item.active .kg-accordion-content{
padding:15px 30px 30px;
}

/* =========================
TABLE
========================= */

.kg-table{
width:100%;
border-collapse:separate;
border-spacing:0;
font-size:18px;
border:1px solid #e4d6c3;
border-radius:10px;
overflow:hidden;
background:#faf8f5;
}

.kg-table tr:nth-child(odd){
background:#e9e1d7;
}

.kg-table td{
padding:18px 20px;
}

.kg-table td:first-child{
font-weight:600;
color:#7d5e40;
width:35%;
}

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

@media(max-width:768px){

.kg-product-box{
padding:35px 20px;
}

.kg-accordion-title{
font-size:18px;
}

.kg-table{
font-size:15px;
}

}


/* =========================
MORPH VIDEO SECTION
========================= */

#kgMorphSection{
position:relative;
background:white;
font-family:serif;
}

/* STICKY */

#kgMorphSection .kp-sticky{
position:sticky;
top:0;
height:100vh;
overflow:hidden;
}

/* MAIN VIDEO */

#kgMorphSection .kp-wide{
position:absolute;
width:100%;
height:100%;
transition:.7s ease;
z-index:1;
}

#kgMorphSection .kp-wide video{
width:100%;
height:100%;
object-fit:cover;
}

/* CENTER VIDEO */

#kgMorphSection .kp-center-wrap{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,20%);
opacity:0;
transition:all .8s ease;
z-index:2;
}

#kgMorphSection .kp-vertical{
width:360px;
height:500px;
}

#kgMorphSection .kp-vertical video{
width:100%;
height:100%;
object-fit:cover;
border-radius:28px;
box-shadow:0 40px 100px rgba(0,0,0,0.35);
}

/* PRODUCTS */

#kgMorphSection .kp-product{
position:absolute;
width:340px;
top:50%;
transform:translateY(40%);
opacity:0;
transition:all .8s ease;
z-index:3;
}

#kgMorphSection .kp-left{
left:6%;
}

#kgMorphSection .kp-right{
right:6%;
}

/* PRODUCT CARD */

.kp-showcase{
background:#f3efe9;
border-radius:32px;
padding:45px 30px;
text-align:center;
border:1px solid #e2c8a0;
box-shadow:
0 35px 80px rgba(0,0,0,0.18),
inset 0 0 60px rgba(201,167,122,0.15);
}

/* IMAGE */

.kp-showcase img{
width:250px;
margin-bottom:25px;
transition:.4s;
}

/* HOVER FLOAT */

.kp-showcase:hover img{
transform:translateY(-10px) scale(1.05);
}

/* TITLE */

.kp-showcase h3{
font-size:24px;
letter-spacing:2px;
color:#6a5436;
}

/* MOBILE */

@media(max-width:768px){

#kgMorphSection .kp-product{
display:none;
}

#kgMorphSection .kp-vertical{
width:220px;
height:320px;
}

}