/* Shared responsive rules follow the page-specific styles. */
*, *::before, *::after { box-sizing: border-box; }
main img { max-width: 100%; }
main :is(p, h1, h2, h3, a, td) { overflow-wrap: anywhere; }
.main-header .search-icon a { padding: 12px; }
.main-header .main-nav { gap: 24px; }
.main-header .main-nav > ul { gap: 16px; }
.main-header .main-nav > ul > li > a { white-space: nowrap; }
.mobile-menu { overflow-x: hidden; visibility: hidden; }
.mobile-menu.open { visibility: visible; }
.mobile-menu .open-submenu, .mobile-menu .back-btn {
    background: none; border: 0; font: inherit; text-align: left;
}
.mobile-menu .open-submenu { width: 100%; margin: 0; padding: 10px 0; }
.mobile-menu .back-btn { min-width: 44px; min-height: 44px; }
.mobile-menu a { display: block; padding: 10px 0; }
.mobile-menu ul li { margin: 4px 0; }
.mobile-menu .submenu-screen { height: auto; min-height: 100%; visibility: hidden; }
.mobile-menu.submenu-active .submenu-screen { visibility: visible; }
.mobile-menu.submenu-active #mainMenu { visibility: hidden; }
.mobile-menu .login-btn { margin-top: 24px; padding-top: 24px; }
body.menu-open { overflow: hidden; }
main .coach-profile-section .coach-grid { grid-template-columns: minmax(0, 35fr) minmax(0, 60fr); }
main :is(.director-box, .director-content, .coach-left, .coach-right, .trainer-content, .form-group) { min-width: 0; }
main .coach-title::after { max-width: 100%; }
main .support-text { width: auto; margin-right: 20px; }

/* Keep navigation in normal flow so all heroes start below it. */
@media (max-width: 1199.98px) {
    .main-header { display: none; }
    .mobile-header { display: block !important; position: sticky; padding: 12px 16px; height: 75px; }
    .mobile-header-container { height: 50px; }
    .mobile-logo img { max-width: 100%; height: 46px; }
    .hamburger-btn, .mobile-search-btn { min-width: 44px; min-height: 44px; flex-shrink: 0; }
    .mobile-menu { display: block !important; top: 75px; width: min(90%, 380px); height: calc(100dvh - 75px); padding: 20px; }
    .mobile-menu .submenu-screen { padding: 20px; }
    .menu-overlay.show { display: block !important; top: 75px; height: calc(100dvh - 75px); }
    main .hero-slider { padding-top: 0; }
    main .evaluation-hero { padding-top: 60px; }
    main .directors-grid { flex-direction: column; gap: 32px; }
    main .director-box { width: 100%; }
}
@media (min-width: 1200px) {
    .mobile-header, .mobile-menu, .menu-overlay { display: none !important; }
}
@media (max-width: 991.98px) {
    main .coach-profile-section .coach-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    main .trainer-row { flex-direction: column; align-items: center; padding: 0 20px; gap: 24px; }
    main .trainer-content { width: 100%; margin: 0 !important; }
    main .trainer-logo img { width: 280px; }
    main .request-form { width: 100%; max-width: 630px; }
    main :is(input, select, textarea) { font-size: 16px !important; min-width: 0; max-width: 100%; }
}
@media (max-width: 768px) {
    main .support-text { margin: 0 0 36px; }
    main .support-item { margin-left: 0; padding-left: 40px; margin-bottom: 36px; }
    main .support-item ul li { padding-left: 28px; }
    main .pinnacle-directors .container { padding: 0 16px !important; }
    main .pinnacle-directors .director-content { padding: 0 !important; }
    main .pinnacle-directors .director-img img { max-width: 360px !important; }
    main .outer-card { padding: 16px; }
    main .coach-body { padding: 18px; }
    main .t-card .teams { flex-wrap: wrap; gap: 8px; }
    main .t-card .teams span { margin-right: 0; }
    main .buku-img { height: auto; min-height: 0; }
    main :is(.section-title, .trip-title, .alumni-title, .alumni-ncaa h2, .trainer-title, .exposure-title) {
        font-size: clamp(24px, 5vw, 30px); line-height: 1.3; padding-inline: 12px;
    }
    main .exposure-banner-text { font-size: clamp(23px, 5vw, 30px); }
    main .exposure-desc { padding-inline: 20px; }
    main .pinnacle-description p { text-align: left; }
    .site-footer { padding: 24px 60px 24px 16px; }
    .site-footer p { margin: 0; }
    .scroll-top { right: 12px; bottom: 16px; width: 44px; height: 44px; z-index: 10; }
}
@media (hover: none) {
    main .swiper-button-next, main .swiper-button-prev {
        opacity: 1; visibility: visible; width: 44px; height: 44px; margin-top: 0;
    }
}