/* Homepage layout corrections, loaded only by the homepage. */
#hero .transparent-grid { min-width: 0; padding: 10px; overflow-wrap: anywhere; }
#why-choose .box-container { grid-template-columns: repeat(5, minmax(0, 1fr)); }
#why-choose .choose-box { width: 100%; min-width: 0; height: auto; min-height: 225px; padding: 30px 10px 20px; }
#why-choose .box-info-wrap { padding: 0; overflow-wrap: anywhere; }
#why-choose .box-container .choose-box:last-child { margin-right: 0; }
#program .program-card { height: auto; min-height: 400px; padding-top: 28px; padding-bottom: 28px; }
#program .program-card::before { inset: 0 12px; width: auto; height: auto; }
#program .program-card > img { position: absolute; inset: 0 12px; width: calc(100% - 24px) !important; height: 100%; }
#program .program-text { position: relative; inset: auto; transform: none; width: 100%; padding: 0 14px; display: flex; flex-direction: column; flex: 1; }
#program .program-text h5 { margin-top: 0; overflow-wrap: anywhere; }
#program .program-text p { height: auto; padding: 0; margin: 0 0 20px; }
#program .program-text .btn { margin: auto 0 0; padding: 10px 12px; }
#glimpse .glimpse-text { height: auto; min-height: 65px; padding: 10px; }
.video-slider-section .slider-wrapper { width: 100%; max-width: 1320px; padding: 0 60px 70px; }
.video-slider-section .thumbnail-wrapper { display: block; width: 100%; }
.video-slider-section .thumbnail-wrapper iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.video-slider-section .custom-control-prev,
.video-slider-section .custom-control-next { display: flex; top: auto; bottom: 0; transform: none; width: 48px; height: 48px; }
.video-slider-section .custom-control-prev { left: calc(50% - 58px); }
.video-slider-section .custom-control-next { right: calc(50% - 58px); }
#award .campus-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
#award .campus-link, #award .campus-box { width: 100%; min-width: 0; height: 100%; overflow-wrap: anywhere; }
@media (min-width: 1200px) and (max-width: 1399px) {
    .navmenu > ul > li { padding-left: 8px; padding-right: 8px; }
    .navmenu a, .navmenu a:focus { font-size: 14px; }
}
@media (max-width: 1199px) {
    .topbar { display: none; }
    .topbar-data { display: block; }
    .header { padding-top: 0; }
    .mobile-nav-toggle { margin-top: 0; line-height: 1; }
    .navmenu a, .navmenu a:focus { white-space: normal; }
    #why-choose .box-container { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
    #hero .innovation { font-size: clamp(30px, 5vw, 48px); padding-top: 100px; }
    #hero .admission-box { margin-top: 24px; height: auto; }
    #award .campus-info { padding-right: 0; }
    #student .stu-main-info { font-size: clamp(24px, 4vw, 40px); padding-left: 12px; }
}
/* Small laptops need a compact hero and wider cards than the desktop grid. */
@media (min-width: 992px) and (max-width: 1199px) {
    #hero { background-position: left top; }
    #hero .innovation { font-size: 40px; line-height: 1.25; padding-top: 80px; margin-top: 0 !important; text-align: left; text-wrap: balance; }
    #hero .header-list { font-size: 20px; line-height: 1.5; letter-spacing: 0; }
    #hero .transparent-grid { font-size: 20px; overflow-wrap: normal; }
    #hero .admission-box { padding: 24px; }
    #hero .admission-text { font-size: 18px; }
    #student .stu-main-info { font-size: 38px; padding-left: 12px; }
    #program .program-card { width: 50%; min-height: 360px; margin-top: 24px !important; }
    #student-development .dev-text { font-size: 16px; }
    #award .campus-info { padding-right: 0; }
}
@media (max-width: 767px) {
    #why-choose .box-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #why-choose .box-container .choose-box:last-child { grid-column: 1 / -1; width: calc(50% - 5px) !important; justify-self: center; }
    .video-slider-section .slider-wrapper { padding-left: 12px; padding-right: 12px; }
    #award .campus-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    #program .program-card { width: 100%; min-height: 320px; margin-top: 24px; }
    #hero .admission-box { padding: 24px 16px; }
    #hero .transparent-grid { font-size: 16px; }
    #student .student-banner { height: auto; min-height: 18rem; }
    #student .stu-main-info { font-size: 20px; }
    #student-development .dev-icon, #student-development .dev-icon:hover { width: 110px; height: 110px; }
    #student-development .dev-text { font-size: 16px; overflow-wrap: anywhere; }
}