/* ==========================================================================
   BAECN - Student.css V2
   Version: 2.0
   Purpose: Student Solution Page
   ========================================================================== */

/* =========================
   1. HERO
========================= */
.student-hero{
    padding:110px 0 90px;
    background:linear-gradient(180deg,#fff 0%,#F7FBFD 100%);
}
.student-title{
    font-size:clamp(2.4rem,5vw,4rem);
    font-weight:800;
    line-height:1.15;
    color:#0F172A;
    margin:24px 0;
}
.student-title span{display:block;color:#15B9D9;}
.student-description{
    max-width:620px;
    font-size:18px;
    line-height:1.9;
    color:#64748B;
}
.hero-image{text-align:center;}
.hero-image img{
    width:100%;
    max-width:580px;
    filter:drop-shadow(0 30px 60px rgba(21,185,217,.18));
}

/* Shared Card */
.student-card{
    background:#fff;
    border:1px solid #E8EEF3;
    border-radius:24px;
    box-shadow:0 16px 40px rgba(15,23,42,.06);
    transition:.35s ease;
}
.student-card:hover{
    transform:translateY(-8px);
    border-color:#15B9D9;
    box-shadow:0 28px 60px rgba(21,185,217,.15);
}

/* =========================
   2. BENEFITS
========================= */
.student-benefits{padding:110px 0;background:#fff;}
.benefit-card{padding:36px 30px;text-align:center;height:100%;}
.benefit-card i,
.guideline-card i{
    width:72px;height:72px;
    margin:0 auto 24px;
    display:flex;align-items:center;justify-content:center;
    border-radius:20px;
    background:#15B9D9;color:#fff;font-size:30px;
}
.benefit-card h5,.guideline-card h5{
    font-size:22px;font-weight:700;color:#0F172A;margin-bottom:14px;
}
.benefit-card p,.guideline-card p{
    margin:0;color:#64748B;line-height:1.8;
}

/* =========================
   3. JOURNEY
========================= */
.student-journey{padding:110px 0;background:#fff;}
.student-journey .process-card{
    position:relative;
    padding:36px 30px;
    height:100%;
}
.student-journey .step-number{
    position:absolute;
    right:24px;top:22px;
    font-size:42px;font-weight:800;
    color:rgba(21,185,217,.08);
}
.student-journey .process-icon{
    width:72px;height:72px;
    display:flex;align-items:center;justify-content:center;
    border-radius:18px;
    margin-bottom:24px;
    background:#15B9D9;color:#fff;font-size:28px;
}

/* =========================
   4. PLATFORM EXPERIENCE
========================= */
.student-platform{padding:110px 0;background:#fff;}
.student-platform-card{
    overflow:hidden;
    height:100%;
}
.student-platform-image{
    background:#F7FBFD;
}
.student-platform-image img{
    width:100%;
    display:block;
}
.student-platform-content{padding:28px;}
.platform-label{
    display:inline-block;
    padding:6px 14px;
    border-radius:999px;
    background:#E8F9FD;
    color:#15B9D9;
    font-size:12px;
    font-weight:700;
    letter-spacing:.5px;
    text-transform:uppercase;
    margin-bottom:14px;
}
.student-platform-content h4{
    font-size:24px;
    font-weight:700;
    margin-bottom:12px;
    color:#0F172A;
}
.student-platform-content p{
    margin:0;
    color:#64748B;
    line-height:1.8;
}

/* =========================
   5. STUDENT REPORT
========================= */
.student-report{
    padding:110px 0;
    background:#F7FBFD;
}
.student-report-image{
    display:flex;
    justify-content:center;
    align-items:center;
    height:100%;
}
.student-report-image img{
    width:100%;
    max-width:560px;
    border-radius:24px;
    border:1px solid #E8EEF3;
    background:#fff;
    box-shadow:0 25px 60px rgba(15,23,42,.08);
}
.receive-item{
    display:flex;
    gap:18px;
    align-items:flex-start;
    margin-bottom:28px;
}
.receive-icon{
    width:58px;height:58px;
    flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
    border-radius:16px;
    background:#15B9D9;
    color:#fff;
    font-size:24px;
}
.receive-item h5{
    margin:0 0 8px;
    font-size:22px;
    font-weight:700;
    color:#0F172A;
}
.receive-item p{
    margin:0;
    color:#64748B;
    line-height:1.8;
}

/* =========================
   6. GUIDELINES
========================= */
.student-guidelines{padding:110px 0;background:#fff;}
.guideline-card{
    padding:36px 30px;
    text-align:center;
    height:100%;
}

/* =========================
   7. FAQ
========================= */
.student-faq{
    padding:110px 0;
    background:#F7FBFD;
}
.student-faq .accordion-item{
    border:none;
    border-radius:18px;
    overflow:hidden;
    margin-bottom:18px;
    box-shadow:0 10px 28px rgba(15,23,42,.06);
}
.student-faq .accordion-button{
    padding:22px 24px;
    font-weight:600;
    box-shadow:none;
}
.student-faq .accordion-button:not(.collapsed){
    background:#15B9D9;
    color:#fff;
}
.student-faq .accordion-body{
    padding:22px 24px;
    color:#64748B;
    line-height:1.9;
}

/* =========================
   8. CTA
========================= */
.student-cta{
    padding:110px 0;
    background:#fff;
}

/* =========================
   9. ANIMATION
========================= */
.student-card,
.student-platform-card,
.process-card,
.benefit-card,
.guideline-card{
    transition:.35s ease;
}
.student-platform-card:hover,
.process-card:hover,
.benefit-card:hover,
.guideline-card:hover{
    transform:translateY(-8px);
}

/* =========================
   10. RESPONSIVE
========================= */
@media (max-width:992px){
.student-hero,
.student-benefits,
.student-journey,
.student-platform,
.student-report,
.student-guidelines,
.student-faq,
.student-cta{padding:90px 0;}
.student-hero{text-align:center;}
.hero-image,.student-report-image{margin-top:40px;}
.receive-item{text-align:left;}
}
@media (max-width:768px){
.student-hero,
.student-benefits,
.student-journey,
.student-platform,
.student-report,
.student-guidelines,
.student-faq,
.student-cta{padding:70px 0;}
.student-description{font-size:16px;}
.student-platform-content{padding:22px;}
.student-platform-content h4,
.receive-item h5,
.benefit-card h5,
.guideline-card h5{font-size:20px;}
.receive-icon{width:50px;height:50px;font-size:20px;}
}






/* ==========================================================
   BAECN - Student Report V3
   ========================================================== */

.student-report{
    padding:110px 0;
    background:linear-gradient(180deg,#ffffff 0%,#F7FBFD 100%);
    position:relative;
    overflow:hidden;
}

/* Browser */

.report-browser{
    background:#fff;
    border:1px solid #E6EDF3;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 30px 80px rgba(15,23,42,.08);
}

.browser-header{
    height:58px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 22px;
    background:#F8FAFC;
    border-bottom:1px solid #E6EDF3;
}

.browser-dots{
    display:flex;
    gap:8px;
}

.browser-dots span{
    width:12px;
    height:12px;
    border-radius:50%;
}

.browser-dots span:nth-child(1){background:#FF5F57;}
.browser-dots span:nth-child(2){background:#FFBD2F;}
.browser-dots span:nth-child(3){background:#28C840;}

.browser-title{
    font-weight:600;
    color:#475569;
    font-size:15px;
}

.browser-body{
    padding:40px;
    background:#fff;
}

/* Dashboard */

.dashboard-card{
    background:#F8FBFD;
    border:1px solid #E8EEF3;
    border-radius:18px;
    padding:24px;
}

.dashboard-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.dashboard-header h5{
    margin:0;
    font-size:18px;
    font-weight:700;
    color:#0F172A;
}

.dashboard-header span{
    color:#15B9D9;
    font-weight:700;
}

.modern-progress{
    height:12px;
    border-radius:20px;
    background:#EAF2F5;
    overflow:hidden;
}

.modern-progress .progress-bar{
    background:linear-gradient(90deg,#15B9D9,#37D4F2);
    border-radius:20px;
}

.skill-item{
    margin-bottom:22px;
}

.skill-item:last-child{
    margin-bottom:0;
}

.skill-item span{
    display:block;
    margin-bottom:10px;
    font-weight:600;
    color:#334155;
}

.skill-bar{
    height:10px;
    background:#EAF2F5;
    border-radius:20px;
    overflow:hidden;
}

.skill-bar div{
    height:100%;
    border-radius:20px;
    background:linear-gradient(90deg,#15B9D9,#4AD7F3);
}

/* Career */

.career-widget{
    background:#15B9D9;
    color:#fff;
    border-radius:18px;
    padding:28px;
}

.career-widget h5{
    font-weight:700;
    margin-bottom:24px;
}

.career-item{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,.15);
}

.career-item:last-child{
    border-bottom:none;
    padding-bottom:0;
}

.ai-summary{
    background:#F8FBFD;
    border:1px solid #E8EEF3;
    border-radius:18px;
    padding:28px;
    text-align:center;
}

.summary-icon{
    width:72px;
    height:72px;
    margin:0 auto 20px;
    border-radius:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#15B9D9;
    color:#fff;
    font-size:32px;
}

.ai-summary h5{
    font-weight:700;
    margin-bottom:14px;
}

.ai-summary p{
    margin:0;
    color:#64748B;
    line-height:1.8;
}

/* Feature cards */

.report-feature-card{
    background:#fff;
    border:1px solid #E8EEF3;
    border-radius:22px;
    padding:34px 28px;
    height:100%;
    transition:.35s;
    box-shadow:0 16px 40px rgba(15,23,42,.05);
}

.report-feature-card:hover{
    transform:translateY(-8px);
    border-color:#15B9D9;
    box-shadow:0 28px 60px rgba(21,185,217,.15);
}

.feature-icon{
    width:68px;
    height:68px;
    border-radius:18px;
    background:#15B9D9;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    margin-bottom:24px;
}

.report-feature-card h4{
    font-size:22px;
    font-weight:700;
    margin-bottom:14px;
    color:#0F172A;
}

.report-feature-card p{
    margin:0;
    color:#64748B;
    line-height:1.8;
}

/* Highlight */

.student-report-highlight{
    margin-top:70px;
    background:linear-gradient(135deg,#15B9D9,#36D1EE);
    border-radius:24px;
    padding:40px 20px;
    color:#fff;
}

.highlight-item i{
    font-size:34px;
    display:block;
    margin-bottom:18px;
}

.highlight-item h5{
    font-weight:700;
    margin-bottom:8px;
}

.highlight-item p{
    margin:0;
    opacity:.9;
}

/* Responsive */

@media(max-width:992px){

.browser-body{
    padding:28px;
}

.career-widget,
.ai-summary{
    margin-top:24px;
}

.student-report{
    padding:90px 0;
}

}

@media(max-width:768px){

.student-report{
    padding:70px 0;
}

.browser-header{
    padding:0 15px;
}

.browser-title{
    font-size:13px;
}

.browser-body{
    padding:20px;
}

.dashboard-card,
.career-widget,
.ai-summary{
    padding:20px;
}

.report-feature-card{
    padding:26px 22px;
}

.feature-icon{
    width:58px;
    height:58px;
    font-size:24px;
}

.report-feature-card h4{
    font-size:20px;
}

.student-report-highlight{
    padding:30px 16px;
}

.highlight-item{
    margin-bottom:28px;
}

}