/* =========================
COURSE HERO
========================= */

.course-hero{
padding:60px 0;
background:var(--bg-section-light);
}

.course-hero-grid{
display:grid;
grid-template-columns:2fr 1fr;
gap:50px;
align-items:start;
}

/* LEFT SIDE */

.course-hero-left h1{
font-size:38px;
margin:10px 0 15px;
}

.course-hero-left p{
color:var(--text-muted);
line-height:1.7;
max-width:650px;
}

.course-features{
display:flex;
flex-wrap:wrap;
gap:20px;
margin:20px 0 25px;
}

.course-features div{
display:flex;
align-items:center;
gap:6px;
font-size:14px;
color:var(--text-muted);
}

.course-features span{
font-size:20px;
color:var(--color-primary);
}

.course-hero-image{
width:100%;
border-radius:12px;
margin-top:20px;
}


/* =========================
SIDEBAR
========================= */

.course-sidebar{
display:flex;
flex-direction:column;
gap:25px;
}

/* PRICE BOX */

.course-price-box{
background:#fff;
padding:30px;
border-radius:12px;
box-shadow:var(--shadow-card);
text-align:center;
}

.course-price-box h3{
margin-bottom:10px;
}

.course-price{
font-size:36px;
font-weight:700;
color:var(--color-primary);
margin:10px 0;
}

.course-seat{
font-size:14px;
color:var(--text-muted);
margin-bottom:15px;
}

.course-price-box .hero-btn{
width:100%;
margin-bottom:10px;
}

.outline-btn{
display:block;
text-align:center;
border:1px solid var(--color-primary);
color:var(--color-primary);
padding:10px;
border-radius:6px;
font-weight:500;
}

/* COURSE INFO */

.course-info{
background:#fff;
padding:25px;
border-radius:12px;
box-shadow:var(--shadow-card);
}

.course-info h4{
margin-bottom:15px;
}

.course-info ul{
list-style:none;
padding:0;
}

.course-info li{
display:flex;
align-items:center;
gap:8px;
margin-bottom:10px;
font-size:14px;
color:var(--text-muted);
}

.course-info span{
color:var(--color-primary);
}


/* =========================
COURSE DESCRIPTION
========================= */

.course-description{
padding:60px 0;
}

.course-description h2{
margin-bottom:15px;
}

.course-description p{
max-width:750px;
line-height:1.7;
color:var(--text-muted);
margin-bottom:12px;
}


/* =========================
FEATURES SECTION
========================= */

.course-features-section{
padding:60px 0;
background:var(--bg-section-light);
}

.features-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;
margin-top:30px;
}

.feature-card{
background:#fff;
padding:25px;
border-radius:10px;
text-align:center;
box-shadow:var(--shadow-soft);
}

.feature-card span{
font-size:32px;
color:var(--color-primary);
margin-bottom:8px;
display:block;
}

.feature-card h3{
margin-bottom:6px;
}

.feature-card p{
font-size:14px;
color:var(--text-muted);
}


/* =========================
SUBJECTS
========================= */

.course-subjects{
padding:60px 0;
}

.subjects-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
margin-top:25px;
}

.subject-card{
background:#f7f8fc;
padding:20px;
border-radius:10px;
text-align:center;
}

.subject-card span{
font-size:28px;
color:var(--color-primary);
display:block;
margin-bottom:6px;
}



/* =========================
FACULTY
========================= */

.course-faculty{
padding:60px 0;
background:var(--bg-section-light);
}

.course-faculty h2{
text-align:center;
}

.faculty-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:30px;
margin-top:25px;
}

.faculty-card{
background:#fff;
padding:25px;
border-radius:10px;
box-shadow:var(--shadow-soft);
text-align:center;
overflow:hidden;
}

/* CENTER IMAGE PROPERLY */

.faculty-card img{
display:block;
width:100px;
height:100px;
border-radius:50%;
object-fit:cover;
margin:0 auto 12px auto;
}

.faculty-card h4{
margin:6px 0 4px;
font-size:18px;
}

.faculty-card p{
font-size:14px;
color:var(--text-muted);
}

/* =========================
SIDEBAR ENQUIRY FORM
========================= */

.sidebar-enquiry{
background:#fff;
padding:25px;
border-radius:10px;
box-shadow:var(--shadow-card);
}

.sidebar-enquiry h4{
margin-bottom:15px;
text-align:center;
}

.sidebar-enquiry input,
.sidebar-enquiry textarea{
width:100%;
padding:10px;
margin-bottom:10px;
border:1px solid #ddd;
border-radius:6px;
font-family:inherit;
}

.sidebar-enquiry textarea{
min-height:90px;
resize:vertical;
}

.sidebar-enquiry button{
width:100%;
}


/* =========================
RESPONSIVE
========================= */

@media (max-width:900px){

.course-hero-grid{
grid-template-columns:1fr;
}

.features-grid{
grid-template-columns:repeat(2,1fr);
}

.subjects-grid{
grid-template-columns:repeat(2,1fr);
}

.faculty-grid{
grid-template-columns:1fr;
}

}

@media (max-width:600px){

.features-grid{
grid-template-columns:1fr;
}

.subjects-grid{
grid-template-columns:1fr;
}

}

/* =========================
MOBILE FIXES
========================= */

@media (max-width:768px){

.course-description,
.course-features-section,
.course-subjects,
.course-faculty,
.course-enquiry{
text-align:center;
}

.course-description p{
margin-left:auto;
margin-right:auto;
}

}

/* WhatsApp Share */

.whatsapp-share{
display:flex;
align-items:center;
justify-content:center;
gap:6px;
margin-top:8px;
}

.whatsapp-share span{
font-size:18px;
}