/* Heaven Education — responsive & UI fixes */

/* Images */
.he-img { max-width: 100%; height: auto; }
.he-hero-banner { min-height: 11rem; position: relative; }
.he-hero-banner > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

img[src*="logo/"] { background: #071025; }

/* Header nav — texte blanc sur fond navy */
#main-header {
    background-color: #071025 !important;
}

#main-header #he-main-nav > ul > li > a[data-page],
#main-header #he-main-nav .nav-dropdown-toggle {
    color: rgba(255, 255, 255, 0.9) !important;
}

#main-header #he-main-nav > ul > li > a[data-page].nav-active {
    color: #E8D48B !important;
}

#main-header #he-main-nav > ul > li > a[data-page]:hover,
#main-header #he-main-nav .nav-dropdown-toggle:hover {
    color: #E8D48B !important;
}

/* Sous-menus desktop — fond clair + texte foncé */
#main-header .nav-dropdown-panel {
    background: #ffffff !important;
    border-color: rgba(201, 162, 39, 0.25) !important;
}

#main-header .nav-dropdown-panel a,
#main-header .nav-dropdown-panel a[data-page] {
    color: #1e293b !important;
}

#main-header .nav-dropdown-panel a:hover {
    color: #9A7B1A !important;
    background: #FAF8F4 !important;
}

/* Menu mobile — liens blancs lisibles */
#mobile-menu nav > a,
#mobile-menu .mobile-accordion-toggle {
    color: rgba(255, 255, 255, 0.95) !important;
}

#mobile-menu .mobile-accordion-panel a {
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: 0.9rem;
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
}

#mobile-menu .mobile-accordion-panel a:hover {
    color: #E8D48B !important;
}

#mobile-menu {
    padding-bottom: env(safe-area-inset-bottom, 0);
}

#mobile-menu nav > a,
#mobile-menu .mobile-accordion-toggle {
    min-height: 48px;
    align-items: center;
}

#mobile-menu-button {
    min-width: 44px;
    min-height: 44px;
}

/* Sections */
.he-section { padding-top: 3rem; padding-bottom: 3rem; }

@media (min-width: 1024px) {
    .he-section { padding-top: 5rem; padding-bottom: 5rem; }
}

/* Mobile ≤ 640px */
@media (max-width: 1023px) {
    .he-header-brand {
        max-width: calc(100% - 3.25rem);
    }
}

@media (max-width: 640px) {
    .he-topbar p { font-size: 9px; letter-spacing: 0.12em; }
    .he-topbar .mx-2 { margin-left: 0.35rem; margin-right: 0.35rem; }

    .logo-header { height: 44px; width: 44px; }

    .he-header-brand-mobile span {
        letter-spacing: 0.02em;
    }

    .hero-premium { padding-top: 1rem; padding-bottom: 2.5rem; }
    .hero-premium h1 { font-size: 1.75rem !important; line-height: 1.2 !important; }
    .hero-premium .inline-flex.rounded-full { flex-wrap: wrap; justify-content: center; text-align: center; max-width: 100%; }
    .hero-premium .inline-flex.rounded-full span:last-child { font-size: 10px; line-height: 1.3; }

    .btn-gold, .btn-outline-gold { width: 100%; justify-content: center; }

    .stat-block {
        border-right: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        padding-bottom: 1.25rem;
    }
    .stat-block:nth-child(2n) { border-right: none; }
    .stat-block:last-child { border-bottom: none; }

    .testimonial-card { padding: 1.25rem; }
    .testimonial-card::before { font-size: 2.5rem; left: 12px; }

    footer .flex.gap-2 { flex-direction: column; }
    footer .flex.gap-2 input { width: 100%; }
    footer .flex.gap-2 .btn-gold { width: 100%; }

    .he-institution-logo { width: 12rem !important; height: 12rem !important; }
    .he-cta-watermark { width: 10rem !important; height: 10rem !important; opacity: 0.08 !important; }
}

/* Tablette ≤ 1023px */
@media (max-width: 1023px) {
    #dynamic-content-wrapper section .text-4xl { font-size: 1.75rem; }
}

/* Pages internes (SPA) */
#dynamic-content-wrapper section > .relative.overflow-hidden {
    min-height: 10rem;
}
#dynamic-content-wrapper section > .relative.overflow-hidden > img {
    width: 100%;
    height: 100%;
    min-height: 10rem;
    object-fit: cover;
}

#dynamic-content-wrapper table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 640px) {
    :root { --he-layout-width: 94vw; }
}