/* SECTION */
#tuitionProSectionX{
    position:relative;
    padding:80px 20px;
    overflow:hidden;
    background: linear-gradient(90deg, #43cddb, #a66cff);
}

/* 🔥 BACKGROUND SHAPES */
.bgShapesWrapX{
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    z-index:0;
}

.shapeX{
    position:absolute;
    opacity:0.2;
    animation:floatX 10s infinite linear;
}

/* Square */
.squareX{
    width:80px;
    height:80px;
    background:#6366f1;
    top:20%;
    left:10%;
}

/* Small Square */
.smallX{
    width:40px;
    height:40px;
    top:70%;
    left:20%;
}

/* Cube (rotate square) */
.cubeX{
    width:70px;
    height:70px;
    background:#10b981;
    top:60%;
    left:80%;
    transform:rotate(45deg);
}

/* Circle */
.circleX{
    width:90px;
    height:90px;
    background:#ec4899;
    border-radius:50%;
    top:40%;
    left:50%;
}

/* Star */
.starX{
    width:60px;
    height:60px;
    background:#f59e0b;
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 
    68% 57%, 79% 91%, 50% 70%, 21% 91%, 
    32% 57%, 2% 35%, 39% 35%);
    top:10%;
    left:75%;
}

/* Animation */
@keyframes floatX{
    0%{transform:translateY(0) rotate(0deg);}
    50%{transform:translateY(-30px) rotate(180deg);}
    100%{transform:translateY(0) rotate(360deg);}
}

/* CONTENT */
.containerProX{
    position:relative;
    z-index:2;
    max-width:1000px;
    margin:auto;
    text-align:center;
}

.headingProX{
    font-size:30px;
    margin-bottom:10px;
}

.subHeadingProX{
    color:#666;
    margin-bottom:40px;
}

/* CARDS */
.gridProX{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.cardProX{
    display:flex;
    gap:15px;
    background:white;
    color: black;
    padding:20px;
    border-radius:12px;
    box-shadow:0 5px 15px rgba(0,0,0,0.08);
    transition:0.3s;
}

.cardProX:hover{
    transform:scale(1.05);
    box-shadow:0 15px 30px rgba(0,0,0,0.15);
}

/* ICONS */
.iconProX{
    width:40px;
    height:40px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:white;
}

.redX{background:#ef4444;}
.purpleX{background:#8b5cf6;}
.blueX{background:#3b82f6;}
.redLightX{background:#f87171;}

/* WHY */
.whyHeadingProX{
    margin-top:50px;
    margin-bottom:20px;
}

/* FEATURES */
.featureGridProX{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px;
}

.featureProX{
    background:white;
    color: black;
    padding:15px;
    border-radius:10px;
    box-shadow:0 5px 10px rgba(0,0,0,0.08);
    transition:0.3s;
}

.featureProX:hover{
    transform:translateY(-5px);
}

/* MOBILE */
@media(max-width:768px){

.gridProX{
    grid-template-columns:1fr;
}

.featureGridProX{
    grid-template-columns:1fr 1fr;
}

}

/* Card Layout */
.gridProX{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

/* Card */
.cardProX{
    display:flex;
    gap:15px;
    background:#ffffff;
    padding:20px;
    border-radius:14px;
    box-shadow:0 6px 18px rgba(0,0,0,0.08);
    transition:0.3s ease;
}

.cardProX:hover{
    transform:scale(1.04);
    box-shadow:0 15px 30px rgba(0,0,0,0.15);
}

/* Icon */
.iconProX{
    min-width:45px;
    height:45px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:18px;
}

.redX{background:#ef4444;}
.purpleX{background:#8b5cf6;}
.blueX{background:#3b82f6;}
.redLightX{background:#f87171;}

/* Content */
.cardContentProX h3{
    font-size:18px;
    margin-bottom:8px;
    display:flex;
    align-items:center;
    gap:10px;
}

/* Highlight Badge */
.highlightBadgeProX{
    background:linear-gradient(45deg,#ff4d4d,#ff7a7a);
    color:#fff;
    font-size:12px;
    padding:4px 8px;
    border-radius:20px;
    font-weight:bold;
}

/* Paragraph */
.cardContentProX p{
    font-size:14px;
    color:#555;
    line-height:1.6;
}

/* Responsive */
@media(max-width:768px){
    .gridProX{
        grid-template-columns:1fr;
    }
}