*{
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body{margin: 0;padding: 0;background-color: #DEEDF4;font-family: 'Inter', sans-serif;}
.container {max-width: 1240px;width: 100%;margin: 0 auto;}
/* HEADER */
header {padding: 16px 0;margin-top: 48px;}
.hamburger_btn{display: none;background-color: transparent;align-items: center; justify-content: center;border: unset;padding: 0;}
.mobile_menu{width: 30px;height: 20px;display: flex;align-items: center;justify-content: center;}
.mobile_menu img{width: 100%;height: 100%;}
.mobile_logo{display: none;}
.header_inner { display: flex;align-items: center;justify-content: space-between;}
.logo_box{font-size: 18px;font-weight: 700;width: 125px;height: 32px;display: flex;align-items: center;justify-content: center;}
.logo_box img{width: 100%;height: 100%;}
.nav_list {list-style: none;padding: 0;display: flex;align-items: center;margin-left: 40px;margin: 0;}
.nav_item {margin-right: 28px;padding: 10px;font-size: 20px;line-height: 120%;font-weight: 600;color: #2D2D2D;cursor: pointer;}
.nav_item a{list-style-type: none;color: #2D2D2D;cursor: pointer;text-decoration: unset;}
.nav_list .nav_item:last-child{margin-right: 0;}
.btn_primary {background: #005E86;color: #fff;padding: 8px 20px;border-radius: 6px;font-size: 16px;font-weight: 400;border: unset;cursor: pointer;}
.btn_primary:focus-visible{outline: unset;}
.btn_outline {background: transparent;border: 1px solid #005E86;color: #005E86;margin-left: 14px;border-radius: 6px;font-size: 20px;font-weight: 400;padding: 10px 20px;display: inline-flex;align-items: center;cursor: pointer;}
/* common css end */
.section_title {text-align: center;font-size: 36px;line-height: 130%;font-weight: 500;color: #000000;}
.section_desc{font-size: 24px;font-weight: 400;line-height: 130%;color: #000000;text-align: center;margin: 24px 0 48px;}
.card_label {font-size: 18px;font-weight: 500;line-height: 130%;color: #2D2D2D;}
.card_desc{margin: 0;font-size: 14px;font-weight: 400;color: #2D2D2D;}
section{padding: 120px 0;width: 100%;float: left;}
.mobile_view{display: none !important;}
.desktop_view{display: flex;}
/* Hero */
.hero_section {padding: 160px 0;width: 100%;position: relative;}
.hero_section::after{position: absolute;content: "";width: 725px;height: 810px;background-color: #F9FAFBB3;filter: blur(300px);top: -150px;left: 0;z-index: -1;}
.hero_section::before{position: absolute;content: "";width: 484px;height: 540px;background-color: #F9FAFBB3;filter: blur(300px);bottom: 23px;right: 0;z-index: -1;}
.hero_inner {display: flex;align-items: center;width: 100%;}
.hero_left {width: 40%;display: flex;flex-direction: column;float: left;}
.trust_badge {display: flex;align-items: center;line-height: 120%;background: #DEEDF4;color: #00A7C4;padding: 10px 16px;border-radius: 24px;font-size: 16px;font-weight: 600;margin-bottom: 16px;}
.list_elipse{display: inline-block;margin-right: 4px;height: 5px;min-width: 5px;border-radius: 100%;background: linear-gradient(90deg, #00A7C4 0%, #22CAE7 100%);}
.hero_title {font-size: 58px;line-height: 120%;letter-spacing: 1%;margin-bottom: 24px;margin-top: 0;color: #2D2D2D;}
.hero_title span {color: #007aff;background: linear-gradient(90deg, #005E86 0%, #00A7C4 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.hero_desc {margin: 0;font-size: 24px;line-height: 130%;font-weight: 400;color: #2D2D2D;margin-bottom: 32px; }
.hero_actions {display: flex;align-items: center;justify-content: flex-start;}
.started_btn{display: flex;align-items: center;font-size: 20px;}
.btn_icon_box{display: inline-flex;align-items: center;width: 16px;height: 16px;justify-content: center;margin-left: 10px;}
.btn_icon_box img{width: 100%;height: 100%; }
.hero_right {width: calc(60% - 85px);margin-left: 85px;float: left;}
.dashboard_mock {width: 100%;padding:40px 35px;height: 420px;background: #F3F4F5;border-radius: 16px;box-shadow: 0 10px 30px rgba(0,0,0,0.08); display: flex;align-items: center;justify-content: center;color: #888;position: relative;}
.dashboard_mock img{width: 100%; height: 100%;}
.active_student_box{position: absolute;bottom: -26px;left: -23px;background-color: #F9FAFB;padding: 20px 24px;border-radius: 7px;display: flex;align-items: center;box-shadow: 4px 4px 8.1px 0 #DCECF4;}
.students_icon_box{min-width: 44px;height: 44px;padding: 10px;background-color:#DEEDF4;border-radius: 10px;margin-right: 8px;display: flex;align-items: center;justify-content: center;}
.students_icon_box img{width: 100%;height: 100%; }
.count_no { display: flex;flex-direction: column;font-size: 18px;font-weight: 500;color: #2D2D2D;line-height: 120%;}
.count_label{font-size: 12px;font-weight: 400;color: #5E5E5E; margin-top: 2px;display: block;}
.timer_box{position: absolute;top: -42px;right: 42px;background-color: #F9FAFB;padding: 20px 24px;border-radius: 7px;margin-right: 8px; display: flex;align-items: center;justify-content: center;}
/* overview section css start */
.overview_section {position: relative;}
.overview_section::before{content: "";position: absolute;width: 620px;height: 540px;right: 0;top:-208px;background-color: #F9FAFBB3;filter: blur(300px);}
.overview_list {display: flex;width: 100%;align-items: center;}
.overview_card { width: calc(25% - 30px);display: flex;flex-direction: column;background: #F9FAFB;padding: 20px;border-radius: 14px;margin-right: 40px;}
.overview_card:last-child {margin-right: 0; }
.overview_card .card_label {margin: 12px 0 4px;}
.overview_card .card_icon{background-color: #F4E0DE;width: 44px;height: 44px;display: flex;align-items: center;padding: 10px;border-radius: 10px;justify-content: center;}
.card_icon img{width: 100%;height: 100%;}
/*solution section css */
.solution_section {padding:0;width: 100%; display: flex;flex-direction: column;position: relative;}
.solution_section::before{position: absolute;content: "";bottom: 57px;width: 540px;height: 400px;left: 0;background-color: #F9FAFBB3;filter: blur(300px);}
.solution_badge_row{display: flex;align-items: center;width: 100%;}
.solution_badge_row span{ height: 2px; background: #C7E3F0;width: 100%;}
.solution_button{text-wrap:nowrap;padding: 10px;width: fit-content;color: #00A7C4;font-size: 16px;line-height: 130%;font-weight: 600;background-color: #C7E3F0;border: unset;border-radius: 13px;}
.solution_card {margin: 120px 26px;background: #F9FAFB;padding: 50px 55px;border-radius: 28px;display: flex;flex-direction: column;align-items: center;}
.solution_features {display: flex;justify-content: center;flex-wrap: wrap;}
.feature_item {width: calc(33.33% - 16px);display: flex;align-items: center;margin-right: 24px;}
.solution_features .feature_item:last-child{margin-right: 0; }
.feature_icon {margin: 10px;min-width: 36px;height: 36px;padding: 6px; border-radius: 18px;background: #DEEDF4;display: flex;align-items: center;justify-content: center;}
.feature_icon img{width: 100%; height: 100%;}
.feature_text {font-size: 18px;font-weight: 500;line-height: 130%; color: #2D2D2D;margin: 0;}
/* Features section css */
.features_section {background: #F9FAFB;}
.control_row {width: 100%;display: flex;align-items: center;margin-top: 56px; }
.control_row > :first-child{margin-right: 100px; }
.control_text {width: calc(50% - 100px);display: flex;flex-direction: column;}
.control_item_title {font-size: 24px;font-weight: 500;color: #2D2D2D;letter-spacing: 1%;}
.control_item_desc {font-size: 20px;font-weight: 400;color: #5E5E5E;margin: 12px 0 20px;}
.control_points {list-style-type: none;padding: 0; margin: 0;}
.control_points li {display: flex;align-items: center;font-size: 16px;font-weight: 400;line-height: 130%;color: #2D2D2D;margin-bottom: 12px;position: relative;}
.control_points li:last-child{margin-bottom: 0;}
.control_point_icon{min-width: 30px;height: 30px;display: flex;align-items: center;justify-content: center;background-color: #DEEDF4;padding: 10px;border-radius: 18px;padding: 6px;margin-right: 8px;}
.control_point_icon img{width: 100%;height: 100%;}
.control_image {width: 50%;display: flex;align-items: center;justify-content: center;height: 423px;}
.control_image img{width: 100%; height: 100%;}
/* video section css */
.video_section {background: #005E86;}
.video_content_box{ max-width: 900px;width: 100%; margin: 0 auto;}
.video_title {text-align: center;color: #F9FAFB;}
.video_subtitle {color: #F9FAFB;}
.video_box {position: relative;width: 100%; height: 500px; background: #151D20; border-radius: 22px; display: flex;align-items: center;justify-content: center;flex-direction: column;}
.video_play_btn {padding: 40px;width: 120px;height: 120px;border-radius: 75px;border: none;background: #F9FAFB;color: #005e86;font-size: 24px;cursor: pointer;}
.video_play_btn img{ width: 100%;height: 100%;}
.video_hint { margin-top: 16px;font-size: 18px;line-height: 130%;font-weight: 500;color: #F9FAFB;}
.video_stats {display: flex;justify-content: center;align-items: center;margin-top: 48px;}
.video_stats .stat_item:last-child{margin-right: 0;}
.stat_item{ display: flex;flex-direction: column;width: fit-content;margin-right: 48px;}
.stat_item .label{display: block;line-height: 120%;font-size: 44px;font-weight: 600;color: #DEEDF4;}
.stat_item span {font-size: 18px;font-weight: 500;color: #DEEDF4;}
.divider{ display: block;width: 1px;height: 76px;background-color: #DEEDF4;margin-right: 48px;}
/* why section css */
.why_section { background: #F9FAFB;text-align: center;}
.why_title { margin: 0; font-size: 36px;font-weight: 500;color: #2D2D2D;}
.why_subtitle {margin: 12px 0 40px;font-size: 14px;color: #666;}
.why_card_list{display: flex; justify-content: center; width: 100%;flex-wrap: wrap;}
.why_card {width: calc(25% - 15px);margin-right: 20px;background-color: #DEEDF4;padding: 20px 28px;border-radius: 14px;display: flex;flex-direction: column;align-items: center;}
.why_card_list .why_card:last-child{margin-right: 0;}
.why_card_icon{height: 44px;width: 44px;background-color: #F9FAFB;border-radius: 10px;padding: 10px;display: flex;align-items: center;justify-content: center;}
.why_card .card_label{ margin: 12px 0 4px;}
/* business section css */
.business_desc{margin-bottom: 12px;}
.business_fit_row {width: 100%;display: flex;flex-wrap: wrap;padding: 0 95px;}
.business_fit_card { width: calc(50% - 18px);margin-right: 36px;background: #F9FAFB;padding: 20px 25px;border-radius: 10px;display: flex;align-items: flex-start; margin-top: 36px;}
.business_fit_row .business_fit_card:nth-child(even){margin-right: 0;}
.business_fit_icon {min-width: 44px;height: 44px;background: #DEEDF4;border-radius: 10px; padding: 10px;display: flex;align-items: center;justify-content: center;margin-right: 12px;}
.business_fit_icon img{ width: 100%; height: 100%;}
.business_fit_text{display: flex;flex-direction: column;}
/* CTA section css */
.cta_transform_section { background: #005E86;position: relative;}
.cta_transform_section::before{content: ""; position: absolute; width: 466px;height: 329px;bottom: 52px; left: 50%;transform: translateX(-50%);background-color: #4AC0F266;filter: blur(300px);}
.cta_content{display: flex;flex-direction: column;align-items: center;margin: 0 auto; max-width: 800px;width: 100%;}
.cta_title {text-align: center;margin: 0;line-height: 120%;font-size: 58px;font-weight: 600;color: #F9FAFB;}
.cta_desc {margin: 36px 0;font-size: 24px;font-weight: 400;color: #F9FAFB;text-align: center;}
.cta_transform_btn {display: flex;align-items: center;justify-content: center;background: #F9FAFB;color: #005E86;cursor: pointer;border-radius: 6px;font-size: 20px;font-weight: 400;line-height: 120%;padding: 10px 20px;border: unset;}
/* footer css */
.footer_main {padding: 120px 0; width: 100%;float: left;}
.footer_block{display: flex;align-items: flex-start;justify-content: space-between;}
.footer_left {max-width: 400px;width: 100%;justify-content: flex-start;display: flex;flex-direction: column;}
.footer_text {font-size: 16px;font-weight: 400;line-height: 130%;color: #2D2D2D;margin-top: 24px;margin-bottom: 0;}
.footer_right {width: calc(100% - 400px);display: flex;justify-content: flex-end;}
.footer_menu {display: flex;flex-direction: column;list-style: none;padding: 0;margin: 0 46px 0 0;}
.footer_right .footer_menu:last-child{ margin-right: 0;}
.footer_item {font-size: 18px;padding: 10px;font-weight: 500;color: #2D2D2D;margin-bottom: 10px;cursor: pointer;}
.footer_item:last-child {margin-bottom: 0;}
.footer_bottom {text-align: center;font-size: 20px;font-weight: 400;line-height: 126%;color: #5E5E5E;margin-top: 95px;}
/* Overlay */
.mobile_menu_overlay {position: fixed;inset: 0;background: rgba(0, 0, 0, 0.4);opacity: 0;visibility: hidden;transition: 0.3s ease;z-index: 998;}
/* Slide Panel */
.mobile_menu_panel {position: fixed;top: 0;left: -320px;width: 300px;height: 100vh;background: linear-gradient(180deg, #0a6b8f, #0b4f6c);padding: 0 20px 24px;transition: 0.3s ease; z-index: 999; display: flex;flex-direction: column;}
.mobile_nav_list li + li{margin-left: 28px;}
/* Active State */
.mobile_menu_panel.active { left: 0;}
.mobile_menu_overlay.active {opacity: 1;visibility: visible;}
/* Header */
.mobile_menu_header {display: flex;justify-content: space-between;align-items: center;}
.mobile_logo {font-size: 20px;font-weight: 700;color: #fff;}
/* Close Button */
.close_btn {background: none;border: none;font-size: 22px;color: #fff;cursor: pointer;}
/* Menu List */
.mobile_nav_list {list-style: none;padding: 40px 0 0;margin: 0;}
.mobile_nav_list li {margin-bottom: 26px;}
.mobile_nav_list a {padding: 10px;color: #F9FAFB;font-size: 20px;line-height: 120%;font-weight: 500;text-decoration: none;}
@media (max-width: 576px){
.desktop_view{display: none;}
.mobile_view{display: flex !important;}
.logo_box{font-size: 18px;font-weight: 700;width: 125px;height: 32px;display: flex;align-items: center;justify-content: center;}
.logo_box img{width: 100%;height: 100%;}
.hamburger_btn{display: flex;}
/* .nav_list{position:fixed;top:0;left:-100%;width:80%;height:100vh;background:linear-gradient(180deg,#005E86,#0077A8);flex-direction:column;padding:100px 24px;transition:0.3s ease;z-index:99;}
.nav_list.active{left:0;} */
.nav_item{display: none;}
header .btn_primary{display: none;}
header {padding:0;margin-top: 40px;}
.container{width: 100%;padding: 0 24px;}
section{padding: 40px 0;}
.hero_section{padding: 36px 0;}
.hero_section::before {width: 300px;height: 425px;top: 99px;}
.hero_section::after {width: 260px;height: 298px;top: -99px;}
.hero_inner {flex-wrap: wrap;}
.hero_left, .hero_right{width: 100%;}
.hero_right {margin-left: 0;}
.hero_title {font-size: 46px; margin-bottom: 10px;}
/* common css */
.section_title {font-size: 28px;padding: 0 12px;}
.section_desc{font-size: 20px; margin: 16px 0 24px; padding: 0 5px;}
/* hero section */
.dashboard_mock {width: 100%;height: 265px;display: flex;align-items: center;justify-content: center;padding: 0;margin-bottom: 16px;}
.hero_desc {font-size: 20px;margin-bottom: 24px;}
.hero_actions {padding: 0 32px;flex-wrap: wrap;}
.hero_actions button{width: 100%;display: flex;justify-content: center;padding: 10px 0;}
.started_btn{margin-bottom: 18px;}
.btn_outline{margin-left: 0;}
/* overview section css */
.overview_list {flex-wrap: wrap;padding: 0 35px;}
.overview_card {width: 100%;margin-right: 0;}
.overview_card + .overview_card{margin-top: 28px;}
.overview_section::before, .solution_section::before {display: none;}
.solution_badge_row {width: calc(100% - 48px);margin: 0 auto;}
.solution_card{margin: 48px 0 56px;padding: 36px 16px;}
.feature_item {width: 100%;margin-right: 0;}
br{display: none;}
.feature_item + .feature_item{margin-bottom: 24px;}
.features_section{padding-bottom: 0;}
.control_row {flex-wrap: wrap;margin: 24px 0 40px;}
.control_row .control_text {width: 100%;margin-right: 0;order: 2;}
.control_image {width: 100%;height: 235px; margin-bottom: 20px;}
.control_points li {margin-bottom: 10px;}
.control_row > :first-child {margin-right: 0;}
.video_box{margin-top: 4px;}
.stat_item, .divider{margin-right: 9px;}
.divider{height: 60px;}
.stat_item .label {font-size: 24px;}
.stat_item span {font-size: 10px;}
.video_stats{margin-top: 28px;}
.why_title {font-size: 28px;}
.video_box {margin-top: 4px;width: calc(100% - 20px);margin: 0 auto;}
.why_card{width: 100%; margin-right: 0;}
.why_card_list {padding: 0 30px;}
.why_card + .why_card{margin-top: 20px;}
.business_fit_row {padding: 0;margin-top: 24px;}
.business_fit_card {width: 100%;margin-right: 0;margin-top: 0;}
.business_fit_card + .business_fit_card{margin-top: 36px;}
.cta_title {font-size: 40px;}
.cta_desc {margin: 24px 0; font-size: 16px;}
.cta_transform_section::before {width: 300px;height: 215px;bottom: 74px;}
.footer_main {padding: 40px 0;}
.footer_text{margin-top: 16px;}
.footer_right{display: none;}
.footer_logo{display: block;}
.footer_bottom {margin-top: 56px;font-size: 16px;}
}